Använda RichText i Flutter: Guide och exempel

I Flutter, RichText är en widget som låter dig skapa text med olika stilar och formatering inom en enda textwidget. Du kan använda flera TextSpan widgets för att definiera olika delar av texten med olika stilar.

Här är ett exempel på hur du använder 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!'),  
            ],  
         ),  
       ),  
     ),  
   );  
  }  
}  

I det här exemplet RichText används widgeten för att skapa en text med olika stilar. Widgetarna TextSpan används som barn för att definiera de olika delarna av texten med distinkta stilar.

• Den första TextSpan är utformad med standardtextstilen för sammanhanget(i det här fallet ärver den standardstilen för) AppBar.
• Den andra TextSpan tillämpar en fet stil och blå färg på ordet ". Flutter "
• Den tredje TextSpan lägger helt enkelt till texten "är fantastiskt!" till slutet.

Du kan anpassa formatering, typsnitt, färger och andra stilar inom varje TextSpan efter behov.

Widgeten RichText är särskilt användbar när du behöver använda olika stilar på olika delar av din text, till exempel när du visar formaterat innehåll eller betonar specifika ord eller fraser.

Experimentera gärna med olika stilar och kapslade TextSpan widgets för att uppnå önskade visuella effekter i din app.