제플린을 사용하는 디자이너와 협업하기

많은 디자이너들이 제플린을 사용해서 디자인을 하는데 개발자와 사용하는 언어나 수치 측정 방법이 다르다보니 가이드를 코드로 옮기는데 어려울때가 있습니다.

그럴때 대충 개발자의 눈(?)으로 때려 맞춘적도 여러번 있었는데 정확한 개념을 알게되어 복기 및 공유 차원에서 작성합니다.

lineSpacingExtra , lineSpacingMultiplier

textView의 줄간격을 조정하는 attribute들 입니다.

 

lineSpacingExtra 

줄 사이 간격을 dp 값으로 조정하며 기본 값은 0dp입니다. 글자 크기에 상관 없이 고정 값으로 디자이너가 전달해준 제플린 가이드를 참고하면 생각보다 큰 값이 넘어옵니다. 

'Line Height' 는 말 그대로 줄 전체의 높이로 [글자 크기] + [입력 값] = [Line Height] 를 뜻합니다.

해당 가이드 textView의 'textSize'= 14dp, 'lineSpacingExtra'=7dp로 설정하면 받은 가이드와 동일하게 보입니다. 

 

lineSpacingMultiplier

textView 크기에 따라 비율로 조정되며 기본 값은 1입니다. 그러므로 글자 크기가 증가하면 줄 간격또한 증가합니다. 

[글자 크기] x [입력 값] = [Line Height] 입니다.

 

 

 

 

※해당 포스팅은 지극히 주관적인 내용으로 저자의 복기 목적으로 작성된 것이고, 내용에대해 수정이나 추가 요청은 언제든 환영합니다.