Question

所以，我是 flutter 的初学者，我正在尝试编写一个像上面一样的 ui 并且一切都很好，但是我在小部件填充方面有问题，就像你在下面的代码中看到的那样，我使用脚手架中的列和容器中的每个小部件，问题是当我在任何容器中设置填充所有小部件效果时！！！我很困惑。感谢您的时间

mockup

代码：

class LandingPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
  body: Stack(
    children: <Widget>[
      Container(
        decoration: BoxDecoration(
          image: DecorationImage(
            image: AssetImage("assets/images/BG.jpg"),
            fit: BoxFit.cover,
          ),
        ),
      ),
      Container(
        width: double.infinity,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Text(
              'h a y l o u l a',
              style: GoogleFonts.lato(
                textStyle: TextStyle(
                  color: Colors.white,
                  letterSpacing: .5,
                  fontWeight: FontWeight.bold,
                  fontSize: 18,
                ),
              ),
            ),
            Column(
              children: [
                Container(
                  padding: EdgeInsets.only(
                    bottom: 24.0,
                  ),
                  child: Text(
                    'sign in',
                    style: GoogleFonts.lato(
                      textStyle: TextStyle(
                        color: Colors.white,
                        letterSpacing: .5,
                        fontWeight: FontWeight.normal,
                        fontSize: 14,
                      ),
                    ),
                  ),
                ),
              ],
            ),
            Column(
              children: [
                TextField(
                  decoration: InputDecoration(
                    prefixIcon: Icon(Icons.person),
                    focusedBorder: OutlineInputBorder(
                      borderSide: new BorderSide(color: Colors.white),
                    ),
                  ),
                ),
                SizedBox(),
                TextField(
                  decoration: InputDecoration(
                    prefixIcon: Icon(Icons.lock_rounded),
                    focusedBorder: OutlineInputBorder(
                      borderSide: new BorderSide(color: Colors.white),
                    ),
                  ),
                  obscureText: true,
                ),
              ],
            ),
            Container(
              child: SizedBox(
                width: MediaQuery.of(context).size.width * 0.65,
                child: RaisedButton(
                  onPressed: () => {},
                  color: Colors.white,
                  shape: RoundedRectangleBorder(
                      borderRadius: new BorderRadius.circular(5.0)),
                  child: Text(
                    'Sign in',
                    style: GoogleFonts.lato(
                      textStyle: TextStyle(
                        color: Colors.blue,
                        letterSpacing: .5,
                        fontWeight: FontWeight.normal,
                        fontSize: 14,
                      ),
                    ),
                  ),
                ),
              ),
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Container(
                  padding: EdgeInsets.only(
                    bottom: 24.0,
                  ),
                  child: Text(
                    'Don\'t have an account ? ',
                    style: GoogleFonts.lato(
                      textStyle: TextStyle(
                        color: Colors.white,
                        letterSpacing: .5,
                        fontWeight: FontWeight.normal,
                        fontSize: 14,
                      ),
                    ),
                  ),
                ),
                Container(
                  padding: EdgeInsets.only(
                    bottom: 24.0,
                  ),
                  child: Text(
                    'sign up',
                    style: GoogleFonts.lato(
                      textStyle: TextStyle(
                        color: Colors.white,
                        letterSpacing: .5,
                        fontWeight: FontWeight.bold,
                        fontSize: 14,
                        decoration: TextDecoration.underline,
                      ),
                    ),
                  ),
                ),
              ],
            ),
            SizedBox(),
          ],
        ),
      ),
    ],
  ),
);
 }

}

my result

Answer 1

用容器包裹你的堆栈，给你的容器一个对称的填充......

Answer 2

将每个配置放在父小部件上，这些配置将影响所有子小部件。如果我在该父容器上设置了填充，那么您会将所有列小部件放在一个容器中，以便所有子列都具有此填充。

你的问题不是很清楚。

颤动小部件填充时的问题

2 个答案: