Mejía Martínez Nadia Guadalupe 6°H 07/03/2023

TextView En Android
El TextView En Android es un widget que muestra texto al usuario como su nombre lo
sugiere. Claramente esto lo hace ser uno de los views más usados en interfaces de usuario
para proyectar cabeceras, títulos, texto informativo, etiquetas y muchos otros.

En este tutorial aprenderás a crear Text Views en tus

layouts, usar los atributos que posee y personalizar la
forma en que proyecta el texto.

La Clase TextView
TextView es una de las directas descendientes de la clase View. Al ser la abstracción
responsable de contener texto, varios de los elementos gráficos del
paquete [Link], como Button y EditText, reutilizan esta naturaleza.
Por otro lado, para darle soporte a versiones anteriores
de Android de las nuevas capacidades que se van
introduciendo al TextView, se creó la
clase AppCompatTextView.
También tienes a disposición la
clase MaterialTextView para aplicar los temas de material
design sobre tus text views por defecto.

Añadir Un TextView En Android Studio

Para agregar un TextView desde el editor de layout de

Android Studio tan, solo dirígete a Palette > Text o Palette
> Common. Selecciona la opción TextView y arrástralo al
lienzo:
Mejía Martínez Nadia Guadalupe 6°H 07/03/2023

Esto creará una nueva etiqueta <TextView> en tu layout similar a esta:

<TextView
android:id="@+id/hello_world_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!" />

Usa el atributo android:text para asignar un literal String o un 

class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
[Link](savedInstanceState)
setContentView([Link].activity_main)

val helloWorldText: TextView = findViewById([Link].hello_world_text)

[Link] = "Nuevo texto"

Atributos Del TextView

Los siguientes son ejemplos sobre el uso de atributos, que te permiten transformar y
personalizar el texto que se dibuja en pantalla.

Color Del Texto

Cambia el color del texto a través del atributo android:textColor. Este recibe la
referencia a un recurso de color o valores RGB en variaciones "rgb", "argb", "rrggbb",
o "aarrggbb":
Mejía Martínez Nadia Guadalupe 6°H 07/03/2023

<TextView
android:id="@+id/text_color"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#3F51B5"
android:text="Texto color Material Indigo 500" />

El anterior ejemplo usa el color índigo de nivel 500 del Material Design:

Tamaño Del Texto

El atributo android:textSize determina el tamaño del texto y se recomienda asignarle
valores en pixeles escalados o sp. Sin embargo puedes usar medidas en px, dp, in y mm:

<TextView
android:id="@+id/text_size_24sp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="24sp"
android:text="Tamaño de 24sp" />

El anterior ejemplo junto a las dimensiones de 14sp, 16sp y 20sp se verían así:

También es posible usar un recurso de dimensiones a través de la

navegación @dimen/nombre_dimension.
Estilo Del Texto
Asigna uno de los siguientes estilos o combinaciones de ellos: normal, bold y italic. El
valor por defecto es normal y si deseas combinarlos usa el símbolo '|':

<TextView
android:id="@+id/text_style_combination"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Estilos itálico y negrilla"
android:textStyle="bold|italic" />

En la siguiente imagen puedes ver todos los estilos posibles:

Mejía Martínez Nadia Guadalupe 6°H 07/03/2023

Tipo De Fuente

El atributo android:typeface acepta las siguientes constantes para especificar el estilo de

fuente del TextView: normal, sans,serif y monospace:

<TextView
android:id="@+id/typeface_monospace"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Tipo de fuente monospace"
android:typeface="monospace" />

La siguiente imagen muestra la diferencia entre las formas y trazos que se usan en cada
estilo tipográfico:

Convertir URLs En Links Clickeables

Si deseas habilitar la detección de patrones que coincidan con esquemas como: correos,
urls, teléfonos, entre otros; entonces, aplica el atributo android:autoLink.
Los siguientes son los valores que puedes asignar:
all: Todos los patrones
email: Direcciones de correo
none: Ninguno (por defecto)
phone: Teléfonos
web: URLs web
Por ejemplo, el siguiente TextView genera un link clickeable hacia Develou:

<TextView
android:id="@+id/autolink_url"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="[Link]
android:textColorLink="#F48FB1"
android:autoLink="web" />

También puedes usar android:textColorLink para modificar el color de creación del link.

Mejía Martínez Nadia Guadalupe 6°H 07/03/2023

Convertir Texto A Mayúsculas

En el caso que desees convertir toda la entrada de texto a mayúsculas, aplica true al
atributo android:textAllCaps.

<TextView
android:id="@+id/text_all_caps"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="[Link]"
android:textAllCaps="true" />

La anterior etiqueta genera la siguiente presentación del texto:

Familia Tipográfica
Define el tipo que será usado de una fuente declarada en el sistema o en tus recursos de
fuente (res/font).

<TextView
android:id="@+id/font_family1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:fontFamily="sans-serif-condensed-medium"
android:text="Sans Serif Condensed Medium " />

En el sistema encontrarás familias prefabricadas para generar variaciones con las fuentes
del sistema.

Por supuesto también puedes agregar tu propia fuente:

Paso 1. Crea la carpeta de recursos tipo fuente, dando click derecho en res y
seleccionando Android Resource Directory. Luego asegúrate de seleccionar el tipo font.
Mejía Martínez Nadia Guadalupe 6°H 07/03/2023

Paso 2. Añade al directorio font tus archivos de fuente. En este ejemplo añadiremos la

fuente Cinzel desde Google Fonts.

Paso 3. Ve al TextView y referencia a la fuente con la dirección @font/cizel. De esta se

aplicará la fuente al texto:

<TextView
android:id="@+id/custom_font"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:fontFamily="@font/cinzel"
android:text="Texto que usa la fuente Cinzel" />

Al final podrás visualizar la nueva presentación:

Apariencia De Texto
El atributo android:textAppearance permite definir en conjunto el color de texto, tipo de
letra, tamaño y estilo de texto. Normalmente usarás este atributo para asignar las
apariencias prefabricadas en los estilos del sistema.
Estas concuerdan con las escalas de tipografía definidas en la guía del Material Design. Y tan
solo es seleccionarlas del menú emergente cuando tipeas la escala.
Mejía Martínez Nadia Guadalupe 6°H 07/03/2023

Por ejemplo, el siguiente texto usa la

apariencia [Link].Headline4 :

<TextView
android:id="@+id/headline_4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Ejemplos"
android:textAppearance="@style/[Link].Headline4" />

El resultado es la aplicación de los siguientes valores:

El texto se proyectaría de la siguiente forma:

Crear TextView Programáticamente

Veamos un ejemplo donde deseas crear un TextView en tiempo de ejecución con las
siguientes características:
 Texto: «bug»
 Color: Rojo
 Tipo de fuente: monoespaciado
 Estilo: Negrita
Suponiendo que el view de texto pertenece a una actividad y su padre directo en el layout
será un LinearLayout, el código de la solución se vería así:
Mejía Martínez Nadia Guadalupe 6°H 07/03/2023

private fun createTextView() {

val layout: ViewGroup = findViewById([Link]) // (1)

val bugTextView = TextView(this).apply { // (2)

text = "bug-1789" // (3)
[Link]( // (4)
this,
[Link].TextAppearance_MaterialComponents_Headline6
)
setTextColor([Link]) // (5)
setTypeface([Link], [Link]) // (6)

layoutParams = [Link]( // (7)

[Link].WRAP_CONTENT,
[Link].WRAP_CONTENT
)
}
[Link](bugTextView) // (8)
}

La solución anterior consta de:

1. Obtener la referencia del LinearLayout donde vamos a insertar el TextView
2. Invocar a la función de alcance apply() para configurar la inicialización del view en un
solo bloque de contexto.
3. Asignar el texto deseado
4. Usar al objeto auxiliar TextViewCompat para asignar el valor
de textAppearance como Headline 6.
5. Asignar el color rojo del SDK.
6. Asignar el tipo monoespaciado y la negrita con los valores en Typeface
7. Definir los parámetros del layout para el texto
8. Agregar al TextView creado dinámicamente en el layout
Al ejecutar la aplicación el resultado será: