Guía para facilitar la escala de texto

Las aplicaciones de Android deben escalar el contenido para garantizar que no haya pérdida de información o funcionalidad para los usuarios que requieren tamaños de fuente más grandes para cumplir con WCAG 1.4.4 Cambiar tamaño de texto. La información debe estar disponible para todos. Esta guía cubrirá las formas recomendadas para apoyar el escalado de texto para garantizar que la experiencia del usuario sea adecuada para todos.

Para dispositivos Android 13 y superiores, hay una configuración de accesibilidad para cambiar el tamaño del texto y el contenido preferidos. Lea más sobre cómo cambiar estas configuraciones en la guía de asistencia de Google para configuraciones de texto y pantalla

Prepare su Vista

Antes de admitir texto escalable, las vistas de su aplicación deben estar listas. Lea las siguientes consideraciones antes de la implementación.

ScrollView

Siempre que haya texto en la pantalla, éste debe ajustarse a la configuración de texto y visualización preferida del usuario. Para una fuente más grande, no se necesita mucho para que el texto se desborde fuera de la pantalla. Aquí es donde tener un elemento ScrollView como contenedor para el elemento de diseño (constraint, linear, relative) es imperativo para hacer que el texto esté disponible a medida que se extiende más allá de los límites de la pantalla. Tenga en cuenta que ScrollView [insert term]s no se desplazará hasta que se complete la altura de la pantalla (o el ancho para el desplazamiento horizontal).

Excepciones:

• RecyclerViews [insert term]s no es necesario incrustarlos dentro de un ScrollView. En su lugar, permita que los elementos se expandan vertical u horizontalmente en su altura/ancho para permitir que el texto se escale.
• Los elementos de navegación en barras inferiores, pestañas, barras de herramientas, etc., deben estar al mismo nivel que el contenedor ScrollView, no en el interior del ScrollView. Se recomienda utilizar solo una vista estática a la vez para no restringir demasiado la ventana gráfica.

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <include layout="@layout/custom_toolbar"/>

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            tools:background="@color/cauldron_main_bg">
            <TextView...>
            <TextView...>
            <androidx.constraintlayout.widget.Guideline...>
            <androidx.constraintlayout.widget.Guideline...>
            <androidx.constraintlayout.widget.Guideline...>
        </androidx.constraintlayout.widget.ConstraintLayout>
    </ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

ConstraintLayout

ConstraintLayouts son excelentes para la escalabilidad del texto debido a las capacidades flexibles y guías que puede definir. La mayoría de los problemas de cambio de tamaño de texto se pueden resolver al no restringir la altura o el ancho de una vista. Al permitir que un TextView para expandirse con las restricciones establecidas, la vista entiende cómo crecer con la vista de texto y, como tal, el texto siempre está disponible para el usuario final y no truncado o fuera de la pantalla.

Una práctica común es configurar el ancho de la vista para que coincida con el elemento padre, mientras que la altura se configura para ajustar el contenido. Esto permite que la vista permanezca en el ancho definido, pero la altura se puede ajustar para cualquier contenido interior que pueda cambiar de tamaño o longitud (considere el texto que cambia según el estado). Otra opción sería establecer android:layout_width en 0dp permitiendo que el componente llene el espacio entre cualquier restricción de inicio y final. Compruebe siempre que los componentes puedan expandirse verticalmente para dar cabida al texto en crecimiento en este escenario.

<Button
    andriod:id="@+id/logIn"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="8dp"
    android:layout_marginTop="16dp"
    android:layout_marginEnd="8dp"
    android:layout_marginBottom="24dp"
    android:text="Login"
    app:layout_constraintEnd_toEndOf="@+id/right"
    app:layout_constraintStart_toEndOf="@+id/left"
    app:layout_constraintTop_toBottomOf="@+id/password" />

RelativeLayout

RelativeLayoutLos elementos son un poco menos flexibles que los ConstraintLayout elementos. Asegúrese de definir las pautas de inicio y fin para los elementos hermanos, de modo que los componentes se vean en la pantalla y sean legibles.

LinearLayout

LinearLayoutLos pueden adaptarse a tamaños de contenido cambiantes si están en ScrollView a y no establecen una match_parent altura en sí mismos ni en ningún LinearLayoutniño. Si se necesita una altura específica, utilice el atributo android:minHeight como tamaño predeterminado.

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="16dp"
    android:minHeight="30dp">

Cambio de contenido

Las siguientes secciones resaltan algunas de las configuraciones de Android disponibles para modificar el tamaño del contenido de varias maneras. Asegúrese de que sus vistas respondan al contenido creciente para mantenerlo disponible en la pantalla y libre de puntos suspensivos o truncamientos.

Escalado de texto

Aumentar el tamaño de fuente puede resultar útil para muchos usuarios con discapacidades visuales. Siempre debes respetar las preferencias del usuario cuando se trata de configurar el tamaño de fuente dentro de tu aplicación.

Tamaño de la pantalla

El tamaño de visualización modifica el tamaño general de los elementos en la pantalla, beneficiando a los usuarios con función motora deteriorada y/o usuarios con discapacidades visuales.

Tamaño del texto

Cuando se trata de dimensionar widgets, encontrarás en Android dos unidades de medida: DP (DIP) para píxeles independientes de la densidad y SP (SIP) para píxeles independientes de la escala. Cualquier texto debe usar SP para mantener la coherencia en todos los dispositivos y admitir el escalado de fuentes. Utilice el lint de accesibilidad de Android Studio para mostrar una advertencia si no se utilizó SP en TextViews.

Es posible que se encuentre con situaciones en las que sea necesaria una modificación parcial del texto, como por ejemplo un enlace en línea. Para los TextViews, puedes usar SpannableStringBuilder para modificar el texto directamente o modificar el tamaño del texto con AbsoluteSpanSize. Evite tamaños codificados en duro para admitir el escalado.

SpannableStringBuilder str = new SpannableStringBuilder(tv.getText());
str.setSpan(new AbsoluteSizeSpan(size: 70, dip: true), start:15, end:18, Spannded.SPAN_EXCLUSIVE_EXCLUSIVE);
tv.setText(str);

Consideraciones sobre los widgets

Algunos consejos para utilizar componentes nativos de Android y garantizar una buena experiencia de accesibilidad.

• Toolbar: Si usas una barra de herramientas, recomendamos un título corto para proporcionar contexto. Si estás utilizando un título dinámico, le recomendamos no utilizar el widget Toolbar .
• BottomNavBar: Una iconografía distintiva con descripciones de contenido descriptivas ayudará a proporcionar el contexto tan necesario para navegar sin el riesgo de que las etiquetas se superpongan.
• Tabs, ViewPager, TabList y más: utilice una vista desplazable, si es necesario, para que un usuario pueda interactuar con la aplicación con el contexto completo de la información disponible para ellos. No limite la altura de un control.