[Android] TextView 자동 크기 조절

케니스·2023년 2월 9일

Android

목록 보기

2/2

Photo by Mel Poole on Unsplash

요구사항

안드로이드 개발을 하다가보면 하나의 다음과같은 요구사항이 생기는 상황이 생깁니다.

TextView 안에 2줄일 때는 14sp, 텍스트가 만약에 길어질 때는 3줄로 제한하면서 12sp로 변경

이런 요구사항을 어떻게 해결할 수 있을까요? 글자 수 초과 시 텍스트 사이즈를 변경하는 코드를 만들거나 Canvas를 이용해 글자의 범위가 넘어가면 측정하는 로직을 따로 작성할 수 있지만 단순한 동작을 위해 너무 많은 작업이나 코드를 생산하게 되는 일이 발생합니다.

다행히 안드로이드에서는 Android 8.0(API 26)이상을 사용한다면 TextView에 해당 기능을 지원하고 있습니다. 그 이전 버전은 AppCompat을 사용하여 다루어야하고 최소 버전은 4.0(API 14) 이상입니다.

그럼 실제로 어떠한 상황에서 쓰여야하는지 살펴보겠습니다.

위 사진은 29cm의 상품리스트 화면입니다. 상품의 설명으로 커피잔 세트... 으로 간단하게 설명이 되어 있지만 이 TextView에 더 많은 텍스트를 넣기위해 3줄을 허용하게 변경하는 요구사항이 발생할 수 있습니다.

이 경우에 기존 2줄의 높이는 유지하면서 3줄의 조금 더 작은 텍스트사이즈의 설명이 들어가게 하려면 안드로이드에서 제공하는 자동 크기 조절기능을 이용해 해결할 수 있습니다.

TextView 자동 크기 조절은 크게 3가지로 나누어 작업할 수 있습니다.

기본 : autoSizeTextType만 지정한 방법
세부사항 : 텍스트의 최소, 최대, 단위를 구성한 방법
미리 정의한 크기 : 텍스트 크기의 배열을 이용한 방법

⚠️ 텍스트 크기 조절 기능을 이용한다면 TextView의 width, height 속성을 wrap_content 로 지정해서는 안됩니다.

기본

기본을 정의하는 방법은 간단합니다. xml에서 autoSizeTextType을 uniform으로 지정하거나 프로그래매틱 방법으로는 TextView의 setAutoSizeTextTypeWithDefaults(int autoSizeTextType) 함수를 호출해서 적용할 수 있습니다.

<TextView
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:autoSizeTextType="uniform" />

📘 기본값으로 적용되는 텍스트 사이즈는 최소(12sp), 최대(112sp), 단위(1px)로 지정됩니다.

세부사항

세부사항을 정의하는 방법은 기본값을 지정하는 방법에 더해서 최소, 최대, 단위를 추가해 구성하는 방법입니다.

<TextView
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:autoSizeTextType="uniform"
    android:autoSizeMinTextSize="12sp"
    android:autoSizeMaxTextSize="100sp"
    android:autoSizeStepGranularity="2sp" />

각 옵션들에 대한 설명

autoSizeMinTextSize : 텍스트 사이즈가 조절될 때 최소 사이즈
autoSizeMaxTextSize : 텍스트 사이즈가 조절될 때 최대 사이즈
autoSizeStepGranularity : 텍스트 사이즈 조절 시 사이 단계의 크기

미리 정의한 크기

최소, 최대값등을 정의하지 않고도 텍스트 크기 조절을 지정한 사이즈 리스트에만 한정하는 방법이 있습니다.

<resources>
  <array name="autosize_text_sizes">
    <item>10sp</item>
    <item>12sp</item>
    <item>20sp</item>
    <item>40sp</item>
    <item>100sp</item>
  </array>
</resources>

텍스트 크기 변경의 범위를 배열의 형태로 지정합니다.

<TextView
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:autoSizeTextType="uniform"
    android:autoSizePresetSizes="@array/autosize_text_sizes" />

autoSizePresetSizes에 배열을 지정합니다.

적용해보기

아까의 요구사항을 위의 내용들을 이용해 적용해보겠습니다.

<TextView
  android:id="@+id/content"
  android:layout_width="0dp"
  android:layout_height="64dp"
  android:autoSizeTextType="uniform"
  android:autoSizeMaxTextSize="16sp"
  android:autoSizeMinTextSize="8sp"
  android:autoSizeStepGranularity="1sp"
	...
  />