- Text
1 2 3 4 5 6 7 8 |
Text( 'content', textAlign: TextAlign.left, style: TextStyle( fontWeight: FontWeight.w600, fontSize: 22, ), ), |
- 圆角raisebutton
1 2 3 4 5 6 7 8 9 10 11 |
RaisedButton( shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(10.0), //side: BorderSide(color: Colors.red) ), padding: const EdgeInsets.all(8.0), textColor: Colors.white, color: Colors.green, onPressed: _goMain, child: new Text("Get Started"), ), |
- 带后退箭头的appbar
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
appBar: AppBar( leading: IconButton( icon: Icon(Icons.arrow_back, color: Colors.black), onPressed: () => Navigator.of(context).pop(), ), title: Text( 'Sign In', style: TextStyle( color: Colors.grey[800], ), ), centerTitle: true, backgroundColor: Colors.green, ), |
- 用户名,密码输入框
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
TextFormField( keyboardType: TextInputType.text, decoration: InputDecoration( enabledBorder: OutlineInputBorder( borderSide: BorderSide( color: Colors.indigo, width: 1.5, style: BorderStyle.solid, ), borderRadius: BorderRadius.all( Radius.circular( 15.0, ), ), ), focusedBorder: OutlineInputBorder( borderSide: BorderSide( color: Colors.indigo, width: 1.5, style: BorderStyle.solid), borderRadius: BorderRadius.all( Radius.circular( 15.0, ), ), ), prefixIcon: Icon( Icons.person, color: Colors.black, ), labelText: 'Username', // helperText: 'Your full name', labelStyle: TextStyle( color: Colors.green, fontWeight: FontWeight.normal, ), ), maxLines: 1, ), |
其中
enabledBorder 和 focusborder 可以不要
如果是密码, 加上
1 |
obscureText:true, |
- 圆角container
1 2 3 4 5 6 7 8 9 |
Container( decoration: BoxDecoration( border: Border.all( color: Colors.red[500], ), borderRadius: BorderRadius.all(Radius.circular(20)) ), child: ... ) |
- 多个widget放到一个container里面 , 和container外面的widget 分别设置position
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
import 'package:flutter/material.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Welcome to Flutter', home: Scaffold( appBar: AppBar( title: Text('Welcome to Flutter'), ), body: Stack( alignment: Alignment.center, children: <Widget>[ Positioned( left: 10, child: Container( alignment: Alignment.center, child: RaisedButton( onPressed: () {}, child: Text('Show'), ), ), ), Positioned( //right: MediaQuery.of(context).size.width * .20, right: 10, child: Container( alignment: Alignment.center, padding: EdgeInsets.all(10.0), //child: show ? CircularProgressIndicator() : Container(), child : Row( children: <Widget>[ CircularProgressIndicator(), CircularProgressIndicator(), ], ), ), ) ], ) ), ); } } |