Question

//这是我的main.dart文件

class UserRegistrationPage extends StatefulWidget {
     @override
  UserRegistrationPageState createState() => UserRegistrationPageState();
 }

 class UserRegistrationPageState extends State<UserRegistrationPage>{

   @override
     Widget build(BuildContext context) {
    return MaterialApp(
      home: new Scaffold(
        body: new SingleChildScrollView(
          child: new Container(
            child: new Form(
              child: formUi(),
            ),
          ),
        ),
      ),
        );
  }
  Widget formUi(){
    return new Column(
       children: <Widget>[
        new Image(
                image: new AssetImage("assets/bgtopbar.png"),
                fit: BoxFit.cover,
        ),
         new TextFormField(
                  //  margin: new EdgeInsets.all(15.0),
           decoration: new InputDecoration(hintText: 'Mobile Number'),
           keyboardType: TextInputType.phone,
           maxLength: 10,
         ),
         new TextFormField(
           decoration: new InputDecoration(hintText: 'First Name'),
           maxLength: 20, 
         ),
         new TextFormField(
           decoration: new InputDecoration(hintText: 'Last Name'),
           maxLength: 20,
         ),
         new TextFormField(
           decoration: new InputDecoration(hintText: 'Gender'),
           maxLength: 10,
         ),
       ],
    );
  }

我只想为我不想设置图像的表单中的编辑文本字段设置边距。我如何为表单中的单个小部件提供边距。我知道这个问题很简单，但是我是新手扑腾，所以请帮我解决这个问题

Answer 1

您可以将其包装在Container

中

Container(
  margin: EdgeInsets.all(4.0),
  child: yourWidget,
);

UPD：

如果您只想设置水平边距-您可以组织以下小部件：

Column
  Image
  Container
    Column
      TextFormField
      TextFormField
      TextFormField
      TextFormField

Answer 2

创建以下方法并根据需要设置边距

Widget allTextFieldWithMargin(){
    return Container(
    margin: new EdgeInsets.all(15.0), // Or set whatever you want 
    child: Column(
        children: <Widget>[
          new TextFormField(
            //  margin: new EdgeInsets.all(15.0),
            decoration: new InputDecoration(hintText: 'Mobile Number'),
            keyboardType: TextInputType.phone,
            maxLength: 10,
          ),
          new TextFormField(
            decoration: new InputDecoration(hintText: 'First Name'),
            maxLength: 20,
          ),
          new TextFormField(
            decoration: new InputDecoration(hintText: 'Last Name'),
            maxLength: 20,
          ),
          new TextFormField(
            decoration: new InputDecoration(hintText: 'Gender'),
            maxLength: 10,
          ),
        ],
      ),
    );
   }

并调用 allTextFieldWithMargin 方法，例如belwo

 Widget formUi(){
    return new Column(
      children: <Widget>[
        new Image(
          image: new AssetImage("assets/bgtopbar.png"),
          fit: BoxFit.cover,
        ),
       allTextFieldWithMargin()
      ],
    );
  }

颤振如何为表单中的特定小部件设置边距

2 个答案: