SwiftUI - Text(문자열 뷰)의 주요 수식어 살펴보기

SwiftUI Text

SwiftUI의 가장 기초적인 뷰의 종류의 하나인 Text에 대해서, 또 Text의 수식어에 대해서 살펴보겠습니다. 여기서 수식어라는 것은 뷰가 가지고 있는 함수들을 일컫는 말이라고 합니다.

 

UI를 자신이 원하는데로 꾸미기 위해서는 이 수식어들을 정확하게 알 필요가 있습니다. Text가 가지고 있는 주요 수식어들이 어떠한 역할을 하는지 차례차례 차근차근 살펴보도록 하겠습니다.

1. Text의 수식어

1.1 font는 글자의 크기, fontWeight는 글자 굵기

그림) font 수식어

그림) fontWeight 수식어

그림) foregroundColor 수식어

그림 "font 수식어" 에 Text 뷰에서 엔터 키를 친 후 .을 찍으면 여러 가지 수식어가 나오는데, 그 중에서 font를 선택합니다. 다시 괄호 안에 ,을 찍게되면 여러 가지 프로퍼티들을 선택할 수 있습니다.

 

V로 표시된 프로퍼티들을 적용하게 되면 글자의 크기가 변경되는 것을 확인할 수 있습니다. 해당 단어를 보시면 글자의 크기가 어떻게 변경될 지 직관적으로 추측이 가능합니다.

 

그림 "fontWeight 수식어" 에서도 위에 font에서 설명 드렸던 것처럼 다양한 프로퍼티들을 선택하여 글자의 굵기를 조정할 수 있습니다. 그림 "foregroundColor 수식어" 도 마찬가지고요, 각각 하나씩 적용해보세요.

 

그림) title3 font, bold Weight, black color 적용한 Text 뷰

1.2 서체 수식어

1.1 에서 설명한 대표적인 수식어들 말고도 문서 작업에 자주 쓰는 표현들을 살펴보겠습니다.

1) 서체 -> .bold() // 볼드체 , .italic() //이탤릭 체, .custom("서체", size: 10) // 커스텀 채

2) 밑줄 -> .underline(), 취소선 -> .strikethrough()

1.2 공간과 관련된 수식어

1) .lineLimit(X) // 말 그대로 문자열을 제한 하는 것인데, X만큼만 쓰고 다음 줄로 표시하게 만듭니다.

2) .fixedSize() // 문자열이 나타날 공간이 부족하더라도 표현합니다.

3) .kerning(X) // X 만큼의 자간을 조정합니다.

4) .baselineOffset(X) // 문자열의 시작 지점 즉 기준선을 X만큼 당깁니다.

 

SwiftUI를 공부하면서 글을 작성하다보니 많이 부족하거나, 오류가 있을 수도 있으니 양해 부탁드리며, 발견하면 수정하도록 하겠습니다. 읽어주셔서 감사합니다.