appbar导航
import 'package:flutter/material.dart';
import 'dart:ui'; void main()=>runApp(MyApp()); class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: HomePage(),
);
}
} class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
} class _HomePageState extends State<HomePage> with SingleTickerProviderStateMixin{
TabController _controller;
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
void initState() {
super.initState();
_controller = TabController(length: 3, vsync: this);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Run for better future'),
bottom:TabBar(
tabs: <Widget>[
Tab(icon: Icon(Icons.accessibility),),
Tab(icon: Icon(Icons.description),),
Tab(icon: Icon(Icons.accessibility_new),),
],
controller: _controller,
),
),
body: TabBarView(
controller: _controller,
children: <Widget>[
Center(
child: Text(
'Realize your value with your life',
style: TextStyle(
color: Colors.green,
fontWeight: FontWeight.bold,
fontSize: 26,
),
),
),
Center(
child: Text(
'Play hard work hard',
style: TextStyle(
color: Colors.green,
fontWeight: FontWeight.bold,
fontSize: 26,
),
),
),
Center(
child: Text(
'Magic of everthing is hope',
style: TextStyle(
color: Colors.green,
fontWeight: FontWeight.bold,
fontSize: 26,
),
),
),
],
),
);
}
}
appbar导航的更多相关文章
- Flutter布局--appbar导航栏和状态栏
MaterialApp 先看下上图的具体用法:1. title:标题2. actions:表示右侧的按钮的动作3. leading:表示左侧的按钮的动作4. flexibleSpace:5. back ...
- Flutter沉浸式状态栏/AppBar导航栏/仿咸鱼底部凸起导航
Flutter中如何实现沉浸式透明Statusbar状态栏效果? 如下图:状态栏是指android手机顶部显示手机状态信息的位置.android 自4.4开始新加入透明状态栏功能,状态栏可以自定义颜色 ...
- 【Flutter】容器类组件之Scaffold、TabBar、底部导航
前言 一个完整的路由页可能会包含导航栏.抽屉菜单(Drawer)以及底部Tab导航菜单等.Flutter Material组件库提供了一些现成的组件来减少开发任务.Scaffold是一个路由页的骨架, ...
- dart实例
import 'package:flutter/material.dart'; void main() => runApp(new MyApp()); class MyApp extends S ...
- 07-容器类Widget
容器类Widget 容器类Widget一般只是包装其子Widget,对其添加一些修饰(补白或背景色等).变换(旋转或剪裁等).或限制(大小等) Padding Padding可以给其子节点添加补白(填 ...
- Flutter 简介(事件、路由、异步请求)
1. 前言 Flutter是一个由谷歌开发的开源移动应用软件开发工具包,用于为Android和iOS开发应用,同时也将是Google Fuchsia下开发应用的主要工具.其官方编程语言为Dart. 同 ...
- 背水一战 Windows 10 (40) - 控件(导航类): AppBar, CommandBar
[源码下载] 背水一战 Windows 10 (40) - 控件(导航类): AppBar, CommandBar 作者:webabcd 介绍背水一战 Windows 10 之 控件(导航类) App ...
- 【Flutter学习】基本组件之AppBar顶部导航栏
一,概述 AppBar 显示在app的顶部.AppBar包含5大部分,如下图: 二,构造函数及参数含义 构造函数 AppBar({ Key key, this.leading, //在标题前面显示的一 ...
- Flutter AppBar 自定义顶部导航按钮 图标、颜色 以及 TabBar 定义顶部 Tab 切换
Flutter AppBar 自定义顶部按钮图 标.颜色 属性 描述 leading 在标题前面显示的一个控件,在首页通常显示应用 的 logo;在其他界面通常显示为返回按钮 title 标题,通常显 ...
随机推荐
- javascript如何操作数组
说明 如需求:后台返回一个用户列表数组,该数组可能为空,最多只可能会有10个用户, 页面中A,B两处展示用户列表,B处不管如何都会展示返回的所有用户,A处需要展示10个用户,不足10个展示默认用户, ...
- php服务器代理解决浏览器跨越问题
详见代码 <?php $url = $_SERVER["QUERY_STRING"]; switch ($_SERVER['REQUEST_METHOD']) { case ...
- 性能测试 Apache参数配置与性能调优
Apache性能调优 by:授客 QQ:1033553122 环境: Apache 2.4 1.选择合适的MPM(Multi -Processing Modules, 多处理模块) Unix/Linu ...
- JavaScript大杂烩4 - 理解JavaScript对象的继承机制
JavaScript是单根的完全面向对象的语言 JavaScript是单根的面向对象语言,它只有单一的根Object,所有的其他对象都是直接或者间接的从Object对象继承.而在JavaScript的 ...
- Yarn 安装 on centos7
本文演示如何在CentOS7上安装Yarn.注意这个Yarn是Js包管理器,不是Hadoop的资源调度器. 1 准备工作 1.1 浏览器访问安装包下载地址: https://github.com/ya ...
- Wim镜像编辑
1.挂载install.wim文件为本地的一个文件夹 dism /mount-wim /wimfile:D:\install.wim /index:1 /mountdir:D:\Win 注:1> ...
- Fedora 29 使用 SCL (Software Collections)
在社区中SCL 由Centos 项目进行维护,所以我们使用CentOS 7 SCL源.CentOS SCL中提供了devtoolset-7-gcc-c++,版本正好为 gcc version 7.3. ...
- rsync续传大目录一例
场景 要将大约60T的文件从一台服务器上搬到另外一台上.两边分区还不一样大,一边是一个整的60T大分区,另一边是15T一个的小分区. 解决思路 类比茶壶倒水,一个分区一个分区的填,填满一个再填第二个. ...
- Hadoop2.7.6_08_Federation联邦机制
前言: 本文章是在 Hadoop2.7.6_07_HA高可用 的基础上完成的,所以不清楚的可参见这篇文章. 1. Hadoop的federation机制 文件的元数据是放在namenode上的,只 ...
- windows下更改Mac地址
方法一.在桌面上的“网上邻居”图标上单击右键,选择“属性”,在弹出的“网络连接”的对话框中,在“本地连接”图标上单击右键,选择“属性”,会弹出一个“本地连接属性”的对话框,单击“配置”按钮,选择“高级 ...