项目搭建01 做底部 4个item 分页. package导入
1.flutter保证文字大小不受手机系统设置影响
只需要要在 MaterialApp 的builder MediaQuery 如下:
MaterialApp(
......
builder: (context, child) {
/// 保证文字大小不受手机系统设置影响 https://www.kikt.top/posts/flutter/layout/dynamic-text/
return MediaQuery(
data: MediaQuery.of(context).copyWith(
textScaleFactor:
1.0), // 或者 MediaQueryData.fromWindow(WidgetsBinding.instance.window).copyWith(textScaleFactor: 1.0),
child: child,
);
});
2.flutter去除BottomNavigationBar水纹
1.在外层包裹一层 Theme 用 ThemeData去除(如下)
2.用 ios 风格的 CupertinoTabBar
Scaffold(
bottomNavigationBar: Theme(
data: ThemeData(
brightness: Brightness.light,
splashColor: Colors.transparent,
highlightColor: Colors.transparent,
),
child: BottomNavigationBar(
items: _buildBottomNavigationBarItem(),
type: BottomNavigationBarType.fixed,
currentIndex:value,
.........
));
3.flutter BottomNavigationBar 保持状态
AutomaticKeepAliveClientMixin,通过在子页面的 State 类重写wantKeepAlive为true
- BottomNavigationBar+indexStack //缺点 一开头就会加重 下面所有的 页面
- BottomNavigationBar+Stack+ Offstage //其实和上面是一样的.缺点 一开头就会加重 下面所有的 页面
- PageView+BottomNavigationBar //推荐
详情请看 https://zhuanlan.zhihu.com/p/58582876
4.flutter ValueNotifier 数据通信
ValueNotifier是一个包含单个值的变更通知器,当它的值改变的时候,会通知它的监听。
class HomeProvider extends ValueNotifier<int> {
HomeProvider() : super(0);
}
初始化
HomeProvider provider=HomeProvider();
每当 改变provider.value 的值 会通知刷新 ,可以结合provider consumer 刷新局部
网友评论