[Solved] How to change Font style in Html widget in Flutter?

Question

Asked by Vignesh P on July 29, 2019 (source).

I have added post description from Json Rest API using HTML package in flutter. The default font size looks too small. How to increase the font size of below content - Html( data: user['news_description'],),

import 'package:flutter_html/flutter_html.dart';

    class NewsDetails extends StatelessWidget {
          var user;
          var image_url = 'http://example.com/news/upload/';
          NewsDetails(this.user);

          @override
          Widget build(BuildContext context) {
            return Scaffold(
              body: SingleChildScrollView(
                child: Column(
                  children: <Widget>[
                    Image.network(image_url + user['news_image'],  width: double.infinity, height: 300.0, fit: BoxFit.cover,),
                    SizedBox(height:5.0),
                    Padding(padding: EdgeInsets.all(15.0),
                      child: Column(
                        children: <Widget>[
                          Text(user['news_title'],
                            style: TextStyle(fontSize: 22.0, fontWeight: FontWeight.w400),),
                          SizedBox(height:10.0),
                        Html( data: user['news_description'],)
                        ],
                      )
                    )
                  ],
                )
              ),
            );
          }
        }

Answer

Question answered by Anu V (source).

You could use customTextStyle to change the font size.

customTextStyle: (dom.Node node, TextStyle baseStyle) {
              return baseStyle.merge(TextStyle(height: 2, fontSize: 28));
              }

Complete example,

 Html( data: user['news_description'],
       customTextStyle: (dom.Node node, TextStyle baseStyle) {
                  return baseStyle.merge(TextStyle(height: 2, fontSize: 28));
                  })
DART FLUTTER
SHARE: