Question

我开发了一个登录屏幕，首先在打开键盘时出现render flex错误，因此我将小部件包装在SingleChildScrollView中，但是在那之后Column的mainAxisAlignment无法正常工作，但是当我删除SingleChildScrollView之后一切正常除了render flex错误。我不知道该怎么做请帮忙。以下是代码：

for i in range(1, 5):
    success = False
    while not success:
        success = some_function(i)

Answer 1

你可以试试这个代码块

CustomScrollView(
            scrollDirection: Axis.vertical,
            slivers: [
              SliverFillRemaining(
                hasScrollBody: false,
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  children: [
                    Text('test'),
                    for (int i = 0; i < 10; i++) const FlutterLogo(size: 80)
                  ],
                ),
              ),
            ],
          ),

Answer 2

用Column包装SingleChildScrollView后，用Center小部件包装。

Answer 3

use Column in Container and Container in SingleChildScrollView, give 
height: MediaQuery.of(context).size.height to Continer ;
SingleChildScrollView(
  child : Container(
    height: MediaQuery.of(context).size.height-50,
    child :Column()
    )
)

Answer 4

当您将“列”包装到“ SingleChildScrollView”中时，“列”的

是的MainAxisAlignment”属性不起作用。我不知道原因，但这就是事实。

当我绝对需要滚动视图时，我使用'SizedBox（height：xx）'在'Column'内的小部件之间留出空间，否则我倾向于不使用'SingleChildScrollView'。

Answer 5

您可以使用容器对列进行包装...

完整代码：

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

class LoginScreenOne extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: SafeArea(
          child: Stack(
            children: [
              Container(
                height: double.infinity,
                width: double.infinity,
                color: Colors.blue,
              ),
              SingleChildScrollView(
                child: Container(
                  child: Column(
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Container(
                      width: double.infinity,
                      child: Padding(
                        padding: const EdgeInsets.only(top: 70, left: 20),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Icon(
                              Icons.keyboard_arrow_up,
                              size: 30,
                              color: Colors.white,
                            ),
                            Text(
                              "Login Screen",
                              style: TextStyle(
                                  color: Colors.white,
                                  fontSize: 24,
                                  fontWeight: FontWeight.bold),
                            ),
                          ],
                        ),
                      ),
                    ),
                    ),
                    Container(
                      width: double.infinity,
                      height: MediaQuery.of(context).size.height * 0.6,
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.only(
                          topLeft: Radius.circular(30),
                          topRight: Radius.circular(30),
                        ),
                      ),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Padding(
                            padding: const EdgeInsets.only(top: 50, left: 20),
                            child: Text(
                              "Welcome",
                              style: TextStyle(
                                  fontWeight: FontWeight.bold, fontSize: 20),
                            ),
                          ),
                          Padding(
                            padding: const EdgeInsets.all(20),
                            child: TextField(
                              decoration: InputDecoration(
                                  icon: Icon(Icons.email),
                                  hintText: "Enter User Name"),
                            ),
                          ),
                          Padding(
                            padding: const EdgeInsets.all(20),
                            child: TextField(
                              obscureText: true,
                              decoration: InputDecoration(
                                  icon: Icon(Icons.vpn_key),
                                  hintText: "Enter Password"),
                            ),
                          ),
                          Padding(
                            padding: const EdgeInsets.all(20),
                            child: Container(
                              width: double.infinity,
                              height: 50,
                              child: FlatButton(
                                shape: RoundedRectangleBorder(
                                    borderRadius: BorderRadius.circular(15),
                                    side: BorderSide(width: 2, color: Colors.blue)),
                                textColor: Colors.blue,
                                child: Text(
                                  "Sign In",
                                  style: TextStyle(
                                      fontWeight: FontWeight.bold, fontSize: 16),
                                ),
                                onPressed: () {},
                              ),
                            ),
                          ),
                          Center(
                            child: Text(
                              "Forgot Password",
                              style: TextStyle(color: Colors.grey),
                            ),
                          ),
                          Padding(
                            padding: const EdgeInsets.all(20),
                            child: Container(
                              width: double.infinity,
                              height: 50,
                              child: FlatButton(
                                textColor: Colors.white,
                                shape: RoundedRectangleBorder(
                                    borderRadius: BorderRadius.circular(15)
                                ),
                                child: Text("Create Account"),
                                color: Colors.blue,
                                onPressed: () {},
                              ),
                            ),
                          )
                        ],
                      ),
                    )
                  ],
                ),
              ),
            ],
          ),
        ));
  }
}

Answer 6

这将起作用...

将外部容器的对齐方式设置为alignment.bottomCenter，然后用singleChildScrollView包装该列。肯定会的。谢谢。

Answer 7

设置外层容器的对齐方式，然后用singleChildScrollView将列包裹起来。

Container(
  alignment: Alignment.center, //Set container alignment  then wrap the column with singleChildScrollView
  child: SingleChildScrollView(
     child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: []
),
);

SingleChildScrollView下的MainAxisAlignment无法正常工作

7 个答案: