„TextSpan“ naudojimas Flutter: vadovas ir pavyzdžiai

Naudodami, galite sukurti turtingą tekstą, pritaikydami skirtingus TextSpan formatavimo Flutter atributus įvairioms teksto dalims. Tai leidžia kurti įvairių stilių, spalvų, šriftų ir kt. tekstą. TextSpan yra naudojamas tiek valdikliuose, Text tiek RichText valdikliuose, kad būtų pasiektas turtingo formato tekstas.

Štai pavyzdys, kaip naudoti TextSpan valdiklyje Text:

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('TextSpan Example'),  
     ),  
      body: Center(  
        child: Text.rich(  
          TextSpan(  
            text: 'Hello ',  
            style: TextStyle(fontSize: 20),  
            children: [  
              TextSpan(  
                text: 'Flutter',  
                style: TextStyle(  
                  fontWeight: FontWeight.bold,  
                  color: Colors.blue,  
               ),  
             ),  
              TextSpan(text: '!'),  
            ],  
         ),  
       ),  
     ),  
   );  
  }  
}  

Šiame pavyzdyje mes naudojame Text.rich norėdami sukurti Text valdiklį su TextSpan. TextSpan leidžia sukurti keletą skirtingų teksto intervalų valdiklyje Text, kurių kiekvienas turi savo stiliaus atributus, tokius kaip šriftas, spalva ir formatavimas.

TextSpan taip pat gali būti naudojamas valdiklyje, RichText norint pasiekti pažangesnių teksto formatavimo galimybių. Galite laisvai kurti ir derinti kelis TextSpan egzempliorius, kad sukurtumėte turtingo formato tekstą, kaip norite.

Tikiuosi, kad šis pavyzdys padės suprasti, kaip TextSpan naudoti Flutter.