GuidePage底部导航栏
import 'package:flutter/material.dart';
import 'News.dart';
import 'Video.dart';
import 'Chat.dart';
import 'MyId.dart'; class GuidePage extends StatefulWidget {
@override
State<StatefulWidget> createState() => GuidePageState();
} class GuidePageState extends State<GuidePage> {
final _bottomNavigationColor = Colors.red;
int _currentIndex = ;
List<Widget> list = List(); @override
void initState() {
list
..add(NewsPage())
..add(VideoPage())
..add(ChatPage())
..add(MyIdPage());
super.initState();
} @override
Widget build(BuildContext context) {
return Scaffold(
body: list[_currentIndex],
bottomNavigationBar: BottomNavigationBar(
items: [
BottomNavigationBarItem(
icon: Icon(
Icons.fiber_new,
color: _bottomNavigationColor,
),
title: Text(
'信息',
style: TextStyle(color: _bottomNavigationColor),
)),
BottomNavigationBarItem(
icon: Icon(
Icons.live_tv,
color: _bottomNavigationColor,
),
title: Text(
'视频',
style: TextStyle(color: _bottomNavigationColor),
)),
BottomNavigationBarItem(
icon: Icon(
Icons.phone_in_talk,
color: _bottomNavigationColor,
//color:Colors.lightGreen,
),
title: Text(
'聊天',
style: TextStyle(color: _bottomNavigationColor),
)),
BottomNavigationBarItem(
icon: Icon(
Icons.contact_phone,
color: _bottomNavigationColor,
),
title: Text(
'注册',
style: TextStyle(color: _bottomNavigationColor),
)),
],
currentIndex: _currentIndex,
onTap: (int index) {
setState(() {
//设置当前的索引
_currentIndex = index;
});
},
//设置显示的模式
type: BottomNavigationBarType.fixed,
),
);
}
}
import 'package:flutter/material.dart';
import 'Guide.dart'; void main() => runApp(new MyApp()); class MyApp extends StatelessWidget { @override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Generated App',
theme: new ThemeData(
primarySwatch: Colors.red,
primaryColor: const Color(0xFFf44336),//顶部标题导航背景色
accentColor: const Color(0xFFf44336),
canvasColor: const Color(0xffEEEFF2),
fontFamily: 'Roboto',
),
home: GuidePage(),
);
}
}
import 'package:flutter/material.dart';
class MyIdPage extends StatefulWidget {
@override
State<StatefulWidget> createState() => MyIdPageState();
}
class MyIdPageState extends State<MyIdPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('注册'),
),
);
}
}
GuidePage底部导航栏的更多相关文章
- TextView+Fragment实现底部导航栏
前言:项目第二版刚上线没多久,产品又对需求进行了大改动,以前用的是左滑菜单,现在又要换成底部导航栏,于是今天又苦逼加班了.花了几个小时实现了一个底部导航栏的demo,然后总结一下.写一篇博客.供自己以 ...
- Android应用底部导航栏(选项卡)实例
现在很多android的应用都采用底部导航栏的功能,这样可以使得用户在使用过程中随意切换不同的页面,现在我采用TabHost组件来自定义一个底部的导航栏的功能. 我们先看下该demo实例的框架图: 其 ...
- Android 修改底部导航栏navigationbar的颜色
Android 修改底部导航栏navigationbar的颜色 getWindow().setNavigationBarColor(Color.BLUE); //写法一 getWindow().set ...
- Android底部导航栏——FrameLayout + RadioGroup
原创文章,转载请注明出处http://www.cnblogs.com/baipengzhan/p/6285881.html Android底部导航栏有多种实现方式,本文详细介绍FrameLayout ...
- Android底部导航栏创建——ViewPager + RadioGroup
原创文章,引用请注明出处:http://www.cnblogs.com/baipengzhan/p/6270201.html Android底部导航栏有多种实现方式,本文详解其中的ViewPager ...
- 二、Fragment+RadioButton实现底部导航栏
在App中经常看到这样的tab底部导航栏 那么这种效果是如何实现,实现的方式有很多种,最常见的就是使用Fragment+RadioButton去实现.下面我们来写一个例子 首先我们先在activi ...
- Android学习笔记- Fragment实例 底部导航栏的实现
1.要实现的效果图以及工程目录结构: 先看看效果图吧: 接着看看我们的工程的目录结构: 2.实现流程: Step 1:写下底部选项的一些资源文件 我们从图上可以看到,我们底部的每一项点击的时候都有不同 ...
- [置顶]
xamarin android Fragment实现底部导航栏
前段时间写了篇关于Fragment的文章,介绍了基础的概念,用静态和动态的方式加载Fragment Xamarin Android Fragment的两种加载方式.下面的这个例子介绍xamarin ...
- mui底部导航栏切换分页
使用Hbuilder的mui框架开发移动端非常便利.高效: 底部导航栏切换功能也是移动APP开发中必须实现的: 引入mui文件.下面会用到jquery,同时引进 <link href=" ...
随机推荐
- A - 不要62
杭州人称那些傻乎乎粘嗒嗒的人为62(音:laoer). 杭州交通管理局经常会扩充一些的士车牌照,新近出来一个好消息,以后上牌照,不再含有不吉利的数字了,这样一来,就可以消除个别的士司机和乘客的心理障碍 ...
- linux应用以及常用命令
各目录作用"/" :Linux文件系统的入口.也是最高一级的目录."/bin":基本系统所需要的命令,功能和"/usr/bin"类似,这个目 ...
- 让height: 100%生效
html: <body> <div class="box"></div> </body> css: .box{ position: ...
- windows安装tomcat
1.打开官网http://tomcat.apache.org/ 2.在左侧的导航栏Download下方选择最新的Tomcat 9,点击页面下方的“ 64-bit Windows zip (pgp, m ...
- PHP(Dom操作的一些基础)
重点!! //DOM操作: // 核心思想:找到元素 操作元素// js找元素 会返回元素对象:// document.getElementById("dd");唯一确定// 返回 ...
- python全栈开发 * 35 知识点汇总 * 180720
35 socket 一些常用方法 验证客户端信息 添加随机字符串 socketserver模块 一.socket模块中一些常用方法1.send和sendall的区别2.conn.getpeername ...
- 谁考了第k名
题目描述: 在一次考试中,每个学生的成绩都不相同,现知道了每个学生的学号和成绩,求考第k名学生的学号和成绩. 输入: 第一行有两个整数,分别是学生的人数n(1≤n≤100),和求第k名学生的k(1≤k ...
- TXT电子书格式怎样转换成epub格式
怎样将TXT电子书格式转换成epub格式呢?因为很多时候不同的阅读器所支持的电子书格式是有所不同,所以电子书格式转换的问题,在生活中也是会经常出现的问题.如果我们需要将TXT电子书格式转换成epub格 ...
- Linux 命令 which whereis locate find
which: 查询某指令的完整路径 $ which [-a] command -a: 将所有在PATH目录中可以找到的指令均列出. 注意:只搜索PATH下的路径. whereis: 只搜索几个特定目录 ...
- maven跳过单元测试-maven.test.skip和skipTests的区别
1. 介绍 -DskipTests,不执行测试用例,但编译测试用例类生成相应的class文件至target/test-classes下. -Dmaven.test.skip=true,不执行测试用例, ...