HOME > android > feature

안드로이드 - Autosizing TextView 구현 방법

By JS | 24 Jan 2018

Autosizing TextView는 TextView 내에서 글자 양에 따라 자동으로 글자 크기를 조절해주는 기능입니다. 기존에는 코드로 세세하게 글자 크기를 조절할 수 밖에 없었는데요, 이 기능을 사용하면 쉽게 TextView의 가독성을 높일 수 있습니다.

글자의 크기는 TextView의 공간과 글자 수에 따라서 알맞게 변경해주는데요, 변경될 글자 크기를 설정할 수 있습니다. 옵션들에는 선형적으로 증가 또는 감소하는 Granularity가 있고, 주어진 Size들에서만 변경이 되는 Preset Size가 있습니다.

이 기능은 Support Library 26에서 지원하며 Android 4.0(API 14)이상의 디바이스에서 동작합니다.

프로젝트 생성하기

[File] >> [New] >> [New Project]에서 Empty Activity를 선택하시고 새 프로젝트를 생성해주세요. (Compile SDK는 API 26입니다.)

프로젝트를 생성하면 MainActivity.java와 activity_main.xml 파일이 생성됩니다.

Default

Default는 Granularity의 기본 설정을 말합니다. TextView에 autoSizeTextType="uniform"로 선언하면 Default로 사용할 수 있습니다.

Default의 기본 옵션은 minTextSize = 12sp, maxTextSize = 112sp, and granularity = 1px이고, Text size의 범위를 최소 12sp ~ 최대 112sp사이에, 1px을 threshold로 size를 조절합니다.

주의할 점은 이 기능을 사용할 때 TextView의 layout_width 또는 layout_height 속성에 wrap_content로 설정하는 것은 권장하지 않는다고 합니다. 직접 layout_height에 wrapcontent를 넣어보면 Text size가 변경되지 않는 것을 볼 수 있는데요. 이처럼 예상치 못한 결과를 볼 수 있다고 합니다. (아마도 TextView의 크기가 고정된 상태에서 알맞은 Text size를 예상하기 때문에 `wrapcontent`는 권장하지 않는 것 같습니다.)

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.codechacha.autosizingtextviews.MainActivity">

    <TextView
        android:id="@+id/tv_text"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:autoSizeTextType="uniform"
        app:layout_constraintTop_toTopOf="parent"/>

</android.support.constraint.ConstraintLayout>
autosizing-textviews

Granularity

Granularity는 min, max size와 granularity를 원하는 값으로 설정하는 것을 말합니다. 다른 속성은 Defaut와 동일하고, 추가로 autoSizeMinTextSize, autoSizeMaxTextSize, autoSizeStepGranularity 속성을 사용할 수 있습니다.

아래 코드처럼 Text size는 최소 30sp ~ 최대 80sp까지, granularity 값은 5dp로 설정할 수 있습니다.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.codechacha.autosizingtextviews.MainActivity">

    <TextView
        android:id="@+id/tv_text"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:autoSizeTextType="uniform"
        android:autoSizeMinTextSize="30sp"
        android:autoSizeMaxTextSize="80sp"
        android:autoSizeStepGranularity="5dp"
        app:layout_constraintTop_toTopOf="parent"/>

</android.support.constraint.ConstraintLayout>

Text size와 Granularity(size가 변경되는 정도)가 달라졌습니다. autosizing-textviews

Preset Sizes

Preset sizes는 미리 정의해 준 size 내에서만 Text size가 변경되는 것을 말합니다.

/res/values/arrays.xml에 사용 가능한 size를 정의해야 합니다. 파일이 없다면 파일을 만들고 아래 코드처럼 정의합니다.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <array name="autosize_text_sizes">
        <item>10sp</item>
        <item>12sp</item>
        <item>20sp</item>
        <item>40sp</item>
        <item>100sp</item>
    </array>
</resources>

XML에서 TextView의 autoSizeTextType="uniform"는 동일하고 autoSizePresetSizes에 미리 정의한 size들이 있는 arrays를 설정하면 됩니다.

Android는 미리 정의된 size들 중에서 TextView에 맞는 size를 설정해 줍니다.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.codechacha.autosizingtextviews.MainActivity">

    <TextView
        android:id="@+id/tv_text"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:autoSizeTextType="uniform"
        android:autoSizePresetSizes="@array/autosize_text_sizes"
        app:layout_constraintTop_toTopOf="parent"/>

</android.support.constraint.ConstraintLayout>
autosizing-textviews

Java에서 설정

Java에서도 TextViewCompat객체를 통해 Autosizing textviews 기능을 사용할 수 있습니다.

Default로 설정을 하려면 TextViewCompat.setAutoSizeTextTypeWithDefaults()를 사용하면 됩니다.

mTextView.setText(s);
TextViewCompat.setAutoSizeTextTypeWithDefaults(mTextView,
          TextViewCompat.AUTO_SIZE_TEXT_TYPE_UNIFORM);

Granularity와 Preset sizes로 설정을 하려면 아래 method를 사용하면 됩니다.

  • TextViewCompat.setAutoSizeTextTypeUniformWithConfiguration()
  • TextViewCompat.setAutoSizeTextTypeUniformWithPresetSizes()

참고