RichText Widget Examples

rich_text_example.dart

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'RichText Example',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: StarterPage(),
    );
  }
}

class StarterPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('RichText Example'),
        backgroundColor: const Color(0xff39cefd),
      ),
      body: Padding(
        padding: const EdgeInsets.all(17),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            RichText(
              text: TextSpan(
                text:
                    'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare eget diam nec interdum. Vivamus ultrices eros at sem blandit, eu auctor turpis maximus. Vestibulum sed ornare justo. Mauris malesuada tristique nunc non iaculis. ',
                style: Theme.of(context).textTheme.bodyText1,
                children: <TextSpan>[
                  TextSpan(
                    text: 'sneaky large, red text. ',
                    style: Theme.of(context)
                        .textTheme
                        .headline6!
                        .copyWith(color: Colors.red),
                  ),
                  TextSpan(
                    text:
                        'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare eget diam nec interdum. Vivamus ultrices eros at sem blandit, eu auctor turpis maximus. Vestibulum sed ornare justo. Mauris malesuada tristique nunc non iaculis. ',
                    style: Theme.of(context).textTheme.bodyText1,
                  ),
                  TextSpan(
                    text: 'sneaky large, blue text. ',
                    style: Theme.of(context)
                        .textTheme
                        .headline6!
                        .copyWith(color: Colors.blue),
                  ),
                  TextSpan(
                    text:
                        'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare eget diam nec interdum. Vivamus ultrices eros at sem blandit, eu auctor turpis maximus. Vestibulum sed ornare justo. Mauris malesuada tristique nunc non iaculis. ',
                    style: Theme.of(context).textTheme.bodyText1,
                  ),
                ],
              ),
            )
          ],
        ),
      ),
    );
  }
}