Back Button displaced title of AppBar

Question

Like the title, i have created a button with Navigator.push() into a new page, the page auto generates a back button on the appBar, i appreciated that autogenerated back button

Answer 1

centerTitle: true is used to make the title center in AppBar

AppBar(
  centerTitle: true, 
  ...
)

Output:

Answer 2

Use centerTitle: true like below.

AppBar(
  centerTitle: true, // this is all you need
  //Rest Code here
)

I upload the full code like below.

Widget build(BuildContext context) {
return ScrollConfiguration(
  behavior: MyBehavior(),
  child: SafeArea(
    child: DefaultTabController(
      length: 2,
      child: Scaffold(
        backgroundColor: Colors.black,
        appBar: AppBar(
          centerTitle: true,
          elevation: 0,
          backgroundColor: Colors.grey[850],
          title: Flex(
              direction: Axis.horizontal,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Image.asset(
                  'images/logo2.png',
                  isAntiAlias: true,
                  scale: 1.8,
                  fit: BoxFit.fitHeight,
                  alignment: Alignment.center,
                )
              ]),
          bottom: TabBar(
            indicatorColor: Colors.white,
            tabs: [
              Tab(
                text: 'Submit Feedback',
              ),
              Tab(
                text: 'Submit Testimony',
              )
            ],
          ),
        ),
        body: TabBarView(
          children: [SubmitFeedback(), SubmitTestimony()],
        ),
      ),
    ),
  ),
);
}