所以我试图让 REGISTER 按钮与屏幕底部中心对齐.我对 Flutter 比较陌生,想知道是否有办法轻松做到这一点,还是我需要重写很多代码?这是我到目前为止所拥有的.正如你所看到的,我把它放在一个 Align() 中,但它只到达填充区域的底部中心.我想我要做的就是让外部 Container() 成为整个屏幕的高度,但我也不知道该怎么做.如果你有办法做到这一点,请告诉我.谢谢.
import 'package:flutter/material.dart';类 LoginSignupScreen 扩展 StatefulWidget {@覆盖_LoginSignupScreenState createState() =>_LoginSignupScreenState();}类 _LoginSignupScreenState 扩展状态<LoginSignupScreen>{//TRUE:注册页面,FALSE:登录页面布尔_注册=真;无效_changeScreen(){设置状态((){//将其设置为当前屏幕的反面_register = !_register;});}@覆盖小部件构建(BuildContext 上下文){返回容器(// 高度:,孩子:列(//mainAxisAlignment: MainAxisAlignment.start,孩子们:<小部件>[填充(填充:常量 EdgeInsets.all(20),孩子:行(mainAxisAlignment: MainAxisAlignment.center,孩子们:<小部件>[按钮栏(孩子们:<小部件>[材质按钮(onPressed:_changeScreen,孩子:文本(注册"),),材质按钮(onPressed:_changeScreen,孩子:文本('登录'),),],),],),),填充(填充:EdgeInsets.all(20),孩子:列(孩子们:<小部件>[文本域(装饰:输入装饰(边框:InputBorder.none,hintText:'E-MAIL'),),文本域(装饰:输入装饰(边框:InputBorder.none,提示文本:'用户名'),),文本域(装饰:输入装饰(边框:InputBorder.none,提示文本:'PASSWORD'),)],),),对齐(对齐方式:FractionalOffset.bottomCenter,孩子:材料按钮(onPressed: () =>{},孩子:文本(_register?'REGISTER':'LOGIN'),),),],),);}} 解决方案你将使用
So I'm trying to get the REGISTER button to align on the bottom center of the screen. I'm relatively new to Flutter and am wondering if there is a way to do this easily, or do I need to rewrite a lot of code? Here's what I have so far. As you can see, I put it in an Align(), but it only goes to the bottom center of the filled area. I think what I have to do is make the outside Container() the height of the entire screen, but I also don't know how to do this. If you have a way to do this, please let me know. Thanks.
import 'package:flutter/material.dart'; class LoginSignupScreen extends StatefulWidget { @override _LoginSignupScreenState createState() => _LoginSignupScreenState(); } class _LoginSignupScreenState extends State<LoginSignupScreen> { // TRUE: register page, FALSE: login page bool _register = true; void _changeScreen() { setState(() { // sets it to the opposite of the current screen _register = !_register; }); } @override Widget build(BuildContext context) { return Container( // height:, child: Column( // mainAxisAlignment: MainAxisAlignment.start, children: <Widget>[ Padding( padding: const EdgeInsets.all(20), child: Row( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ ButtonBar( children: <Widget>[ MaterialButton( onPressed: _changeScreen, child: Text('REGISTER'), ), MaterialButton( onPressed: _changeScreen, child: Text('LOGIN'), ), ], ), ], ), ), Padding( padding: EdgeInsets.all(20), child: Column( children: <Widget>[ TextField( decoration: InputDecoration( border: InputBorder.none, hintText: 'E-MAIL'), ), TextField( decoration: InputDecoration( border: InputBorder.none, hintText: 'USERNAME'), ), TextField( decoration: InputDecoration( border: InputBorder.none, hintText: 'PASSWORD'), ) ], ), ), Align( alignment: FractionalOffset.bottomCenter, child: MaterialButton( onPressed: () => {}, child: Text(_register ? 'REGISTER' : 'LOGIN'), ), ), ], ), ); } }解决方案
You will solve using Expanded widget.
Expanded( child: Align( alignment: FractionalOffset.bottomCenter, child: MaterialButton( onPressed: () => {}, child: Text(_register ? 'REGISTER' : 'LOGIN'), ), ), ),更多推荐
小部件不会在 Flutter 中进入屏幕底部?
发布评论