如何在Flutter中扩展Single Child Scroll View

z8dt9xmd 于 2023-03-24 发布在 Flutter

关注(0)|答案(3)|浏览(135)

我试图展开一个单一的子滚动视图，但没有任何运气.我已经尝试展开一个单一的子滚动视图， Package 在一个容器，和/或展开子部件，要么我得到一个错误或它不展开.我不知道我做错了什么，或如何展开一个单一的子滚动视图.
理想的结果将是在图像中显示白色容器扩展到设备的底部，但我目前得到的结果是留下一个缺口，并显示紫色背景。
当前结果：

代码：

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,
                              )
                            ],
                          )
                        ],
                      ),
                    ),
                  ],
                )
              ],
            ),
          ),
        ),
      ),
    );
  }
}

flutter

来源：https://stackoverflow.com/questions/70469873/how-to-expand-single-child-scroll-view-in-flutter

3条答案

按热度按时间

mftmpeh81#

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

赞(0）回复(0）举报 2023-03-24

7vhp5slm2#

使用此CustomScrollView

CustomScrollView(
    slivers: [
      SliverFillRemaining(
        hasScrollBody: false,
        child: Column[..Expand..]

赞(0）回复(0）举报 2023-03-24

dsekswqp3#

我认为它来自列的大小，把它放进一个容器，再试一次！

赞(0）回复(0）举报 2023-03-24

我来回答

如何在Flutter中扩展Single Child Scroll View

3条答案

相关问题

热门标签

最新问答