Autodimensionar TextView en Android

Si el usuario está ingresando y la entrada debe mostrarse como TextView y si el usuario ingresa cosas que pueden salir de la pantalla, en este caso, la fuente TextView debe reducirse gradualmente. Entonces, en este artículo se ha discutido cómo el desarrollador puede reducir el tamaño de TextView gradualmente a medida que el usuario proporciona los datos. Se puede echar un vistazo al siguiente GIF para entender mejor lo que vamos a construir al final de este artículo. Tenga en cuenta que vamos a implementar este proyecto utilizando el lenguaje Java .

Pasos para cambiar el tamaño de TextView automáticamente

En este artículo, el teclado de marcación se toma como ejemplo. Este método se puede usar para construir la calculadora y se puede usar en muchos otros escenarios donde se requiere el cambio de tamaño de TextView.

Paso 1: crea un proyecto de estudio de Android con una actividad vacía

• Puede consultar este Android | Cómo crear/iniciar un nuevo proyecto en Android Studio sobre cómo crear un proyecto de estudio de Android de actividad vacío.
• Cambie el nombre de la aplicación a Auto resize TextView y deje que el nombre del diseño sea activity_main.xml
• Y seleccione Java como idioma.

Paso 2: crear un diseño adecuado trabajando con el archivo activity_main.xml

• Como hemos tomado el teclado de marcación como ejemplo para demostrar el cambio de tamaño automático de TextView, invoque el siguiente código en el archivo activity_main.xml para hacer que la interfaz de usuario sea como un teclado de marcación.

<?xml version="1.0" encoding="utf-8"?>
  
<!--the attributes further invoked for the 
     TextView are the part of Android Jetpac so we need to
     include xmlns:app="http://schemas.android.com/apk/res-auto" 
     as you can see below-->
<LinearLayout 
    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"
    android:orientation="vertical"
    tools:context=".MainActivity"
    tools:ignore="HardcodedText">
  
    <!--One needs to hardcode the height of the TextView-->
    <!--so that it can decrease its height automatically within-->
    <!--the given height and it doesn't disturbs the other widgets-->
    <!--one can set the maxLines of the TextViews upto which-->
    <!--the lines of the TextViews must be visible in this case its 2-->
    <TextView
        android:id="@+id/primaryTextView"
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:hint="0"
        android:maxLines="2"
        app:autoSizeMaxTextSize="80sp"
        app:autoSizeMinTextSize="10sp"
        app:autoSizeStepGranularity="2sp"
        app:autoSizeTextType="uniform" />
  
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal"
        android:weightSum="3">
  
        <Button
            android:layout_width="68dp"
            android:layout_height="68dp"
            android:layout_margin="8dp"
            android:onClick="clickedOne"
            android:text="1"
            android:textSize="24sp" />
  
        <Button
            android:layout_width="68dp"
            android:layout_height="68dp"
            android:layout_margin="8dp"
            android:onClick="clickedTwo"
            android:text="2"
            android:textSize="24sp" />
  
        <Button
            android:layout_width="68dp"
            android:layout_height="68dp"
            android:layout_margin="8dp"
            android:onClick="clickedThree"
            android:text="3"
            android:textSize="24sp" />
  
    </LinearLayout>
  
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal"
        android:weightSum="3">
  
        <Button
            android:layout_width="68dp"
            android:layout_height="68dp"
            android:layout_margin="8dp"
            android:onClick="clickedFour"
            android:text="4"
            android:textSize="24sp" />
  
        <Button
            android:layout_width="68dp"
            android:layout_height="68dp"
            android:layout_margin="8dp"
            android:onClick="clickedFive"
            android:text="5"
            android:textSize="24sp" />
  
        <Button
            android:layout_width="68dp"
            android:layout_height="68dp"
            android:layout_margin="8dp"
            android:onClick="clickedSix"
            android:text="6"
            android:textSize="24sp" />
  
    </LinearLayout>
  
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal"
        android:weightSum="3">
  
        <Button
            android:layout_width="68dp"
            android:layout_height="68dp"
            android:layout_margin="8dp"
            android:onClick="clickedSeven"
            android:text="7"
            android:textSize="24sp" />
  
        <Button
            android:layout_width="68dp"
            android:layout_height="68dp"
            android:layout_margin="8dp"
            android:onClick="clickedEight"
            android:text="8"
            android:textSize="24sp" />
  
        <Button
            android:layout_width="68dp"
            android:layout_height="68dp"
            android:layout_margin="8dp"
            android:onClick="clickedNine"
            android:text="9"
            android:textSize="24sp" />
  
    </LinearLayout>
  
    <Button
        android:layout_width="68dp"
        android:layout_height="68dp"
        android:layout_gravity="center"
        android:layout_marginTop="8dp"
        android:onClick="clickedZero"
        android:text="0"
        android:textSize="24sp" />
  
</LinearLayout>

• Uno puede ver los atributos de TextView en el código anterior app: autoSizeMaxTextSize=”80sp”, estos son los tamaños iniciales de TextView.
• app:autoSizeMinTextSize=”10sp” usando este atributo, TextView se redimensionará hasta el tamaño de 10sp y app:autoSizeStepGranularity=”2sp” usando este atributo, reducimos uniformemente el tamaño de TextView como 2sp cuando sale de la pantalla .
• app:autoSizeTextType=”uniform” al usar este atributo, simplemente estamos cambiando el tamaño de TextView de manera uniforme.
• Una cosa para recordar es que uno no debe establecer la altura y el ancho de TextView como wrap_content.
• Para deshabilitar el cambio de tamaño de TextView, puede establecer este atributo en ninguno. Como puede ver abajo.

aplicación: autoSizeTextType = «ninguno»

Se produce la siguiente interfaz de usuario de salida: 

Paso 3: ahora maneje cada botón por separado, usando el atributo XML onClick 

• Ahora, en el archivo MainActivity.java , manejaremos todas las funciones onClick de cada botón por separado y estableceremos TextView en el número apropiado cuando se presione. Entonces, ahora invoque el siguiente código:

import androidx.appcompat.app.AppCompatActivity;
import android.annotation.SuppressLint;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;
  
public class MainActivity extends AppCompatActivity {
  
    TextView primaryTextView;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
  
        // register the button using appropriate ID of the TextView
        primaryTextView = findViewById(R.id.primaryTextView);
    }
  
    // handle the button 1 and append the 1 to the end of the TextView
    @SuppressLint("SetTextI18n")
    public void clickedOne(View view) {
        primaryTextView.setText(primaryTextView.getText() + "1");
    }
  
    // handle the button 2 and append the 2 to the end of the TextView
    @SuppressLint("SetTextI18n")
    public void clickedTwo(View view) {
        primaryTextView.setText(primaryTextView.getText() + "2");
    }
  
    // handle the button 3 and append the 3 to the end of the TextView
    @SuppressLint("SetTextI18n")
    public void clickedThree(View view) {
        primaryTextView.setText(primaryTextView.getText() + "3");
    }
  
    // handle the button 4 and append the 4 to the end of the TextView
    @SuppressLint("SetTextI18n")
    public void clickedFour(View view) {
        primaryTextView.setText(primaryTextView.getText() + "4");
    }
  
    // handle the button 5 and append the 5 to the end of the TextView
    @SuppressLint("SetTextI18n")
    public void clickedFive(View view) {
        primaryTextView.setText(primaryTextView.getText() + "5");
    }
  
    // handle the button 6 and append the 6 to the end of the TextView
    @SuppressLint("SetTextI18n")
    public void clickedSix(View view) {
        primaryTextView.setText(primaryTextView.getText() + "6");
    }
  
    // handle the button 7 and append the 7 to the end of the TextView
    @SuppressLint("SetTextI18n")
    public void clickedSeven(View view) {
        primaryTextView.setText(primaryTextView.getText() + "7");
    }
  
    // handle the button 8 and append the 8 to the end of the TextView
    @SuppressLint("SetTextI18n")
    public void clickedEight(View view) {
        primaryTextView.setText(primaryTextView.getText() + "8");
    }
  
    // handle the button 9 and append the 9 to the end of the TextView
    @SuppressLint("SetTextI18n")
    public void clickedNine(View view) {
        primaryTextView.setText(primaryTextView.getText() + "9");
    }
  
    // handle the button 0 and append the 0 to the end of the TextView
    @SuppressLint("SetTextI18n")
    public void clickedZero(View view) {
        primaryTextView.setText(primaryTextView.getText() + "0");
    }
}

Salida: ejecutar en el emulador