How To Easily Set Flutter Text Align Center

Flutter text align center implementation. In this article, we will be implementing Flutter text align center with a proper explanation and by using an easy Flutter example. We will be discussing each and everything about Flutter text align center so you can easily implement it in your code as well. So let’s not wait anymore and get right into implementing Flutter text align center.

Outline

What is Flutter Text Align Center?
Default Flutter Text Alignment
Implementing Flutter Text Align Center
Flutter Text Align Center Implementation Source Code
Conclusion

What is Flutter Text Align Center?

Flutter text align center is the method of making the text alignment to center. Let’s understand it using a proper example. First we will see what the default Flutter text alignment is and then how to change it to Flutter text align center.

Default Flutter Text Alignment

In order to see the default Flutter text alignment, we just have to use a simple Flutter text widget and pass a long text in it to see what alignment is given by default to that text. See the below code:

Text(
    'This is the default Flutter text alignment. This is the default Flutter text alignment.')

You can see in the above image that the default alignment of Flutter text widget is start or we can say each new line of that text is starting from left. Let’s now change the alignment of Flutter text to center.

Implementing Flutter Text Align Center

So now let’s implement the alignment to center. For that, we have to use the text align constructor of the Flutter text widget class. We just have to pass TextAlign.center to the text align constructor of our Flutter text widget class. See the below code:

Text(
   'This is the centered Flutter text alignment. This is the centered Flutter text alignment.',
   textAlign: TextAlign.center,
        )

As you can see in the image above, the alignment of Flutter text widget is now centered.

In this way, you can change the default alignment to Flutter text align center. Let me know in the comment section what you think about this post or how you have implemented the Flutter text align center in your Flutter app. Also if you have any questions regarding Flutter text align center then do let me know in the comments. I would love to answer.

Below is the complete source code of the above implemented Flutter text align center with some decoration.

Flutter Text Align Center Implementation Source Code

flutter text align center

import 'package:flutter/material.dart';
void main() {
  runApp(const MyApp());
}
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Homepage(),
    );
  }
}
class Homepage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
        child: Scaffold(
            body: Padding(
      padding: const EdgeInsets.all(15),
      child: Text(
        'This is the centered Flutter text alignment. This is the centered Flutter text alignment.',
        textAlign: TextAlign.center,
        style: TextStyle(
            color: Colors.blue, fontWeight: FontWeight.bold, fontSize: 15),
      ),
    )));

  }

}

Conclusion

To conclude, now we have a good practical knowledge of how to implement Flutter text align center. I would love to see you comment and share your thoughts regarding this post. I also have other amazing and informative articles on Flutter widgets, Flutter app development, Flutter animations, amazing Flutter templates with source code, Flutter books, and many more. Links to some of these informative articles are listed below. Others valuable topics can be found using the search box or the menu navigation bar. Thanks for reading this post.

Flutter app articles you might like to read: beautiful gradient login UI, Dart Vs JavaScript, flutter login UI form, flutter basics for beginners, explanation of widgets in flutter, flutter architecture, flutter vs native, flutter sliverappbar customization, mobile app marketing tips, flutter bottom navigation bar, flutter appbar actions, flutter appbar title center, why learn react native framework, react native jobs, react native elements, unique flutter development.

How To Easily Set Flutter Text Align Center

Outline

What is Flutter Text Align Center?

Default Flutter Text Alignment

Implementing Flutter Text Align Center

Flutter Text Align Center Implementation Source Code

Conclusion

Share this post:

Leave a Reply Cancel reply

Outline

What is Flutter Text Align Center?

Default Flutter Text Alignment

Implementing Flutter Text Align Center

Flutter Text Align Center Implementation Source Code

Conclusion

Share this post:

Related Posts

Leave a Reply Cancel reply