-1

我正在尝试扩展单个子滚动视图,但没有任何运气。我尝试过扩展单个子滚动视图、包装在容器中和/或扩展子小部件,但我得到一个错误或者它没有扩展。我不确定我做错了什么,或者如何扩展单个子滚动视图。

理想的结果是显示白色容器扩展到设备底部的图像,但我目前得到的结果是留下一个间隙并显示紫色背景。

当前结果: 在此处输入图像描述

代码:

class Login extends StatefulWidget {
  const Login({Key? key}) : super(key: key);

  @override
  _LoginState createState() => _LoginState();
}

class _LoginState extends State<Login> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: cPrimaryColor,
      body: SafeArea(
        child: Container(
          height: double.infinity,
          child: SingleChildScrollView(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                VerticalWidetSpacer(height: 40.0),
                Padding(
                  padding: kLoginMargin,
                  child: Text('Create Better',
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: tHeader,
                    fontWeight: FontWeight.bold
                  ),),
                ),
                VerticalWidetSpacer(height: 20.0),
                Padding(
                  padding: kLoginMargin,
                  child: Text('Duis aute irure dolor in reprehenderit in voluptate velit esse cillum',
                  style: TextStyle(
                    fontSize: tBody,
                    color: Colors.white
                  ),),
                ),
                VerticalWidetSpacer(height: 60.0),
                Column(
                  children: [
                    Container(
                      width: double.infinity,
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.only(
                          topLeft: Radius.circular(20.0),
                          topRight: Radius.circular(20.0)
                        ),
                      ),
                      child: Column(
                        children: [
                          VerticalWidetSpacer(height: 30.0),
                          Text('Sign in',
                          style: TextStyle(
                            fontSize: tBodyHeader,
                            color: Colors.black,
                            fontWeight: FontWeight.bold
                          ),),
                          VerticalWidetSpacer(height: 40.0,),
                          LoginTextField(
                            fieldLabel: 'Email',
                            prefixIcon: Icon(FontAwesomeIcons.envelope),
                            hintText: 'example@gmail.com',
                          ),
                          VerticalWidetSpacer(height: 20.0),
                          LoginTextField(
                            fieldLabel: 'Password',
                            suffixIcon: Icon(FontAwesomeIcons.eyeSlash),
                            hintText: '●●●●●●●●',
                          ),
                          VerticalWidetSpacer(height: 20.0),
                          LoginButton(),
                          NewTextButton(
                            buttonText: 'Forgot Password',
                            onPressed: () {

                            },
                            textColor: Color(0xFF6E6E6E),
                            textFontSize: 18.0,
                          ),
                          VerticalWidetSpacer(height: 40.0),
                          Column(
                            mainAxisAlignment: MainAxisAlignment.end,
                            children: [
                              NewTextButton(
                                buttonText: 'Create a new account',
                                onPressed: () {

                                },
                                textColor: cButtonColor,
                                textFontSize: 18.0,
                                useFontWeight: true,
                                fontWeight: FontWeight.bold,
                              )
                            ],
                          )
                        ],
                      ),
                    ),
                  ],
                )
              ],
            ),
          ),
        ),
      ),
    );
  }
}
4

2 回答 2

0
import 'package:flutter/material.dart';

class Login extends StatefulWidget {
  const Login({Key? key}) : super(key: key);

  @override
  _LoginState createState() => _LoginState();
}

class _LoginState extends State<Login> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: false,
      backgroundColor: Colors.purple,
      body: SafeArea(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const Padding(padding: EdgeInsets.symmetric(vertical: 20.0)),
            const Padding(
              padding: EdgeInsets.symmetric(horizontal: 15.0),
              child: Text('Create Better',
              style: TextStyle(
                color: Colors.white,
                fontSize: 38,
                fontWeight: FontWeight.bold
              ),),
            ),
            const Padding(padding: EdgeInsets.symmetric(vertical: 10.0)),
            const Padding(
              padding: EdgeInsets.symmetric(horizontal: 15.0),
              child: Text(
                'Duis aute irure dolor in reprehenderit in voluptate velit esse cillum',
                style: TextStyle(
                  fontSize: 18,
                  color: Colors.white
                ),
              ),
            ),
            const Padding(padding: EdgeInsets.symmetric(vertical: 25.0)),
            Expanded(
              child: Container(
                decoration: const BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(20.0),
                    topRight: Radius.circular(20.0)
                  ),
                ),
                child: Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 15.0),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      const Padding(padding: EdgeInsets.symmetric(vertical: 20.0)),
                      const Text(
                        'Sign in',
                        style: TextStyle(
                          fontSize: 24,
                          color: Colors.black,
                          fontWeight: FontWeight.bold
                        ),
                      ),
                      const Padding(padding: EdgeInsets.symmetric(vertical: 20.0)),
                      const Text(
                        "Email",
                        style: TextStyle(
                          fontSize: 18.0,
                          color: Colors.black
                        ),
                      ),
                      TextFormField(
                        decoration: const InputDecoration(
                          filled: true,
                          fillColor: Colors.white,
                          contentPadding: EdgeInsets.all(10),
                          hintText: "Example.mail.com",
                          hintStyle: TextStyle(
                            color: Colors.black26,
                            fontSize: 16.0,
                            fontStyle: FontStyle.italic,
                          ),
                        ),
                      ),
                      const Padding(padding: EdgeInsets.symmetric(vertical: 10.0)),
                      const Text(
                        "Password",
                        style: TextStyle(
                          fontSize: 18.0,
                          color: Colors.black
                        ),
                      ),
                      TextFormField(
                        decoration: const InputDecoration(
                          filled: true,
                          fillColor: Colors.white,
                          contentPadding: EdgeInsets.all(10),
                          hintText: "",
                          hintStyle: TextStyle(
                            color: Colors.black26,
                            fontSize: 16.0,
                            fontStyle: FontStyle.italic,
                          ),
                        ),
                      ),
                      const Padding(padding: EdgeInsets.symmetric(vertical: 10.0)),
                      MaterialButton(
                        onPressed: () {

                        },
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Text(
                              "LOGIN",
                              style: TextStyle(
                                color: Colors.white,
                              ),
                            ),
                          ],
                        ),
                        color: Colors.black,
                      ),
                      const Padding(padding: EdgeInsets.symmetric(vertical: 5.0)),
                      const Center(child: Text("Forgot Password")),
                      const Padding(padding: EdgeInsets.symmetric(vertical: 10.0)),
                      const Spacer(),
                      const Center(child: Text("Create new account")),
                      const Padding(padding: EdgeInsets.symmetric(vertical: 10.0)),
                    ],
                  ),
                ),
              ),
            )
          ],
        ),
      ),
    );
  }
}

试试这个,应该是这个样子,还是不知道为什么要用SingleChildScrollView

在此处输入图像描述

于 2021-12-24T09:04:53.617 回答
-1

我认为它来自列大小,将其放入容器中再试一次!

于 2021-12-24T06:48:06.877 回答