How to Automatically Resize Text According to Width and Height in Flutter

In this example, we are going to show you how to resize the size of text according to the width and height of the screen or container widget dimension. The different screen has different sizes, so the widget tree, you can auto-resize them according to the screen in Flutter. See the example below:

First, you need to add auto_size_text widget in your project by adding the following lines in pubspec.yaml file.

dependencies:
  flutter:
    sdk: flutter
  auto_size_text: ^3.0.0

Now to import the package in your script:

import 'package:auto_size_text/auto_size_text.dart';

Now, you can resize the text using the following widget:

AutoSizeText(
  'The text to display',
  style: TextStyle(fontSize: 20),
  maxLines: 2,
)

You can give the maximum lines to expand and the font size by default for more accurate behavior of auto-resizing. Additionally, you can add maximum and minimum font size as well

AutoSizeText(
  'A really long String',
  style: TextStyle(fontSize: 30),
  minFontSize: 18,
  maxLines: 4,
  overflow: TextOverflow.ellipsis,
)

Or, you can also set some pre-defined font size to adapt while resizing the font size.

AutoSizeText(
  'A really long String',
  presetFontSizes: [40, 20, 14],
  maxLines: 4,
)

import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';


Future<void> main() async {
  runApp(MyApp());
}

class MyApp extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Home(),
    );
  }
}

class Home extends StatefulWidget{
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) { 
    return  Scaffold(
          appBar: AppBar( 
              title: Text("Auto Resize Text"),
              backgroundColor: Colors.redAccent,
          ),
          body: Container( 
            padding: EdgeInsets.all(30),
            child: Column(
               children:[
                     AutoSizeText(
                       "Lorem Ipsum is simply dummy text of the printing" + 
                       "and typesetting industry. Lorem Ipsum has",
                       maxLines:5,
                       style: TextStyle(fontSize:30),
                    ),

                    AutoSizeText(
                       "Lorem Ipsum is simply dummy text of the printing" + 
                       "and typesetting industry. Lorem Ipsum has been " +  
                       "the industry's standard dummy text ever since the 1500s",
                       maxLines:4,
                       style: TextStyle(fontSize:30),
                    ),

               ]
            )
          ),
           
       );
  }
}