flutter - Flutter - 在appBar上居中TextField不起作用

Question

我有一个以文本字段为标题的应用栏，当我传入应用centerTitle: true栏时，它不会居中并保持与左侧对齐。

这是我的代码

appBar: AppBar(
        // Where user inputs the title of the note
        centerTitle: true,
        title: TextField(
          // The style of the input field
          decoration: InputDecoration(
            hintText: 'Title',
            icon: Icon(Icons.edit), // Edit icon
            // The style of the hint text
            hintStyle: TextStyle(
              color: Colors.black,
              fontSize: 18,
            ),
          ),
          controller:
              titleAndNoteController[0], // The controller of the input box
        ),
        bottom: PreferredSize(
          child: Opacity(
            opacity: 0.25,
            child: Divider(
              color: Colors.black,
              thickness: 1,
              endIndent: 150,
              indent: 150,
            ),
          ),
          preferredSize: Size.fromHeight(4.0),
        ),
        iconTheme: IconThemeData(color: Colors.black),
        backgroundColor: Colors.transparent,
        elevation: 0.0,
      ),

标签： flutterdartflutter-appbar

Answer 1

在 TextField 小部件中使用 textAlign 参数，如下所示：

AppBar(
      // Where user inputs the title of the note
      centerTitle: true,
      title: TextField(
        textAlign : TextAlign.center,
      // The style of the input field
      decoration: InputDecoration(
      hintText: 'Title',
      icon: Icon(Icons.edit), // Edit icon
      // The style of the hint text
      hintStyle: TextStyle(
      color: Colors.black,
      fontSize: 18,
      ),
      ),
      // The controller of the input box
      ),
        ),

结果：