Flutter学习笔记及Dart常用属性

一 Dart常用属性

print(b.isNaN);//是否是数字 NaN
print(b.isEven);//是否是偶数 true
print(b.isOdd);//是否是奇数 false
print(b + c);//24.5
print(b - c);//-0.5
print(b * c);//150.0
print(b / c);//0.96
print(b ~/ c);//0 取整
print(b % c);//12.0

int e = -20;
print(e.abs());//绝对值 20
double f = 10.5;
print(f.round());//四舍五入 11
print(f.floor());//不大于的最大整数 10；
print(f.ceil());//不小于的最小整数 11
print(f.toInt());//转成int 10;
print(b.toDouble());//转double 12.0
print(a.toInt());

flutter GridView.builder|ListView 属性解析

gridDelegate: SliverGridDelegateWithFixedCrossAxisCount|SliverGridDelegateWithMaxCrossAxisExtent
SliverGridDelegateWithFixedCrossAxisCount：用于固定列數的場景；
SliverGridDelegateWithMaxCrossAxisExtent：用于子元素有最大寬度限制的場景

Flutter 实现TabBar的两种方式

方法1：DefaultTabController

class FirstPage extends StatefulWidget {
FirstPage({Key key, this.title}) : super(key: key);

final String title;

@override
State<StatefulWidget> createState() => _FirstPageState();
}

/// DefaultTabController (TabBar + TabBarView) 使用 (内部还是TabController实现)
class _FirstPageState extends State<FirstPage> {
final List<Tab> myTabs = <Tab>[
Tab(text: '全部订单'),
Tab(text: '已完成'),
Tab(text: '未完成')
];

@override
Widget build(BuildContext context) {
// 1. 使用 DefaultTabController 作为外层控制器
return DefaultTabController(
length: myTabs.length,// 定义tab数量
child: Scaffold(
appBar: AppBar(
title: Text('FirstPage'),

// 2. 使用 TabBar
bottom: TabBar(
tabs: myTabs // 定义TabWeight,若数量和定义不一致会报错
),
),

// 3. 使用 TabBarView
body: TabBarView(
children: <Widget>[

/// 全部订单
Center(child: Text('全部订单')),

/// 已完成订单
Center(child: Text('已完成')),

/// 未完成订单
Center(child: Text('未完成'))
]),
),
);
}
}

方法2：TabController

混入 SingleTickerProviderStateMixin，重寫初始化和注銷方法，利用控制器TabController管理和更多操作，其實第一種方法內部也是由TabController實現的。

class _MyHomePageState extends State<MyHomePage> with SingleTickerProviderStateMixin {
TabController _tabController;

static const List<Tab> _homeTopTabList = <Tab>[
Tab(text: '音乐', icon: Icon(Icons.music_note)),
Tab(text: '体育', icon: Icon(Icons.directions_run)),
Tab(text: '天气', icon: Icon(Icons.cloud_queue)),
Tab(text: '科技', icon: Icon(Icons.toys))
];

// 2. 初始化状态
@override
void initState() {
super.initState();
// TabController的滚动事件会触发一次监听, 点击事件会触发两次监听(一次是正常触发,一次是tab的动画触发)
_tabController = TabController(length: _homeTopTabList.length, vsync: this);

// 添加监听获取tab选中下标
_tabController.addListener((){
_currentTopTabIndex = _tabController.index;
});
}

// 3. 注销状态
@override
void dispose() {
_tabController.dispose();
super.dispose();
}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),

// 4. 添加TabBar
bottom: TabBar(
tabs: _homeTopTabList,
controller: _tabController
),
),

// 5. 添加TabBarView
body: TabBarView(
controller: _tabController,
children: <Widget>[
_tabMusic(context),
_tabSport(context),
_tabSport(context),
_tabSport(context)
],
),
);
}

Flutter中應用前後台切換監聽-WidgetsBindingObserver

1.混入with WidgetsBindingObserver 类(必须是StatefulWidget)
2.initState() { WidgetsBinding.instance!.addObserver(this);// 添加观察者 }
3.dispose() { WidgetsBinding.instance!.removeObserver(this);// 移除观察者 }

@override
void didChangeAppLifecycleState(AppLifecycleState state) {
switch (state) {
case AppLifecycleState.inactive:
_timerCancel();
DebugUtil.printMessage('tip', '到活动管理');
break;
case AppLifecycleState.resumed: //从后台切换前台，界面可见
_timerCancel();
_setLoadingTime();
DebugUtil.printMessage('tip', '到前台');
break;
case AppLifecycleState.paused: // 界面不可见，后台
_timerCancel();
DebugUtil.printMessage('tip', '到后台');
break;
case AppLifecycleState.detached: // APP结束时调用 一般不会工作
_timerCancel();
DebugUtil.printMessage('tip', '结束2');
break;
}
}