首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

【Flutter】底部导航栏页面框架 ( BottomNavigationBar 底部导航栏 | PageView 滑动页面 | 底部导航与滑动页面关联操作 )

文章目录 一、BottomNavigationBar 底部导航栏 二、PageView 滑动页面 三、BottomNavigationBar 与 PageView 关联 四、完整代码示例 1、核心导航组件...2、四个切换页面 3、应用启动主界面 4、运行效果 五、相关资源 一、BottomNavigationBar 底部导航栏 ---- 在 Scaffold 的 bottomNavigationBar 属性设置底部导航栏...; 设置当前索引 : BottomNavigationBar的 currentIndex 属性设置当前底部导航栏的选中索引 , 为其设置一个变量 , 改变该变量值后 , 通过 setState 方法更新...; 底部按钮设置 : BottomNavigationBar 的 item 属性设置若干 BottomNavigationBarItem 类型的点击按钮 ; 代码示例 : bottomNavigationBar...: BottomNavigationBar( /// 当前选中的导航索引 currentIndex: _currentIndex, /// 底部导航栏的点击方法

4K20
您找到你想要的搜索结果了吗?
是的
没有找到

【Flutter 专题】20 图解【分享页面底部对话框

看似很简单的页面,里面却有很多值得尝试的地方。...BottomSheet BottomSheet 和尚理解为是从底部向上弹的工作表,主要分为两种: Persistent 式工作表:类似于一个全新的页面,完全展示 ScaffoldState.showBottomSheet...1.2 若此时设置内容 Widget 宽高,会发现依旧是重新打开一个页面,高度从底向上占据所设置高度,且点击空白区不会消失,如图: ?...Modal 式工作表:是一个半透明的页面,默认占据屏幕一半 ScaffoldState.showModalBottomSheet。...2.2 若此时设置内容 Widget 宽高,会发现依旧是打开一个半透明页面,高度从底向上占据所设置高度,且点击空白区会消失,如图: ?

1.1K71
领券