Baseline in Flutter

The Baseline widget is used to align children's baselines to a specified baseline.
This is especially useful if you have multiple text or inline widgets in a row and  want to align them based on a common baseline..

There Are Some Common Attributes for Baseline

File open lib->main.dart file −

import 'package:flutter/material.dart';

void main() {
  runApp(
      MaterialApp(
        home: Scaffold(
          appBar: AppBar(
            backgroundColor: Colors.blue,
            title: Text('Baseline Example',
              style:TextStyle(fontSize: 20,color: Colors.white)),
          ),
          body: MyApp(),
        ),
      )
  );
}

class MyApp extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return
      Center(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Baseline(
              baseline: 1.0, // Adjust this value based on your design
              baselineType: TextBaseline.alphabetic,
              child: Text(
                'Baseline Text 1',
                style: TextStyle(fontSize: 18.0),
              ),
            ),
            SizedBox(width: 20.0),
            Baseline(
              baseline: 30.0, // Align this baseline with the first one
              baselineType: TextBaseline.alphabetic,
              child: Text(
                'Baseline Text 2',
                style: TextStyle(fontSize: 24.0),
              ),
            ),
          ],
        ),
      );

  }
}

Open Device Manager, run the emulator, and then run the application. Next, check the working output and check the output you declared in your code.