En Flutter, RichText
hay un widget que te permite crear texto con diferentes estilos y formatos dentro de un solo widget de texto. Puede utilizar varios TextSpan
widgets para definir diferentes partes del texto con diferentes estilos.
A continuación se muestra un ejemplo de cómo utilizarlo RichText
:
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('RichText Example'),
),
body: Center(
child: RichText(
text: TextSpan(
text: 'Hello ',
style: DefaultTextStyle.of(context).style,
children: <TextSpan>[
TextSpan(
text: 'Flutter',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.blue,
),
),
TextSpan(text: ' is amazing!'),
],
),
),
),
);
}
}
En este ejemplo, el RichText
widget se utiliza para crear un texto con diferentes estilos. Los TextSpan
widgets se utilizan como elementos secundarios para definir las distintas partes del texto con distintos estilos.
- Al primero
TextSpan
se le aplica el estilo de texto predeterminado del contexto(en este caso, hereda el estilo predeterminado deAppBar
). - El segundo
TextSpan
aplica un peso de fuente en negrita y un color azul a la palabra " Flutter." - El tercero
TextSpan
simplemente agrega el texto "¡es increíble!" hasta el final.
Puede personalizar el formato, las fuentes, los colores y otros estilos dentro de cada uno TextSpan
según sea necesario.
El RichText
widget es particularmente útil cuando necesita aplicar diferentes estilos a diferentes partes de su texto, como cuando muestra contenido formateado o enfatiza palabras o frases específicas.
Siéntete libre de experimentar con diferentes estilos y TextSpan
widgets anidados para lograr los efectos visuales deseados en tu aplicación.