(Compose) Text

안녕하세요! 이번 글에서는 Jetpack Compose를 공부하시는 분들이 가장 먼저 만나게 되는 컴포넌트 중 하나인 Text 컴포넌트에 대해 소개해보려고 합니다.

 

Text 컴포넌트란?

Text 컴포넌트는 화면에 글자를 보여주는 가장 기본적인 컴포넌트입니다.

XML 시대에는 <TextView>를 썼지만, Compose에서는 Text() 함수를 사용합니다.

 

사용법도 매우 직관적입니다.

Text(text = "안녕하세요, Compose!")

이렇게 한 줄만 작성해도 화면에 "안녕하세요, Compose!"라는 글자가 나타납니다.

 

Text의 다양한 속성

Compose의 Text는 단순히 문자열만 출력하는 용도가 아닙니다.

여러 가지 속성을 조합해 글자 스타일을 쉽게 바꿀 수 있습니다.

Text(
    text = "안녕하세요, Compose!",
    color = Color.Blue, // 색상 blue
    fontSize = 20.sp, // 크기 20sp
    fontWeight = FontWeight.Bold // 볼드체
)

이렇게 글자를 다양한 형태로 보여줄 수 있는 속성들이 있습니다.

 

이런 스타일을 더욱더 심화로 커스텀하기 위해서는 TextStyle을 활용합니다.

Text(
    text = "Compose로 스타일링!",
    style = TextStyle(
        fontSize = 18.sp,
        fontWeight = FontWeight.Medium,
        letterSpacing = 1.sp
    )
)

 

최대 줄 수를 지정하고 넘치는 경우 ... 으로 생략할 수도 있습니다.

Text(
    text = "이 문장은 꽤 길어서 여러 줄에 걸쳐 보여질 거예요.",
    maxLines = 2,
    overflow = TextOverflow.Ellipsis
)

 

마무리

이렇게 Compose Text를 사용하면 정말 간단하게 글자를 보여줄 수 있고, 여러 형태의 스타일도 쉽게 추가할 수 있습니다.

---

블로그 글에 대해 궁금한 점이 있다면 아래 카카오톡 오픈채팅에 들어와서 질문해주세요

Android Kotlin Compose QnA