flutter TabBar+PageView联动

import ‘package:flutter/material.dart’;

void main() {

runApp(new MyApp());

if (Platform.isAndroid) {

// 以下两行 设置android状态栏为透明的沉浸。写在组件渲染之后，是为了在渲染后进行set赋值，覆盖状态栏，写在渲染之前MaterialApp组件会覆盖掉这个值。

SystemUiOverlayStyle systemUiOverlayStyle =

SystemUiOverlayStyle(statusBarColor: Colors.transparent);

SystemChrome.setSystemUIOverlayStyle(systemUiOverlayStyle);

}

}

class MyApp extends StatelessWidget {

// This widget is the root of your application.

@override

Widget build(BuildContext context) {

return MaterialApp(

title: ‘Flutter Demo’,

theme: ThemeData(

primaryColorBrightness: Brightness.dark,

platform: TargetPlatform.iOS),

home: MyHomePage(),

);

}

}

class MyHomePage extends StatefulWidget {

@override

State createState() => HomeState();

}

class TabTitle {

String title;

int id;

TabTitle(this.title, this.id);

}

class HomeState extends State with SingleTickerProviderStateMixin {

TabController mTabController;

PageController mPageController = PageController(initialPage: 0);

List tabList;

var currentPage = 0;

var isPageCanChanged = true;

@override

void initState() {

super.initState();

initTabData();

mTabController = TabController(

length: tabList.length,

vsync: this,

);

mTabController.addListener(() {//TabBar的监听

if (mTabController.indexIsChanging) {//判断TabBar是否切换

print(mTabController.index);

onPageChange(mTabController.index, p: mPageController);

}

});

}

initTabData() {

tabList = [

new TabTitle(‘推荐’, 10),

new TabTitle(‘热点’, 0),

new TabTitle(‘社会’, 1),

new TabTitle(‘娱乐’, 2),

new TabTitle(‘体育’, 3),

new TabTitle(‘美文’, 4),

new TabTitle(‘科技’, 5),

new TabTitle(‘财经’, 6),

new TabTitle(‘时尚’, 7)

];

}

onPageChange(int index, {PageController p, TabController t}) async {

if (p != null) {//判断是哪一个切换

isPageCanChanged = false;

await mPageController.animateToPage(index, duration: Duration(milliseconds: 500), curve: Curves.ease);//等待pageview切换完毕,再释放pageivew监听

isPageCanChanged = true;

} else {

mTabController.animateTo(index);//切换Tabbar

}

}

@override

void dispose() {

super.dispose();

mTabController.dispose();

}

结尾

我还总结出了互联网公司Android程序员面试涉及到的绝大部分面试题及答案，并整理做成了文档，以及系统的进阶学习视频资料分享给大家。
（包括Java在Android开发中应用、APP框架知识体系、高级UI、全方位性能调优，NDK开发，音视频技术，人工智能技术，跨平台技术等技术资料），希望能帮助到你面试前的复习，且找到一个好的工作，也节省大家在网上搜索资料的时间来学习。

以及系统的进阶学习视频资料分享给大家。
（包括Java在Android开发中应用、APP框架知识体系、高级UI、全方位性能调优，NDK开发，音视频技术，人工智能技术，跨平台技术等技术资料），希望能帮助到你面试前的复习，且找到一个好的工作，也节省大家在网上搜索资料的时间来学习。**

[外链图片转存中…(img-oW77yPlU-1720087036733)]