TextSpan Widget in Flutter

TextSpan Widget

 

  • Rich Text
  • Text.rich

 

TextSpan

 

A TextSpan object can just have plain text, or it can have children TextSpan objects with their styles that override the style of this obiect.

 

A TextSpan object can be styled using its style property. The style will be applied to the text and the children.

 

Example:

 

import 'package:flutter/material.dart';


void main() {

  runApp(

    MaterialApp(

      home: Scaffold(

        appBar: AppBar(

          title: const Text(

            'Sample App',

          ),

        ),

        body: const Center(

          child: Text.rich(

            TextSpan(

              text: 'Hello',

              style: TextStyle(fontSize: 20),

              children: [

                TextSpan(

                    text: 'World',

                    style: TextStyle(fontSize: 40, color: Colors.blue)),

                TextSpan(text: ' !', style: TextStyle(fontSize: 50))

              ],

            ),

          ),

        ),

      ),

    ),

  );

}

 

Video Link:

 
Post a Comment (0)
Previous Post Next Post