我是新手,所以我想知道如何设置宽度以匹配父布局宽度

new Scaffold(
    body: new Container(
  decoration: new BoxDecoration(color: AppColors.hoBlue),
  child: Padding(
    padding: EdgeInsets.all(20.0),
    child: new Center(
        child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Stack(
          children: <Widget>[
            Row(
              children: <Widget>[
                Expanded(
                  child: Padding(
                    padding: EdgeInsets.all(20.0),
                    child: Card(
                      child: Padding(
                          padding: EdgeInsets.fromLTRB(20, 0.0, 20.0,20.0),
                          child: Column(
                            children: <Widget>[
                               Card(
                                    elevation: 10.0,
                                    child: Padding(
                                      padding: EdgeInsets.all(20.0),
                                      child:
                                      Text("Sign Up Here"),
                                    ),
                                  ),
                              TextField(
                                decoration: InputDecoration(
                                  labelText: "Email",
                                  hintText: "example@mail.com",
                                ),
                                autofocus: true,
                              ),
                              TextField(
                                decoration: InputDecoration(
                                  labelText: "Password",
                                ),
                                autofocus: true,
                              ),
                              SizedBox(
                                width: double.infinity,
                                // height: double.infinity,
                                child: new RaisedButton(
                                  color: AppColors.hoBlue,
                                  child: Text(
                                    "Sign In",
                                    style: TextStyle(
                                      color: Colors.white,
                                      fontFamily: 'Raleway',
                                      fontSize: 22.0,
                                    ),
                                  ),
                                  onPressed: () => print('Sign In'),
                                ),
                              )
                            ],
                          )),
                    ),
                  ),
                ),
              ],
            )
          ],
        ),
      ],
    )),
  ),
));

Result From Code Above

我需要帮助来制作卡片堆叠和家长喜欢 Result I want

我已经try 使用堆栈,但是结果卡的父卡覆盖了第一张卡.

我知道一点关于扩展标签的内容,但是在两个方向上都扩展了扩展视图,我不知道怎么做.如果你知道的话帮我,提前谢谢.

推荐答案

你不需要Stack就可以得到这个视图——可以使用Column&;Material小工具.

return Scaffold(
        body: new Container(
      decoration: new BoxDecoration(color: Colors.blue),
      child: new Center(
          child: MergeSemantics(
            child: Padding(
              padding: const EdgeInsets.all(16.0),
              child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
              Card(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  children: <Widget>[
                    Material(
                      elevation: 24.0,
                      child: Padding(
                        padding: const EdgeInsets.all(20.0),
                        child: Text("Sign Up Here"),
                      ),
                    ),
                    Padding(
                        padding: EdgeInsets.fromLTRB(20, 10.0, 20.0, 20.0),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.stretch,
                          children: <Widget>[
                            TextField(
                              decoration: InputDecoration(
                                labelText: "Email",
                                hintText: "example@mail.com",
                              ),
                              autofocus: true,
                            ),
                            TextField(
                              decoration: InputDecoration(
                                labelText: "Password",
                              ),
                              autofocus: true,
                            ),
                            SizedBox(
                              width: double.infinity,
                              // height: double.infinity,
                              child: new RaisedButton(
                                color: Colors.blue,
                                child: Text(
                                  "Sign In",
                                  style: TextStyle(
                                    color: Colors.white,
                                    fontFamily: 'Raleway',
                                    fontSize: 22.0,
                                  ),
                                ),
                                onPressed: () => print('Sign In'),
                              ),
                            )
                          ],
                        )),
                  ],
                ),
              ),
        ],
      ),
            ),
          )),
    ));

输出: enter image description here

Dart相关问答推荐

为什么我们在dart 里有工具?

dart run edge build cloudflare_workers --dev 命令在我的项目(笔记本电脑)中不起作用

切换到可靠的零安全后简单分配中的可空性不匹配

如何使用 dart 将 Uint8list 转换为 List

在`lib`文件夹中使用`src`子文件夹有什么好处吗

Mockito - 在空安全迁移后存根方法

try 部署到 Google AppEngine 时出现 Dev_appserver.py 错误

如何使用Flutter dio 下载文件?

如何计算列表中元素的出现次数

在Dart streams中,listen和forEach有什么区别?

在小部件构建期间,如何在Flutter中导航?

在dart中使用动态(可变)字符串作为正则表达式模式

Flutter /dart 错误:参数类型'Future'不能分配给参数类型'File'

Flutter 使用什么 colored颜色 系统,为什么我们使用 `const Color` 而不是 `new Color`

如何为 macos 桌面应用启用 Flutter 上网权限?

Dart 有 int.INFINITY 吗?

为什么 Angular 在组件名称中不需要破折号

从 Dart 调用 javascript

是否可以在 Dart 中的一行上初始化列表?

如何在 Dart 中进行整数除法?