Guida al supporto della scalabilità del testo

Le applicazioni Android devono ridimensionare i contenuti per garantire che non vi siano perdite di informazioni o funzionalità per gli utenti che necessitano di dimensioni di carattere maggiori per conformarsi allo standard WCAG 1.4.4 Resize Text. Le informazioni dovrebbero essere rese disponibili a tutti. Questa guida illustrerà i metodi consigliati per supportare il ridimensionamento del testo, in modo da garantire che l'esperienza utente sia adatta a tutti.

Per i dispositivi Android con schermo di 13 pollici e superiori, è disponibile un'impostazione di accessibilità per modificare le dimensioni preferite del testo e del contenuto. Per ulteriori informazioni sulla modifica di queste impostazioni, consulta la Guida di supporto di Google per le impostazioni di testo e visualizzazione.

Prepara la tua View

Prima di supportare il testo scalabile, le viste della tua applicazione devono essere pronte. Prima dell'implementazione, leggere le considerazioni seguenti.

ScrollView

Ogni volta che sullo schermo viene visualizzato del testo, questo dovrebbe essere conforme alle impostazioni di testo e di visualizzazione preferite dall'utente. Con un carattere più grande, basta poco perché il testo fuoriesca dallo schermo. Ecco perché avere un elemento ScrollView come contenitore per l'elemento layout (ConstraintLayout, LinearLayout, RelativeLayout) è fondamentale per rendere il testo disponibile estendendolo oltre i limiti dello schermo. Si noti che ScrollView non sarà possibile scorrere finché l'altezza dello schermo (o la larghezza per lo scorrimento orizzontale) non sarà riempita.

Eccezioni:

• RecyclerViews non devono essere incorporati in un ScrollView. Invece, consenti agli elementi di espandersi verticalmente o orizzontalmente in altezza/larghezza per consentire la scalabilità del testo.
• Gli elementi di navigazione nelle barre inferiori, nelle schede, nelle barre degli strumenti, ecc. devono trovarsi allo stesso livello del contenitore ScrollView, non all'interno di ScrollView. Si consiglia di utilizzare una sola vista statica alla volta per non limitare troppo la visualizzazione.

<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

ConstraintLayoutsono ideali per la scalabilità del testo grazie alle capacità flessibili e alle guide che è possibile definire. La maggior parte dei problemi di ridimensionamento del testo possono essere risolti non limitando l'altezza o la larghezza di una vista. Consentendo a TextView di espandersi con i vincoli impostati, la vista capisce come crescere con la vista del testo e, in quanto tale, il testo è sempre disponibile per l'utente finale e non viene troncato o visualizzato fuori dallo schermo.

Una pratica comune è quella di impostare la larghezza della vista in modo che corrisponda a quella dell'elemento padre, mentre l'altezza è impostata in modo da racchiudere il contenuto. Ciò consente alla vista di mantenere la larghezza definita, ma l'altezza può essere regolata in base a qualsiasi contenuto al suo interno che potrebbe cambiare in termini di dimensioni o lunghezza (si consideri che il testo cambia in base allo stato). Un'altra opzione sarebbe quella di impostare android:layout_width su 0dp, consentendo al componente di riempire lo spazio tra eventuali vincoli di inizio e fine. In questo scenario, verificare sempre che i componenti possano espandersi verticalmente per adattarsi alla crescita del testo.

<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

RelativeLayouts sono un po' meno flessibili di ConstraintLayouts. Assicurati di definire le linee guida di inizio e fine per gli elementi fratelli in modo che i componenti siano sullo schermo e leggibili.

LinearLayout

LinearLayout possono adattarsi alle dimensioni del contenuto in cambiamento se sono in un ScrollView e non impostano un'altezza match_parent in sé stessi o in qualsiasi elemento figlio LinearLayout. Se è necessaria un'altezza specifica, utilizzare l'attributo android:minHeight come dimensione predefinita.

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

Cambiamento del Contenuto

Le sezioni seguenti evidenziano alcune delle impostazioni Android disponibili per modificare le dimensioni del contenuto in vari modi. Assicurati che le tue visualizzazioni rispondano alla crescita dei contenuti per mantenerli disponibili sullo schermo e privi di ellissi o troncamenti.

Ridimensionamento del testo

Aumentare la dimensione del carattere può essere utile per molti utenti con problemi visivi. Quando si tratta di impostare la dimensione del carattere all'interno della propria applicazione, è sempre opportuno rispettare le preferenze dell'utente.

Dimensioni del display

La dimensione di visualizzazione modifica le dimensioni complessive degli elementi sullo schermo, a vantaggio degli utenti con difficoltà motorie e/o problemi visivi.

Dimensione del testo

Per quanto riguarda le dimensioni dei widget, in Android troverai due unità di misura: DP o DIP per i pixel indipendenti dalla densità e SP o SIP per i pixel indipendenti dalla scala. Qualsiasi testo dovrebbe utilizzare SP per mantenere la coerenza tra i dispositivi e supportare il ridimensionamento dei caratteri. Utilizza il linter di accessibilità di Android Studio per visualizzare un avviso se SP non è stato utilizzato su TextView.

Potrebbero verificarsi situazioni in cui è necessaria una modifica parziale del testo, ad esempio un collegamento in linea. Per TextViews, puoi usare SpannableStringBuilder per modificare direttamente il testo o modificare la dimensione del testo con AbsoluteSpanSize. Evitare dimensioni hardcoded per supportare il ridimensionamento.

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);

Considerazioni sui widget

Alcuni suggerimenti per utilizzare i componenti nativi di Android e garantire una buona esperienza di accessibilità.

• Toolbar: Se si utilizza una barra degli strumenti, si consiglia un titolo breve per fornire contesto. Se si utilizza un titolo dinamico, si consiglia di non utilizzare il Toolbar widget.
• BottomNavBar: Un'iconografia distinta con descrizioni dei contenuti descrittive aiuterà a fornire il contesto tanto necessario per la navigazione senza il rischio di sovrapposizioni di etichette.
• Tabs, ViewPager, TabList e altro ancora: utilizzare una vista scorrevole, se necessario, in modo che un utente possa interagire con l'applicazione con il contesto completo delle informazioni a sua disposizione. Non limitare l'altezza di un controllo.