flutter 撸的第一个页面-登录页面

最近断断续续的学习了一下flutter，感觉现在已经学不动了，太多的资料也不想一一看了，原本一节一节的边学边练，时间根本就不允许沉下心来专门去做。无奈只能是直接上手，找现成的，找资料...... 强迫症的说，就算拷贝了现成的UI，还是感觉不踏实，没有自己的风格就感觉代码没有了灵魂，只能参考着边学习，边自己撸了，总算出了一款登录页面。

 对于初学者来说就算一个简单的页面效果也很有成就感！！！

import 'package:flutter/material.dart';


/***
 * login page base
 */
class loginState extends StatelessWidget{

  @override
  Widget build(BuildContext context) { 
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("登录"),
        centerTitle: true,
      ),
      body: new loginView(),
    );
  }

}

TextEditingController schoolController = new TextEditingController();
TextEditingController userController   = new TextEditingController();
TextEditingController passController   = new TextEditingController();


/*****
 * login ui view
 */
class  loginView extends StatelessWidget{
  @override
  Widget build(BuildContext context) { 
    return new ListView(
      children: <Widget>[
        new Column(
          children: <Widget>[
            loginTopImg(),
            loginSchoolInput(),
            loginUserEditInput(),
            loginPassEditInput(),
            loginButton(context)
          ],
        )
      ],
    );
  }

}


/****
 * login page top img
 */
// ignore: missing_function_parameters
Widget loginTopImg()  {
  return new Padding(
      padding: EdgeInsets.all(40.0),
      child: new Image.asset(
        'images/login_logo.png',
        scale: 1.3,
      ),
  );
}

/*****
 * login page school input
 * ***/
Widget loginSchoolInput(){
  return new Padding(
      padding: EdgeInsets.fromLTRB(20.0, 0.0 ,20.0, 0.0),
      child: new Stack(
        alignment: Alignment(1.0, 1.0),
        children: <Widget>[
          new Row(
            children: <Widget>[
              new Padding(
                 padding: EdgeInsets.all(5.0),
                 child: new Image.asset(
                   "images/icon_username.png",
                   width: 40.0,
                   height: 40.0,
                   fit: BoxFit.fill,
                 ),
              ),
              new Expanded(
                  child: new TextField(
                    controller: schoolController,
                    decoration: new InputDecoration(
                      hintText: "请输入学校"
                    ),
                  )
              )

            ],
          ),
          new IconButton(
              icon: new Icon(Icons.clear),
              onPressed: (){
                schoolController.clear();
              } ,
          )
        ],
      ),
  );
}

/******
 * login user edit input
 * ********/
Widget loginUserEditInput(){
  return new Padding(
      padding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 0.0),
      child: new Stack(
        alignment: Alignment(1.0, 1.0),
        children: <Widget>[
          new Row(
            children: <Widget>[
              new Padding(
                  padding: EdgeInsets.all(5.0),
                  child: new Image.asset(
                    "images/icon_username.png",
                    width: 40.0,
                      height: 40.0,
                      fit: BoxFit.fill,
                  ),
              ),
              new Expanded(
                  child: new TextField(
                    controller: userController,
                    decoration: new InputDecoration(
                      hintText: "请输入用户名"
                    ),
                  )
              ),
            ],
          ),
          new IconButton(icon: new Icon(Icons.clear), onPressed: (){
            userController.clear();
          })
        ],
      ) ,
  );
}

/******
 * login pass edit input
 * ********/
Widget loginPassEditInput(){
  return new Padding(
      padding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 0.0),
      child: new Stack(
        alignment: Alignment(1.0, 1.0),
        children: <Widget>[
          new Row(
            children: <Widget>[
              new Padding(
                  padding: EdgeInsets.all(5.0),
                  child: new Image.asset(
                      "images/icon_password.png",
                    width: 40.0,height: 40.0,
                    fit: BoxFit.fill,
                  ),
              ),
              new Expanded(
                  child: new TextField(
                    controller: passController,
                    decoration: new InputDecoration(
                      hintText: "请输入密码"
                    ),
                  )
              ),
            ],
          ),
          new IconButton(icon: new Icon(Icons.clear), onPressed: (){
            passController.clear();
          })
        ],
      ),
  );
}

/************
 * login button
 * **********/
Widget loginButton(BuildContext context){
  return new Container(
    width: 300.0,
    padding: EdgeInsets.fromLTRB(30.0,15.0 , 30.0, 0.0),
    child: new Card(
      elevation: 10.0, // 正常情况下浮动的距离
      color: Colors.amber,
      child: new FlatButton(
          color: Colors.amber,
          child: new Padding(
              padding: EdgeInsets.all(8.0),
              child: new Text("登录",
              style: new TextStyle(
                color: Colors.white,
                fontSize: 16.0
              ),),
          ),
        onPressed: (){
          _checkSub(context);
        },
      ),
    ),
  );
}

/********
 * 登录提交校验
 */
void _checkSub(BuildContext context){
  String msgStr = "";
  if(!schoolController.text.isNotEmpty ){
    msgStr = "请先选择学校";
  }else  if(!userController.text.isNotEmpty){
    msgStr = "用户账号不能为空";
  }else  if(!passController.text.isNotEmpty){ 
    msgStr = "用户密码不能为空";
  }

  if(msgStr != ''){
    showDialog(
      context: context,
      builder: (context){
        return new AlertDialog(
          title: new Text("提示信息"),
          content: new Text(msgStr),
          actions: <Widget>[
            new FlatButton(child: new Text("确定"),onPressed: (){
              Navigator.of(context).pop();
            }),
          ],
        );
      }
    );
  }else{
    Navigator.of(context).push(
      new MaterialPageRoute(builder: (context){
        new loginState();
      }),
    );
  }
}