Korištenje obogaćenog teksta u Flutter: vodič i primjeri

U Flutter, RichText je widget koji vam omogućuje stvaranje teksta s različitim stilovima i oblikovanjem unutar jednog tekstualnog widgeta. Možete koristiti više TextSpan widgeta za definiranje različitih dijelova teksta s različitim stilovima.

Evo primjera kako koristiti 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!'),  
            ],  
         ),  
       ),  
     ),  
   );  
  }  
}  

U ovom primjeru, RichText widget se koristi za stvaranje teksta s različitim stilovima. Widgeti TextSpan se koriste kao djeca za definiranje različitih dijelova teksta s različitim stilovima.

  • Prvi TextSpan je stiliziran pomoću zadanog stila teksta konteksta(u ovom slučaju nasljeđuje zadani stil AppBar).
  • Drugi TextSpan primjenjuje podebljani font i plavu boju na riječ " Flutter."
  • Treći TextSpan jednostavno dodaje tekst "nevjerojatno je!" do kraja.

Prema potrebi možete prilagoditi oblikovanje, fontove, boje i druge stilove unutar svakog TextSpan.

Widget RichText je posebno koristan kada trebate primijeniti različite stilove na različite dijelove teksta, kao što je prikaz formatiranog sadržaja ili naglašavanje određenih riječi ili fraza.

Slobodno eksperimentirajte s različitim stilovima i ugniježđenim TextSpan widgetima kako biste postigli željene vizualne efekte u svojoj aplikaciji.