import 'package:flutter/material.dart';
class TabBarDemo extends StatefulWidget {
const TabBarDemo({
Key? key}) : super(key: key);
@override
State<TabBarDemo> createState() => _TabBarDemoState();
}
class _TabBarDemoState extends State<TabBarDemo>
with SingleTickerProviderStateMixin {
TabController? myTabBarController;
List<Widget> tabs = [];
createTabs() {
tabs.add(const Tab(text: "新闻", icon: Icon(Icons.ice_skating)));
tabs.add(const Tab(text: "首页", icon: Icon(Icons.home)));
tabs.add(const Tab(text: "邮箱", icon: Icon(Icons.mail)));
tabs.add(const Tab(text: "新闻1", icon: Icon(Icons.ice_skating)));
tabs.add(const Tab(text: "首页1", icon: Icon(Icons.home)));
tabs.add(const Tab(text: "邮箱1", icon: Icon(Icons.mail)));
tabs.add(const Tab(text: "新闻2", icon: Icon(Icons.ice_skating)));
tabs.add(const Tab(text: "首页2", icon: Icon(Icons.home)));
tabs.add(const Tab(text: "邮箱2", icon: Icon(Icons.mail)));
return tabs;
}
createTabBar() {
return TabBar(
tabs: tabs,
controller: myTabBarController,
isScrollable: true,
indicatorColor: const Color(0xffff0000),
indicatorSize: TabBarIndicatorSize.tab,
labelColor: Colors.deepOrange,
labelStyle: const TextStyle(
fontSize: 14, color: Colors.lime, fontWeight: FontWeight.bold),
unselectedLabelColor: Colors.lightGreen,
unselectedLabelStyle:
const TextStyle( fontWeight: FontWeight.normal),
);
}
@override
void initState() {
super.initState();
createTabs();
myTabBarController =
TabController(initialIndex: 0, length: tabs.length, vsync: this);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: createTabBar(),
),
body: TabBarView(
controller: myTabBarController,
children: const [
Text("1"),
Text("2"),
Text("3"),
Text("1"),
Text("2"),
Text("3"),
Text("1"),
Text("2"),
Text("3")
],
),
);
}
}
import 'package:flutter/material.dart';
class Tab
阅读背景：
自定义appbarTitle 使用tabBar+ tabBarView实现类似安卓tabHost viewpager
来源：互联网
分享到：
