Question 246623 in Flutter Question posted in
The official Flutter documentation can be found here.

Flutter – How to align the text in AppBar Actions?

To make the text to the center of the AppBar instead of the top of the AppBar.

To align the text lower a bit

1

 appBar: AppBar(
          backgroundColor: Colors.white,
          title: const Text("Test", style:TextStyle(color: Colors.black)),
          actions: [Text( formattedDate, style:TextStyle(color: Colors.black))
          ],
        ),
Tags:

2

Answers


  1. 0

    Wrap the Text widget with an Align widget like this:

    appBar: AppBar(
  backgroundColor: Colors.white,
  title: Text(
    "Test",
    style: TextStyle(color: Colors.black),
  ),
  actions: [
    Align(
      alignment: Alignment.center,
      child: Text(
        formattedDate,
        style: TextStyle(color: Colors.black),
      ),
    ),
  ],
),
    Login or Signup to reply.
  2. 0

    To align the text in the actions of your AppBar in Flutter, you can wrap the Text widget with a Container and use the alignment property to control the alignment. Here’s an example of how to do it:

    AppBar(
  backgroundColor: Colors.white,
  title: const Text("Test", style: TextStyle(color: Colors.black)),
  actions: [
    Container(
      alignment: Alignment.center, // Adjust alignment as needed
      child: Text(
        formattedDate,
        style: TextStyle(color: Colors.black),
      ),
    ),
  ],
)

    In the code above, the Container is used to wrap the Text widget within the actions list of the AppBar, and the alignment property of the Container is set to Alignment.center to horizontally center-align the text. You can adjust the alignment by using other values from the Alignment class as needed.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search