Flutter自定义底部导航栏的方法
作者:兰叶书 发布时间:2022-01-10 15:48:33
标签:Flutter,导航栏
本文实例为大家分享了Flutter自定义底部导航栏的具体代码,供大家参考,具体内容如下
文件结构:
main.dart
import 'package:flutter/material.dart';
import 'pages/tabs.dart';
?
void main() => runApp(new MyApp());
?
class MyApp extends StatelessWidget {
? @override
? Widget build(BuildContext context) {
? ? return MaterialApp(
? ? ? home: Tabs(),
? ? );
? }
}
tabs.dart
import 'package:flutter/material.dart';
import 'tabs/home.dart';
import 'tabs/category.dart';
import 'tabs/user.dart';
class Tabs extends StatefulWidget {
? Tabs({Key key}) : super(key: key);
? @override
? _TabsState createState() => _TabsState();
}
?
class _TabsState extends State<Tabs> {
? int _currentIndex = 0;
?
? List _pageList=[
? ? HomePage(),
? ? CategoryPage(),
? ? UserPage(),
? ];
?
?
? @override
? Widget build(BuildContext context) {
? ? return Scaffold(
? ? ? appBar: AppBar(
? ? ? ? title: Text('自定义底部导航'),
? ? ? ),
? ? ? body: this._pageList[this._currentIndex],
? ? ? bottomNavigationBar: BottomNavigationBar(
? ? ? ? currentIndex: this._currentIndex,
? ? ? ? onTap: (int index) {
? ? ? ? ? setState(() {
? ? ? ? ? ? this._currentIndex = index;
? ? ? ? ? });
? ? ? ? },
? ? ? ? items: [
? ? ? ? ? BottomNavigationBarItem(
? ? ? ? ? ? icon: Icon(Icons.home),
? ? ? ? ? ? title: Text('首页'),
? ? ? ? ? ),
? ? ? ? ? BottomNavigationBarItem(
? ? ? ? ? ? icon: Icon(Icons.category),
? ? ? ? ? ? title: Text('分类'),
? ? ? ? ? ),
? ? ? ? ? BottomNavigationBarItem(
? ? ? ? ? ? icon: Icon(Icons.supervised_user_circle),
? ? ? ? ? ? title: Text('会员'),
? ? ? ? ? ),
? ? ? ? ],
? ? ? ),
? ? );
? }
}
home.dart
import 'package:flutter/material.dart';
?
class HomePage extends StatefulWidget {
? HomePage({Key key}) : super(key: key);
?
? @override
? _HomePageState createState() => _HomePageState();
}
?
class _HomePageState extends State<HomePage> {
? @override
? Widget build(BuildContext context) {
? ? return Text('首页');
? }
}
category.dart
import 'package:flutter/material.dart';
?
class CategoryPage extends StatefulWidget {
? CategoryPage({Key key}) : super(key: key);
?
? @override
? _CategoryPageState createState() => _CategoryPageState();
}
?
class _CategoryPageState extends State<CategoryPage> {
? @override
? Widget build(BuildContext context) {
? ? return Text('分类');
? }
}
user.dart
import 'package:flutter/material.dart';
?
class UserPage extends StatefulWidget {
? UserPage({Key key}) : super(key: key);
?
? @override
? _UserPageState createState() => _UserPageState();
}
?
class _UserPageState extends State<UserPage> {
? @override
? Widget build(BuildContext context) {
? ? return Text('会员');
? }
}
效果展示:
来源:https://blog.csdn.net/u013227399/article/details/103787189
0
投稿
猜你喜欢
- 1. 什么是对象池对象池,顾名思义就是一定数量的已经创建好的对象(Object)的集合。当需要创建对象时,先在池子中获取,如果池子中没有符合
- HandlerThread 顾名思义就是一种可以使用 Handler 的 Thread。日常开发中我们经常会通过创建一个 Thread 去执
- 主要从以下十几个方面对Hibernate做总结,包括Hibernate的检索方式,Hibernate中对象的状态,Hibernate的3种检
- 前言作为一个新手,最近在学习C#,自己折腾弄了个简单的小说爬虫,实现了把小说内容爬下来写入txt,还只能爬指定网站。第一次搞爬虫,涉及到了网
- 线程池合理设置最大线程数和核心线程数工作中有这样一个场景,需要处理千万级别的数据的一个算法,大部分是增删查的操作。这个时候就需要使用多线程去
- 在开发Android应用程序中,经常会自定义View来实现各种各样炫酷的效果,在实现这吊炸天效果的同时,我们往往会定义很多attr属性,这样
- 本文实例讲述了C#针对xml文件转化Dictionary的方法。分享给大家供大家参考。具体实现方法如下:下面是xml文件:<?xml
- Spring Boot1.为什么要使用 Spring Boot因为Spring, SpringMVC 需要使用的大量的配置文件 (xml文件
- 1、mapper.xml文件中的sql语句不提示1.1 首先,alt+enter,出现如下窗口随后的窗口选择这样在如下窗口中会增加一个upd
- 本文实例为大家分享了C#实现简单的计算器功能的具体代码,供大家参考,具体内容如下环境:VS2010及以上版本1、建立个Window窗体应用2
- 在android开发中,当不满足触发条件就按返回键的时候,就要对此进行检测。尤其是当前Activity需要往前一个Activity传送消息时
- 这其实是去年校招时我遇到的一道阿里巴巴的笔试题(承认有点久远了-。-),嗯,如果我没记错的话,当时是作为Java方向的一道选做大题。当然题意
- IISExpress 配置允许外部访问详细介绍1.找到IISExpress的配置文件,位于 <文档>/IISExpr
- 本文设计一个简单的班级管理系统,满足如下要求:1、设计学生类Student,包含学号(String型)、姓名(String型)、
- 本文实例为大家分享了Android实现房贷计算器的具体代码,供大家参考,具体内容如下fangdai(activity)package com
- 混淆器通过删除从未用过的代码和使用晦涩名字重命名类、字段和方法,对代码进行压缩,优化和混淆。结果是一个比較小的.apk文件,该文件比較难进行
- 这篇讲解一下rocketMq的事务消息的原理在发送事务消息的时候,会加一个标识,表示这个消息是事务消息。broker接收到消息后,在我们之前
- class ftp{ private string host = null; &n
- 本文主要给大家分享如何在全局上去监听 click 点击事件,并做些通用处理或是拦截。使用场景可能就是具体的全局防快速重复点击,或是通用打点分
- AudioSource 组件参考属性属性说明Clip音频资源Volume音量大小Mute是否静音Loop是否循环Play on load加载