最近剛開始學(xué)習(xí)Flutter互例，并且要手動(dòng)做項(xiàng)目了奢入。。媳叨。
這里最基本的就不介紹了腥光，環(huán)境搭建，新建項(xiàng)目啥的肩杈。柴我。。
第一個(gè)肯定是登錄頁面扩然，剛開始編寫出來沒問題艘儒，界面大概長這樣：
這里大概遇到了一些小坑，比如遮擋問題 網(wǎng)上一致做法是外邊包一個(gè)：
SingleChildScrollView
夫偶。界睁。代碼先不上了，最后會(huì)有完整的代碼兵拢。
但是后來產(chǎn)品該需求了翻斟，App啟動(dòng)后不是登錄頁面而是主頁面，然后在里邊點(diǎn)擊某個(gè)功能來判斷是否登錄说铃，如果沒有登錄就跳轉(zhuǎn)到登錄访惜，界面也改進(jìn)了下，大概這樣的：
代碼如下（注意這是界面部分代碼腻扇，邏輯啥的都么寫）：
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
),
body: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
buildTitle(),
SizedBox(height: 50.0),
buildPhoneNumber(),
buildUserProfile(),
buildLoginButton(),
SizedBox(height: 120.0,),
buildWechatLogin(),
],
),
)
);
buildTitle(){
return Padding(
padding: EdgeInsets.fromLTRB(15.0,50.0,30.0,15.0),
child: Text(
"請(qǐng)輸入您的手機(jī)號(hào)",
style: TextStyle(
color: Colors.black,
fontSize: 28.0
),
),
);
}
buildPhoneNumber(){
return Padding(
padding: EdgeInsets.fromLTRB(20.0, 0.0, 20.0, 15.0),
child: Stack(
alignment: Alignment(1.0, 1.0),
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Text("+86",style: TextStyle(fontSize: 18.0,color: Color(0xFF7D7D7D))),
SizedBox(width: 20.0,),
Expanded(
child: TextField(
controller: _phoneController,
keyboardType: TextInputType.number,
decoration: InputDecoration(
hintText: "請(qǐng)輸入手機(jī)號(hào)"
),
style: TextStyle(fontSize: 24.0),
onChanged: _onPhoneNumChange,
)
)
]),
IconButton(
icon: Icon(Icons.clear,color: Colors.black45),
onPressed: (){
_phoneController.clear();
},
)
],
),
);
}
buildUserProfile(){
return Row(
children: <Widget>[
Radio(value: null, groupValue: null, onChanged: null),
Text("登錄既已同意",style: TextStyle(color: Color(0xFFBAB9B9)),),
Container(
child: GestureDetector(
child: Text("《用戶注冊(cè)協(xié)議》",style: TextStyle(color:Color(0xFFEA8408))),
onTap: _doUserProfile,
),
)
],
);
}
buildLoginButton(){
return Container(
alignment: Alignment.center,
child: Container(
width: 340.0,
child: Card(
color: Color(0xfff2f2f2),
// elevation: 16.0,
child: FlatButton(
child: Padding(
padding: EdgeInsets.all(10.0),
child: Text(
'下一步',
style: TextStyle(
color: Color(0xffd7d7d7), fontSize: 16.0),
),
),
onPressed: () {
_doLogin();
},
),
),
),
);
}
buildWechatLogin(){
return Container(
alignment: Alignment.bottomCenter,
child: Container(
child: Column(
children: <Widget>[
Text("第三方登錄",style: TextStyle(color: Color(0xff949494)),),
FlatButton(
onPressed: _wechatLogin,
child: Image(
image: AssetImage("assets/images/wechat.png"),
width: 70.0,
height: 70.0,
fit: BoxFit.contain,
)
)
],
),
)
);
}
嗯债热，界面擼出來了。幼苛。窒篱。。。墙杯∨洳ⅲ看上去也沒啥問題， 想著舒服了吧高镐，
但是溉旋，但是，但是 碰到一個(gè)大問題避消，當(dāng)我點(diǎn)擊電話輸入框時(shí)低滩，我的界面整體往上移動(dòng)了。岩喷。。而且其他控件被遮擋了监憎。纱意。。鲸阔？偷霉？？褐筛？
一萬個(gè)CNM飄過类少。。這啥情況啊渔扎，我直接啟動(dòng)登錄頁是沒問題的啊硫狞，但是在里邊怎么會(huì)有問題呢？晃痴？残吩？
網(wǎng)上各種搜，都沒有解決倘核，
自己硬著頭皮看代碼：發(fā)現(xiàn)了如下的問題
在APP啟動(dòng)的時(shí)候是這樣的main.dart 文件：
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Maxima Driver',
theme: ThemeData(
primaryColor: Color(ThemeColor),
backgroundColor: Color(0xFFEFEFEF),
accentColor: Color(0xFF888888),
textTheme: TextTheme(
body1: TextStyle(color: Color(0xFF888888),fontSize: 16.0)
),
iconTheme: IconThemeData(
color: Color(ThemeColor),
size: 35.0
)
),
home: new Scaffold(
body: LoginPage(),
),
注意home 部分泣侮，我這里包了一個(gè)Scaffold ，但是 我LoginPage里 也有一個(gè)Scaffod紧唱，
這里就很奇怪了活尊，抱著懷疑的心里，包含肯定會(huì)有問題漏益，然后我去掉了蛹锰，改成這樣的：
home: LoginPage(),
把 Scaffod這個(gè)東西去掉。
直接運(yùn)行： 哇 竟然成功了遭庶。宁仔。。峦睡。翎苫。权埠。
希望能夠幫到大家。煎谍。攘蔽。。呐粘。满俗。。作岖。
