SwiftUI - 긴 글자 Text에서 일부만 표현하기 (with truncationMode)

Text로 글자를 표현하고 싶을 때 글이 너무 길어 ...으로 처리하고 싶을 때 truncationMode를 사용합니다

 

 

 

 

 

 

위에 같이 Text에서 글이 너무 길면 뒤에 내용이 •••으로 처리되어 해결할 수 있습니다.

 

만약 너무 길면 UI가 깔끔해지지 않기 때문에 2번째 사진처럼 해결하는 경우가 대부분입니다.

 

해결방법

방법은 turncationMode를 사용하는 것입니다.

 

truncationMode 사용 전

truncationMode를 사용하지 않으면 아래 코드처럼 사용되지만

Text(movie.title)
    .foregroundStyle(Color.white)

 

truncationMode 사용 후

truncationMode를 사용하게 된다면 다음과 같습니다. 이때 truncationMode 는 3가지 종류가 있으며 •••를 처리할 부분을 설정할 수 있습니다. tail, middle, head 3가지 종류가 있으며 각각 tail는 뒷부분을 •••로 처리하며 middle은 중간, head는 앞부분을 처리합니다.

Text(movie.title)
    .foregroundStyle(Color.white)
    .lineLimit(1)
    .truncationMode(.head)

Text(movie.title)
    .foregroundStyle(Color.white)
    .lineLimit(1)
    .truncationMode(.middle)

Text(movie.title)
    .foregroundStyle(Color.white)
    .lineLimit(1)
    .truncationMode(.tail)

1번째(.head) 2번째(.middle) 3번째(.tail)