¿Cómo pongo en negrita (o formato) un fragmento de texto dentro de un párrafo?

97

¿Cómo puedo tener una línea de texto con un formato diferente?

p.ej:

Hola mundo

Dvdwasibi
fuente

Respuestas:

202

Debería utilizar el widget RichText .

Un widget RichText tomará un TextSpan widget que también puede tener una lista de TextSpans secundarios.

Cada widget de TextSpan puede tener un TextStyle diferente .

Aquí está el código de ejemplo para renderizar: Hello World

var text = new RichText(
  text: new TextSpan(
    // Note: Styles for TextSpans must be explicitly defined.
    // Child text spans will inherit styles from parent
    style: new TextStyle(
      fontSize: 14.0,
      color: Colors.black,
    ),
    children: <TextSpan>[
      new TextSpan(text: 'Hello'),
      new TextSpan(text: 'World', style: new TextStyle(fontWeight: FontWeight.bold)),
    ],
  ),
 );
Dvdwasibi
fuente
26

[ACTUALIZAR]

La respuesta a continuación se ajusta mejor a un par de palabras y no a un párrafo.Si tiene una oración larga o un párrafo en el que necesita formatear un texto en particular, prefiera usar RichText como lo sugiere @DvdWasibi en la respuesta anterior.

[ANTIGUA RESPUESTA]

Me gusta mantener mi código corto y limpio, así es como lo haría agregar dos campos de texto en una fila, uno con fuente Normal y otro en negrita ,

Nota: Es posible que esto no se vea bien si un párrafo largo se ve bien para titulares, etc.

Row(children: <Widget>[
      Text("Hello"),
      Text("World", style: TextStyle(fontWeight: FontWeight.bold))
    ])
`

y debería obtener el resultado deseado como "Hola mundo "

maheshmnj
fuente
8
Esta no es una gran idea, si va a tener un párrafo de texto. Cada texto () dentro de la fila crea su propio espacio vertical / horizontal.
Muhammad Adil
Entonces, ¿cuál es la alternativa a usar Row? y si quiero texto lado a lado con formato diferente
maheshmnj
2
mire la respuesta anterior de @Dvdwasibi, simplemente pruebe su implementación con un párrafo grande y encontrará una especie de dos párrafos diferentes uno al lado del otro. su respuesta es correcta para 2/3 palabras pero no para un párrafo.
Muhammad Adil
10
return RichText(
  text: TextSpan(
    text: 'Can you ',
    style: TextStyle(color: Colors.black),
    children: <TextSpan>[
      TextSpan(
        text: 'find the',
        style: TextStyle(
          color: Colors.green,
          decoration: TextDecoration.underline,
          decorationStyle: TextDecorationStyle.wavy,
        ),
        recognizer: _longPressRecognizer,
      ),
      TextSpan(text: 'secret?'),
    ],
  ),
);
Parvesh Khan
fuente