在 Flutter 中的操作栏和标题之间添加一些 space

Question

如何在操作栏和标题 textField 之间添加一些 space？

AddWorkRequest

class AddWorkRequest extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
          color: Colors.white
      ),
      child: AddWorkRequestForm(),
    );
  }
}

AddWorkRequestForm

class AddWorkRequestForm extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return new _AddWorkRequestPage();
  }
}

class _AddWorkRequestPage extends State<AddWorkRequestForm> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
        appBar: new AppBar(
          title: new Text("Add Work Request"),
        ),
        body: new Column(
          children: <Widget>[
            titleField(),
            Container(margin: EdgeInsets.only(top: 10.0, bottom: 5.0)),
            detailDescriptionField(),
            Container(margin: EdgeInsets.only(top: 10.0, bottom: 5.0)),
            locationField(),
            Container(margin: EdgeInsets.only(top: 10.0, bottom: 5.0)),
            Align(
              alignment: Alignment.centerLeft,
              child: Container(
                child: Text(
                  'Photos',
                  style: new TextStyle(fontSize: 20.0, fontFamily: 'Roboto'),
                ),
              ),
            )
          ],
        ));
  }

  Widget detailDescriptionField() {
    return StreamBuilder(builder: (context, snapshot) {
      return TextFormField(
          decoration: InputDecoration(
            labelText: StringConstant.detailDescription,
            border: OutlineInputBorder(
                borderRadius: new BorderRadius.circular(10.0),
                borderSide: BorderSide()),
          ));
    });
  }

  Widget locationField() {
    return StreamBuilder(builder: (context, snapshot) {
      return TextFormField(
          decoration: InputDecoration(
            labelText: StringConstant.location,
            border: OutlineInputBorder(
                borderRadius: new BorderRadius.circular(10.0),
                borderSide: BorderSide()),
          ));
    });
  }

  Widget titleField() {
    return StreamBuilder(builder: (context, snapshot) {
      return TextFormField(
          decoration: InputDecoration(
            labelText: StringConstant.title,
            border: OutlineInputBorder(
                borderRadius: new BorderRadius.circular(10.0),
                borderSide: BorderSide()),
          ));
    });
  }
}

Answer 1

您可以将 titleField() 小部件包裹在 Padding 中，并仅提供顶部填充以在操作栏和字段之间增加 space，如下所示：

Padding(
              padding: EdgeInsets.only(top: 10),
              child: titleField()
            ),
            Container(margin: EdgeInsets.only(top: 10.0, bottom: 5.0)),

输出为：

希望这能回答您的问题。

在 Flutter 中的操作栏和标题之间添加一些 space

Add some space between action bar and title in Flutter

android

android-actionbar

flutter