1

How to left align text title in app bar?
In android: they're still left-aligned, but ios: they're center-aligned title. How to fix that?

AppBar(
      titleSpacing: 0,
      centerTitle: false,
      automaticallyImplyLeading: false,
      leadingWidth: 0,
      title: Image.asset(Images.appLogo, height: 28, width: 28)
);
Huy Nguyen
  • 63
  • 9
  • You can set the platform to android in your theme. See https://stackoverflow.com/questions/58042717/force-flutter-android-application-to-behave-like-it-is-on-an-ios-device – mmcdon20 Jan 17 '23 at 02:03

3 Answers3

1

You can Wrap your Text Widget with Row:

appBar: AppBar(
    title: Row(
      children: const [
        Text(
          "Title",
        ),
      ],
    ),
  ),

OR simply use centerTitle: false;

appBar: AppBar(
    title: const Text("Title"),
    centerTitle: false,
  ),
Marwan Aladwan
  • 58
  • 4
0

You can set the platform parameter in the ThemeData of the app to TargetPlatform.android. Then the app will behave as if it were running on an android device!

import 'package:flutter/material.dart';

void main() {
  runApp(
    MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        platform: TargetPlatform.android,
      ),
      home: Scaffold(
      appbar: AppBar(
          automaticallyImplyLeading: false,
          leadingWidth: 0,
          title: Image.asset(Images.appLogo, height: 28, width: 28)
        );
        body: Container(),
      ),
    ),
  );
}
Xuuan Thuc
  • 2,340
  • 1
  • 5
  • 22
0

In iOS app title have always a center aligned behaviour. If you need align title in left side so you can follow below the code....

appBar: AppBar(
    title: const Text('Restaurant Menu'),
    centerTitle: false,
  ),
Dhruvil Patel
  • 232
  • 2
  • 7