Flutter - BottomNavigationBar底部导航栏切换后,状态丢失。底部
import 'package:flutter/material.dart'; import './pages/home_page.dart';
import './pages/book_page.dart';
import 'package:bottom_nav_bar_test/pages/movie_page.dart';
import 'package:bottom_nav_bar_test/pages/music_page.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Bottom Navigation',
home: Main(),
theme: ThemeData(primaryColor: Colors.orange),
);
}
} class Main extends StatefulWidget {
@override
_MainState createState() => _MainState();
} class _MainState extends State<Main> {
int _currentIndex = ;
final List<Widget> _children = [Home(), Book(), Music(), Movie()]; final List<BottomNavigationBarItem> _list = <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(Icons.home),
title: Text('Home'),
//backgroundColor: Colors.orange
),
BottomNavigationBarItem(
icon: Icon(Icons.book),
title: Text('Book'),
//backgroundColor: Colors.orange
),
BottomNavigationBarItem(
icon: Icon(Icons.music_video),
title: Text('Music'),
//backgroundColor: Colors.orange
),
BottomNavigationBarItem(
icon: Icon(Icons.movie),
title: Text('Movie'),
//backgroundColor: Colors.orange
),
]; @override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Bottom Navigation'),
),
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.fixed,
onTap: onTabTapped,
currentIndex: _currentIndex,
items: _list,
),
//body: _children[_currentIndex],
body: IndexedStack(
index: _currentIndex,
children: _children,
),
);
} void onTabTapped(int index) {
setState(() {
_currentIndex = index;
});
}
}
Flutter - BottomNavigationBar底部导航栏切换后,状态丢失。底部的更多相关文章
- Flutter - BottomNavigationBar底部导航栏切换后,状态丢失
如果你用过BottomNavigationBar.TabBar.还有Drawer,你就会发现,在切换页面之后,原来的页面状态就会丢失. 要是上一页有一个数据列表,很多数据,你滚动到了下头,切换页面后, ...
- Flutter - TabBar导航栏切换后,状态丢失
上一篇讲到了 Flutter - BottomNavigationBar底部导航栏切换后,状态丢失 里面提到了TabBar,这儿专门再写一下吧,具体怎么操作,来不让TabBar的状态丢失.毕竟大家99 ...
- Flutter实战视频-移动电商-04.底部导航栏切换效果
04.底部导航栏切换效果 博客地址: https://jspang.com/post/FlutterShop.html#toc-291 我们要做的效果图: 新建四个页面 home_page.dart ...
- mui底部导航栏切换分页
使用Hbuilder的mui框架开发移动端非常便利.高效: 底部导航栏切换功能也是移动APP开发中必须实现的: 引入mui文件.下面会用到jquery,同时引进 <link href=" ...
- MUI底部导航栏切换效果
首先是html代码: <nav class="mui-bar mui-bar-tab"> <a href="view/templates/home/ho ...
- Flutter 底部导航栏bottomNavigationBar
实现一个底部导航栏,包含3到4个功能标签,点击对应的导航标签可以切换到对应的页面内容,并且页面抬头显示的内容也会跟着改变. 实际上由于手机屏幕大小的限制,底部导航栏的功能标签一般在3到5个左右,如果太 ...
- 【Flutter学习】基本组件之BottomNavigationBar底部导航栏
一,概述 BottomNavigationBar即是底部导航栏控件,显示在页面底部的设计控件,用于在试图切换,底部导航栏包含多个标签.图标或者两者搭配的形式,简而言之提供了顶级视图之间的快速导航. 二 ...
- Flutter——BottomNavigationBar组件(底部导航栏组件)
BottomNavigationBar常用的属性: 属性名 说明 items List<BottomNavigationBarItem> 底部导航条按钮集合 iconSize icon c ...
- Flutter移动电商实战 --(4)打通底部导航栏
关于界面切换以及底栏的实现可参考之前写的一篇文章:Flutter实 ViewPager.bottomNavigationBar界面切换 1.新建4个基本dart文件 在pages目录下,我们新建下面四 ...
随机推荐
- rmq区间最值
时间复杂度O(NlogN)+O(Q) int a[N]; int dpmax[N][20],dpmin[N][20]; void first(int n) { mm(dpmax,0); mm(dpmi ...
- linux安装rabbitmq以及相关的操作命令
1.安装rabbitmqa)进入rabbitmq文件的存放目录b)rpm -ivh rabbitmq-server-3.5.4-1.noarch.rpm2.修改配置cd /etc/rabbitmqcd ...
- dll注入遇到CreateRemoteThread()返回错误代码5
在进行dll注入的时候,发现触发了CreateRemoteThread()的错误并返回错误代码5,刚开始以为权限不够,用了管理员权限和加了SetPrivilege()函数提权和用NtCreateThr ...
- sshfs远程挂载
一.什么是 SSHFSSSHFS(Secure SHell FileSystem)是一个客户端,可以让我们通过 SSH 文件传输协议(SFTP)挂载远程的文件系统并且在本地机器上和远程的目录和文件进行 ...
- openssl内核升级
由于工作需要,防止安全漏洞需要对openssl升级现在整理出centos6.8和ubuntu14.4升级 centos升级openssl 1.首先去OpenSSL的网站 https://www.ope ...
- MyBatis映射配置文件详解
<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE mapperPUBLIC "-// ...
- 找不到main
用eclipse写代码的时候,写了一个简单的程序,编译的时候突然出现“错误: 在类 com.test.demo 中找不到 main 方法, 请将 main 方法定义为: public static v ...
- Gym 101775C - Traffic Light - [思维题]
题目链接:http://codeforces.com/gym/101775/problem/C 题意: 给出 $N$ 个红绿灯,又给出 $N+1$ 个距离 $S_i = S_0,S_1, \cdots ...
- IE、360浏览器select属性onchange遇到的坑
在网页头部定义js代码 <script type="text/javascript"> function gradeChange(e){ var selectId = ...
- bugfree3.0.1-修改“优先级”“严重等级”为中文
1.进入目录C:\xampp\htdocs\bugfree\protected\models 2.打开文件 Info.php