Flutter程序开发笔记|持续更新

—————————————————————————————————整体板块——————————————————————————————————————

底部导航条:
bottomNavigationBar:BottomNavigationBar
iconSize: 20,//底部图案大小
fixedColor: Colors.red,//选中的颜色
type: BottomNavigationBarType.fixed,//配置底部可以有多个按钮（超过三个）
onTap(int index){}//用于获取点击的是第几个
currentIndex:0//跳转到指定第几页
BottomNavigationBarItem(
  icon: Icon(Icons.home),
  title: Text("首页"),
),
界面刷新
setState(() {
});

点击事件:
onPressed: (){}
返回界面:
Navigator.of(context).pop();

跳转事件//跳转传值
Navigator.of(context).push(
  MaterialPageRoute(
      builder: (context)=>luyou("我再传值"))//luyou为新界面
);
//第二界面
String name1;
class luyou extends StatefulWidget{
  luyou(String name){
   name1=name;
}}
命名路由跳转//命名路由传值
在MaterialApp内注册
routes: {
  '/home_one':(context)=>home_one(),
  '/home_two':(context)=>home_two(),
  '/lu':(context)=>luyou("传过去的指"),
}
执行跳转
Navigator.pushNamed(context,'/lu');
清空所有路由跳转到新界面：
Navigator.of(context).pushAndRemoveUntil(
  new MaterialPageRoute(builder: (context)=>new myful()),
    (route)=>route==null

—————————————————————————————————Text板块——————————————————————————————————————

Text(//Text属性
"文本内容",
textAlign: TextAlign.left,//居左显示,可改为center
overflow: TextOverflow.ellipsis,//文本超出部分用...代替
maxLines: 2,//显示的最大行数
textScaleFactor: 2,//字体按比例放大
style: TextStyle(
  fontSize: 16.0,//字体大小
  color: Colors.white,//字体颜色
  fontWeight: FontWeight.w800,//字体粗细
  fontStyle: FontStyle.italic,//字体倾斜
  decoration: TextDecoration.lineThrough,//划线
  decorationColor: Colors.blue,//划线颜色
  decorationStyle: TextDecorationStyle.dashed,//虚线
letterSpacing: 5.0//字体间隔
)
)

—————————————————————————————————Container容器板块——————————————————————————————————————

Container(
  width: 200,//宽度
  height: 200,//高度
  decoration: BoxDecoration(//容器属性盒子
    color:Colors.green,//容器颜色(设置背景颜色)
    border: Border.all(//边框设置
        color: Colors.black,//边框颜色黑色
    width: 5),//边框大小
    borderRadius: BorderRadius.all(
        Radius.circular(20)//绘制圆角150等于直接画圆
    )//圆角
    
  ),
padding:EdgeInsets.all(20),//内边距
padding: EdgeInsets.fromLTRB(left, top, right, bottom),//上下左右的内边距,不设置就为0
margin: EdgeInsets.all(20),//外边距
transform: Matrix4.translationValues(100, 0, 0),//位移
transform: Matrix4.rotationZ(-0.3),//旋转
  transform:Matrix4.diagonal3Values(1.2, 1, 1),//拉伸
  alignment: Alignment.bottomCenter,//内部元素底部居中
),

—————————————————————————————————Image图片板块——————————————————————————————————————

本地图片:Image.asset
pubspec.yaml中在uses-material-design: true下面配置图片位置,如下:
  assets:
    - images/b.webp
    - images/c.jpeg
网络图片:Image.network

Image.network(
    "https://alpan.51huanqi.cn/d/HQW/电影图片/一条狗的使命2.webp?pw=8601caa430e86dc7",
alignment: Alignment.topLeft,//顶部居左
color: Colors.blue,
colorBlendMode: BlendMode.screen,//混合颜色
fit: BoxFit.cover,//充满容器但不变形
fit:BoxFit.fill//拉伸
fit:BoxFit.contain,//正常大小铺满
repeat: ImageRepeat.repeat,//铺满
),

图片进到圆形
child: ClipOval(//椭圆控件包Image
  child: Image.asset('images/b.webp',
  fit: BoxFit.cover,
    width: 100,
    height: 100,
  ),
),

—————————————————————————————————Listview板块——————————————————————————————————————

ListView(
  // padding: EdgeInsets.all(0),
  children: <Widget>[
ListTile(
  leading: Image.network(url),//左图片
  title:Text("hasjidjdijs",//中间上部分文字
    style: TextStyle(
        fontSize: 20
    ),),
  subtitle: Text("市第三大按键的"),//中间下部分文字
  trailing: Image.network(url),//右图片
),
])