100日後にFlutter生活:18日目:ログイン画面をパクってみる。(つづき)
引き続き、Youtube動画を見ながら FlutterのUIを勉強中です。
3:30くらいまで来ました。
Email 入力欄を追加しました。
ふむふむ。
Container のWidgetでも、decoration、borderRadius、boxShadow などを上手く使えば、オシャレに見えますね!
センタリングなどは、Column に任せればいいということなのかな。
child: Padding( padding: EdgeInsets.all(20), child: Column( children: <Widget>[ SizedBox( height: 60, ), Container( padding: EdgeInsets.all(20), decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.circular(10), boxShadow: [ BoxShadow( color: Color.fromRGBO(225, 95, 27, .3), blurRadius: 20, offset: Offset(0, 10)) ], ), child: Column( children: <Widget>[ Container( decoration: BoxDecoration( border: Border( bottom: BorderSide(color: Colors.grey[200]), ), ), child: TextField( decoration: InputDecoration( hintText: "Email or Phone number", hintStyle: TextStyle(color: Colors.grey), border: InputBorder.none), ), ), ], ), ), ], ), ),