Uso de RichText en Flutter: guía y ejemplos

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 de AppBar).
  • 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.