Estilos de texto en Android

TextView muestra el texto declarado de forma estándar a menos que el desarrollador especifique atributos particulares para que el texto se vea mejor. Estos atributos se pueden declarar directamente en las etiquetas TextView. Sin embargo, para mantener un código escalable y limpio, las prácticas industriales sugieren reunir todos esos atributos. Es decir, puede haber estilos iguales o diferentes para diferentes elementos de la interfaz de usuario dentro de la aplicación y todos ellos deben agruparse en un solo archivo al que se puede llamar donde sea necesario. A través de este artículo, queremos mostrarle cómo puede crear estilos y aplicarlos a TextViews. En nuestra demostración, cambiamos dinámicamente el estilo de TextView tocándolo.

Implementación paso a paso

Paso 1: crea un nuevo proyecto en Android Studio

Para crear un nuevo proyecto en Android Studio, consulte Cómo crear/iniciar un nuevo proyecto en Android Studio . Demostramos la aplicación en Kotlin , así que asegúrese de seleccionar Kotlin como idioma principal al crear un nuevo proyecto.

Paso 2: Crea estilos.xml en la carpeta res>values

Para crear un archivo de estilos, haga clic con el botón derecho en la carpeta de valores dentro de la carpeta res, mueva el cursor a nuevo y haga clic en Archivo de recursos de valores.

Ahora asígnele el nombre «estilos» y haga clic en Aceptar. Puede utilizar cualquier nombre de su elección. Recuerde verificar si el nombre del directorio es valores, ya que nuestro archivo contendrá valores de atributos. El archivo generado será un archivo XML.

Una vez que se genera el archivo, debería aparecer así. Ahora, podemos agregar los estilos a este archivo. Vaya al siguiente paso para ver cómo puede crear un estilo.

Paso 3: agregue estilos en el archivo styles.xml

Consulte el siguiente código. Ya hemos declarado algunos estilos para ti. Es necesario dar un nombre a cada estilo. Los atributos relacionados con el texto se declaran como elementos entre las etiquetas de apertura y cierre del estilo.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="whiteText">
        <item name="android:textStyle">italic</item>
        <item name="android:textColor">#ffffff</item>
    </style>
  
    <style name="gfgGreenText">
        <item name="android:textStyle">bold</item>
        <item name="android:textColor">#0f9d58</item>
    </style>
  
</resources>

Paso 4: Agregue colores para cambiar el fondo de TextView en el archivo colors.xml (Opcional)

Este paso es opcional. Declaramos dos colores de nuestro interés solo para cambiar el fondo de TextView.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    
    <!--There could be a list of colors declared here-->
    <!--Additionally, we are adding the below two colors-->
    <color name="gfg_green">#0f9d58</color>
    <color name="white">#FFFFFFFF</color>
  
</resources>

Paso 5: agregue un TextView en el archivo de diseño (actividad_principal.xml)

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
  
      <!--TextView-->
    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="GeeksforGeeks"
        android:textSize="36sp"
        android:textStyle="bold" />
  
</RelativeLayout>

Paso 6: escriba un programa para alternar entre los estilos en TextView, haga clic en el código principal (MainActivity.kt)

import android.os.Build
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.TextView
import androidx.annotation.RequiresApi
import org.w3c.dom.Text
  
class MainActivity : AppCompatActivity() {
    
    @RequiresApi(Build.VERSION_CODES.M)
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
  
        // Declaring TextView from the layout
        val tv1 = findViewById<TextView>(R.id.textView1)
  
        // A simple toggle variable that keeps
        // changing on TextView click/tap
        var toggle = true
        
        // What happens when the 
        // TextView in clicked/tapped
        tv1.setOnClickListener {
            
            // If toggle is true, then text will become 
            // white and background will become green
            // Else text is green and background is white
            if(toggle){
                tv1.setTextAppearance(R.style.whiteText)
                tv1.setBackgroundResource(R.color.gfg_green)
            } else {
                tv1.setTextAppearance(R.style.gfgGreenText)
                tv1.setBackgroundResource(R.color.white)
            }
              
            // Logically inversing the toggle, i.e. if toggle
            // is true then it shall become false
            // And vice-versa to keep the styles
            // keep changing on every click/tap
            toggle = !toggle
        }
    }
}

Aporte: 

Siga tocando en TextView para observar los cambios.

Producción: 

Podemos ver que el estilo del texto cambia a negrita y luego a cursiva junto con los cambios de color de fondo. El ciclo sigue repitiéndose en cada clic/toque uniforme.