android-studio - 我如何表示行中的两个文本字段

标签 android-studio flutter dart flutter-layout flutter-dependencies

所以我正在尝试创建这样的布局。我有 2 个水平文本字段,但将其包装成一行。但是在重新加载时没有文本字段显示:

enter image description here

通过这段代码,但是在重新加载时这些都没有出现:

Column(
                    children: <Widget>[
                      SizedBox(height: 10.0),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                        children: <Widget>[
                          TextField(
                            decoration: InputDecoration(
                                labelText: 'Name',
                                labelStyle: TextStyle(
                                    color: Colors.grey[400]
                                )
                            ),
                          ),
                          SizedBox(width: 10.0),
                          TextField(
                            decoration: InputDecoration(
                                labelText: 'Name',
                                labelStyle: TextStyle(
                                    color: Colors.grey[400]
                                )
                            ),
                          ),
                        ],
                      ),
                      SizedBox(height: 10.0),
                      TextField(
                        decoration: InputDecoration(
                            labelText: 'Email/Mobile Number',
                            labelStyle: TextStyle(
                              color: Colors.grey[400],
                            )
                        ),
                      ),
                      SizedBox(height: 10.0),
                      TextField(
                        decoration: InputDecoration(
                            labelText: 'Password',
                            labelStyle: TextStyle(
                              color: Colors.grey[400],
                            )
                        ),
                      ),
                    ],
                  )

最佳答案

您必须使用 Expanded 小部件。 将您的 Row 小部件替换为以下小部件:

  Row(
                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                          children: <Widget>[
                            Expanded(
                              // optional flex property if flex is 1 because the default flex is 1
                              flex: 1,
                              child: TextField(
                                decoration: InputDecoration(
                                    labelText: 'Name',
                                    labelStyle: TextStyle(
                                        color: Colors.grey[400]
                                    )
                                ),
                              ),
                            ),
                            SizedBox(width: 10.0),
                            Expanded(
                              // optional flex property if flex is 1 because the default flex is 1
                              flex: 1,
                              child: TextField(
                                decoration: InputDecoration(
                                    labelText: 'Name',
                                    labelStyle: TextStyle(
                                        color: Colors.grey[400]
                                    )
                                ),
                              ),
                            ),
                          ],
                        ),

关于android-studio - 我如何表示行中的两个文本字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62454131/

相关文章:

ubuntu - 安卓工作室 - "some errors occurred while accessing svn working copy database"

class - Flutter类继承

flutter - 使用Switch语句在Flutter ListView中添加多种颜色

flutter - 如何在 Flutter 中设置 CupertinoButton 的宽度?

firebase - 如何动态地将 map 数组添加到cloud firestore中?

android - 升级的 react 原生版本

java - 在 fragment 上实现向上导航

android - 将项目导入 Android Studio 后出现错误

arrays - 如何从渲染列表中访问对象键?

android - Flutter,显示箭头以指示用户可以向上或向下滚动