文档章节

Flutter 使用Tabbar不要Title

o
 osc_g8254g7s
发布于 2019/08/19 18:56
字数 222
阅读 0
收藏 0

精选30+云产品,助力企业轻松上云!>>>

Demo 1

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        primaryColor: Colors.blue,
        accentColor: Colors.pink,
      ),
      home: HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  final tabs = ["One", "Two", "Three"];

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: tabs.length,
      child: Scaffold(
        appBar: PreferredSize(
          preferredSize: Size.fromHeight(kToolbarHeight),
          child: Container(
            color: Theme.of(context).primaryColor,
            child: SafeArea(
              child: Column(
                children: <Widget>[
                  Expanded(child: SizedBox()),
                  getTabBar(),
                ],
              ),
            ),
          ),
        ),
        body: getTabBarPages(),
      ),
    );
  }

  Widget getTabBar() {
    return TabBar(
      indicatorColor: Theme.of(context).accentColor,
      tabs: tabs.map((t) {
        return Tab(
          child: Text(t),
        );
      }).toList(),
    );
  }

  Widget getTabBarPages() {
    return TabBarView(
      children: tabs.map((t) {
        return Center(
          child: Text(t),
        );
      }).toList(),
    );
  }
}

Demo 2

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        primaryColor: Colors.blue,
        accentColor: Colors.pink,
      ),
      home: HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  final tabs = ["One", "Two", "Three"];

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: tabs.length,
      child: Scaffold(
        appBar: AppBar(
          flexibleSpace: SafeArea(
            child: Column(
              children: <Widget>[
                Expanded(child: SizedBox()),
                getTabBar(),
              ],
            ),
          ),
        ),
        body: getTabBarPages(),
      ),
    );
  }

  Widget getTabBar() {
    return TabBar(
      indicatorColor: Theme.of(context).accentColor,
      tabs: tabs.map((t) {
        return Tab(
          child: Text(t),
        );
      }).toList(),
    );
  }

  Widget getTabBarPages() {
    return TabBarView(
      children: tabs.map((t) {
        return Center(
          child: Text(t),
        );
      }).toList(),
    );
  }
}
o
粉丝 0
博文 500
码字总数 0
作品 0
私信 提问
加载中
请先登录后再评论。
Flutter AppBar 自定义顶部导航按钮 图标、颜色 以及 TabBar 定义顶部 Tab 切换

Flutter AppBar 自定义顶部按钮图 标、颜色 属性 描述 leading 在标题前面显示的一个控件,在首页通常显示应用 的 logo;在其他界面通常显示为返回按钮 title 标题,通常显示为当前界面的标题...

osc_bg494qeb
2019/07/24
8
0
Flutter 滑动列表隐藏头部 ListView+TabBar悬浮的实现

先来张效果图 我的需求是,列表滚动到顶部,Tabbar停留,置顶. 实际写起来,绕了不少弯路. 最开始我使用的: CustomScrollView 代码如下: import 'package:flutter/material.dart'; const url = '......

大灰狼的小绵羊哥哥
05/10
0
0
六、Flutter自定义Tabbar

目录 一、效果展示 二、底部Tabbar 三、顶部Tabbar 一、效果展示 底部Tabbar切换和顶部Tabbar切换在工作中使用频率都比较高,Flutter很人性化,这些组件都提供好了,我们只需要了解一下如何使...

星星编程
2019/07/14
0
0
Flutter 首页必用组件NestedScrollView

老孟导读:昨天Flutter 1.17版本重磅发布,新的版本主要是优化性能、修复bug,有人觉得此版本毫无亮点,但也从另一方面体现了Flutter目前针对移动端已经较为完善,想了解具体内容,文末有链接...

老孟Flutter
05/08
33
0
七、优化Tabbar

目录 一、Tabbar问题 二、底部Tabbar 三、顶部Tabbar 最近一直忙于基于FreeSwitch的Sip融合通信了,没有及时更新文章。技术的更新太快了,每天都会出现各种框架和技术技巧,是学不完的,也只...

星星编程
2019/07/18
0
0

没有更多内容

加载失败,请刷新页面

加载更多

为什么从HBase的0.96版本开始,舍弃了-ROOT-文件?

HBase结构的读写流程 (1). HBase0.96版本之前: (2). HBase0.96开始: a. 当客户端获取到.meta文件的位置之后,会缓存.meta.文件的位置 b. 客户端还会缓存HRegion的位置 -ROOT-存在的意义: ...

其乐m
25分钟前
18
0
volatile关键字对 - What is the volatile keyword useful for

问题: At work today, I came across the volatile keyword in Java. 今天的工作中,我遇到了Java中的volatile关键字。 Not being very familiar with it, I found this explanation: 不太熟......

技术盛宴
30分钟前
25
0
golang 封装 mysql 和 redis 连接

Mysql封装 package dbimport ("fmt"_ "github.com/go-sql-driver/mysql""github.com/jmoiron/sqlx")var DB *sqlx.DBfunc init(){database, err := sqlx.Op......

开源中国最牛的人
31分钟前
16
0
pdfbox 读取文件报错 java.io.IOException: Page tree root must be a dictionary

pdfbox java.io.IOException: Page tree root must be a dictionary 示例代码 public static void main(String[] args) { try (InputStream sampleInputs = new ClassPathResource("s......

lemos
39分钟前
28
0
整理 Linux下列出目录内容的命令

在 Linux 中,有非常多的命令可以让我们用来执行各种各样的任务。当我们想要像使用文件浏览器一样列出一个目录下的内容时,大家第一时间想到的是 ls 命令。但只有 ls 命令能实现这个目的吗?...

良许Linux
40分钟前
17
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部