Question

我正在一行中并排添加一个DropdownFormField和TextFormField。这就是构建函数的样子

Widget build(BuildContext context) {
    return Form(
      key: _formKey,
      child: SingleChildScrollView(
        child: Column(
          children: <Widget>[
            Row(
              mainAxisAlignment: MainAxisAlignment.start,
              children: <Widget>[
                DropdownButton(
                  hint: new Text('Select Gender'),
                  items: _salutations,
                  value: client.salutation,
                ),
                SizedBox(width: 20),
                new Expanded(
                  child: TextFormField(
                    decoration: InputDecoration(labelText: 'Name'),
                    validator: (value) {
                      return value.isEmpty ? 'Empty name.' : '';
                    },
                  ),
                ),
              ]
            )
          ],
        )
      ),
    );
  }

该代码当前显示，因为它是DropdownButton。但是，如果我将其更改为DropdownButtonFormField，则只要它在Row（）中，它就不会显示。为什么会这样？

我希望使用DropdownButtonFormField，以便Dropdown的高度与TextFormField相同，因为当前代码显示的Dropdown高度较小。

Answer 1

像这样尝试

List<String> valueList = ['A', 'B', 'C', 'D'];

  String _value = '';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Form(
        key: _formKey,
        child: SingleChildScrollView(
          child: Column(
            children: <Widget>[
              Row(
                mainAxisAlignment: MainAxisAlignment.start,
                children: <Widget>[
                  Container(
                    height: 50.0,
                    width: 100.0,
                    child: new DropdownButtonFormField<String>(
                      hint: new Text('Select'),
                      items: valueList.map((String value) {
                        return new DropdownMenuItem<String>(
                          value: value,
                          child: new Text(value),
                        );
                      }).toList(),
                    ),
                  ),
                  SizedBox(width: 20),
                  new Expanded(
                    child: Container(
                      height: 50.0,
                      child: TextFormField(
                        decoration: InputDecoration(labelText: 'Name'),
                        validator: (value) {
                          return value.isEmpty ? 'Empty name.' : '';
                        },
                      ),
                    ),
                  ),
                ],
              )
            ],
          ),
        ),
      ),
    );
  }

DropdownButtonFormField的宽度必须在Row内，因此请将其包装在Container内，并为该width设置Container

希望这会有所帮助。

Flutter DropdownButtonFormField不显示在行

1 个答案: