close

Amfani da TextSpan a cikin Flutter: Jagora da Misalai

Yin amfani TextSpan da cikin Flutter, zaku iya ƙirƙirar rubutu mai arha ta amfani da sifofi daban-daban na tsarawa zuwa sassa daban-daban na rubutu. Yana ba ku damar ƙirƙirar rubutu tare da salo daban-daban, launuka, haruffa, da ƙari daban-daban. TextSpan Ana amfani da shi a cikin duka biyun Text da RichText widgets don cimma ingantaccen tsarin rubutu.

Ga misalin yadda ake amfani TextSpan da widget din 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: '!'),  
            ],  
         ),  
       ),  
     ),  
   );  
  }  
}

A cikin wannan misali, muna amfani da Text.rich don ƙirƙirar Text widget tare da TextSpan. TextSpan yana ba mu damar ƙirƙirar tazara daban-daban na rubutu a cikin Text widget, kowanne yana da halayen sa na salo kamar font, launi, da tsarawa.

TextSpan Hakanan za'a iya amfani da shi a cikin RichText widget din don samun ci gaba da haɓaka damar tsara rubutu. Kuna da 'yanci don ƙirƙira da haɗa TextSpan nau'i-nau'i da yawa don ƙera ingantaccen rubutu kamar yadda ake so.

Ina fatan wannan misalin zai taimaka muku fahimtar yadda ake amfani da shi TextSpan a cikin Flutter.