如何修复屏幕末尾的按钮

Question

您好，我有这个 UI，我想在屏幕末尾设置按钮。我怎样才能做到这一点？

这是我的代码。这段代码展示了我如何设计这个 UI。我想知道如何在 screen.I 设置结束时设置按钮 TextField in padding 要与 button.I 间隔，请尝试增加 padding 的值，但效果不佳。我有其他解决方案吗？

Container(
    height: height,
    width: width,
    child: SingleChildScrollView(
      child: new Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          new Padding(
            padding: const EdgeInsets.only(left: 15, right: 10, top: 30),
            child: new InputField(
              textController: receiverController,
              hint: 'نام گیرنده پیام را وارد کنید',
              label: 'گیرنده',
              obscure: false,
              icon: Icons.person_add_alt_1_outlined,
              radius: 15,
            ),
          ),
          SizedBox(
            height: 10,
          ),
          new Padding(
            padding: const EdgeInsets.only(left: 15, right: 10),
            child: new InputField(
              textController: subjectController,
              hint: 'عنوان پیام را وارد کنید',
              label: ' عنوان ',
              obscure: false,
              icon: Icons.title,
              radius: 15,
              // suffixIcon: Icon(Icons.lock),
            ),
          ),
          SizedBox(
            height: 10,
          ),
          new Padding(
            padding: const EdgeInsets.only(left: 15, right: 10),
            child: new InputField(
              textController: textController,
              // hint: 'پیام ',
              label: ' متن',
              obscure: false,
              icon: Icons.message,
              radius: 15,
              // suffixIcon: Icon(Icons.lock),
            ),
          ),
          new Padding(
            padding: const EdgeInsets.all(80),
            child: new ButtonTheme(
                minWidth: width * .25,
                height: 50,
                child: new RaisedButton(
                  onPressed: () {
                    this.newmessageBloc.add(new NewmessageEventSend(
                        receiver: receiverController.text,
                        subject: subjectController.text,
                        text: textController.text));
                  },
                  child: new Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      new Text(
                        'ارسال',
                        style: new TextStyle(
                            color: Colors.white,
                            fontWeight: FontWeight.bold,
                            fontSize: 16),
                      ),
                      Icon(
                        Icons.send_rounded,
                        color: Colors.white,
                      ),
                    ],
                  ),
                  color: new Color(0xff333399),
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(15.0),
                  ),
                )),
          )

Answer 1

您可以在列上使用 Expanded 小部件，然后像这样写您的 btn：

Column(
      children: [
        Expanded(
          child: Container(
            child: SingleChildScrollView(
              child: new Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  new Padding(
                    padding:
                        const EdgeInsets.only(left: 15, right: 10, top: 30),
                    child: Text(""),
                  ),
                  SizedBox(
                    height: 10,
                  ),
                  new Padding(
                    padding: const EdgeInsets.only(left: 15, right: 10),
                    child: Text(""),
                  ),
                  SizedBox(
                    height: 10,
                  ),
                ],
              ),
            ),
          ),
        ),
        new Padding(
          padding: const EdgeInsets.all(80),
          child: new ButtonTheme(
              minWidth: 25,
              height: 50,
              child: new RaisedButton(
                onPressed: () {
                  // this.newmessageBloc.add(new NewmessageEventSend(
                  //     receiver: receiverController.text,
                  //     subject: subjectController.text,
                  //     text: textController.text));
                },
                child: new Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    new Text(
                      'ارسال',
                      style: new TextStyle(
                          color: Colors.white,
                          fontWeight: FontWeight.bold,
                          fontSize: 16),
                    ),
                    Icon(
                      Icons.send_rounded,
                      color: Colors.white,
                    ),
                  ],
                ),
                color: new Color(0xff333399),
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(15.0),
                ),
              )),
        ),
      ],
    )

抱歉，我被迫删除了部分代码，因为我不知道它们。

如何修复屏幕末尾的按钮

How to fix button in end of the screen

android

flutter

user-interface

uibutton

screen