TabBar and TabView without Scaffold and with fixed Widget - flutter

Question

I Created TabBar Without Appbar and Scaffold and fixed Widget above theme.
Now when I added TabBarView nothing show in tabs, So
I created method that gets Index from TabController and should show the Tabs.But I can not see anything again:
#override
Widget build(BuildContext context) {
return Material(
color: Theme.of(context).backgroundColor,
child: ListView(children: <Widget>[
Container(
height: 320,
child: new Carousel(
boxFit: BoxFit.cover,
images: [
photoUrl != null
? NetworkImage(photoUrl)
: NetworkImage(photoUrl),
],
autoplay: true,
dotSize: 6,
indicatorBgPadding: 10,
dotColor: Theme.of(context).backgroundColor,
dotBgColor: Theme.of(context).scaffoldBackgroundColor,
animationCurve: Curves.fastOutSlowIn,
animationDuration: Duration(microseconds: 1000),
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child:
Text(name, style: Theme.of(context).textTheme.headline),
),
Padding(
padding: const EdgeInsets.fromLTRB(8, 4, 0, 6),
child:
Text(subtitle, style: Theme.of(context).textTheme.body2),
),
],
),
),
Padding(
padding: const EdgeInsets.fromLTRB(3, 8, 3, 4),
child: Divider(),
),
TabBar(
indicatorColor: Theme.of(context).primaryColor,
labelColor: Theme.of(context).buttonColor,
labelStyle: Theme.of(context).textTheme.headline,
unselectedLabelColor: Theme.of(context).splashColor,
controller: _tabController,
tabs: tabs.map((e) => Tab(text: e)).toList(),
),
_tabsContent(),
]));
}
THE METHOD _tabsContent():
_tabsContent() {
if (_tabController.index == 0) {
return MenuTab();
} else if (_tabController.index == 1) {
return AboutTab(cuisines, dayOfWeek, start, end, desc);
} else if (_tabController.index == 2) {
return ContactTab(
website,
email,
workPhone,
cellPhone,
info,
address1,
address2,
address3,
city,
country,
state,
zipCode,
latitude,
longitude,
socialId,
socialName,
url,
thumbnailsImage);
}
}
THE TABCONTROLLER:
TabController _tabController;
List tabs;
#override
void dispose() {
SystemChrome.restoreSystemUIOverlays();
SystemChrome.setEnabledSystemUIOverlays(SystemUiOverlay.values);
_tabController.dispose();
super.dispose();
}
void initState() {
super.initState();
SystemChrome.setEnabledSystemUIOverlays([]);
tabs = ['Menu', 'About', 'Contact'];
_tabController = TabController(length: tabs.length, vsync: this);
}

Answer 1

First: Add this to initState()
_tabController.addListener(_handleTabControllerTick);
Second: create method
void _handleTabControllerTick() {
setState(() {
_currentIndex = _tabController.index;
});
}
Third: change this to:
_tabsContent() {
if (_currentIndex == 0) {
return Container( child: Text("Menu Tab"));
} else if (_currentIndex == 1) {
return Container( child: Text("About Tab"));
} else if (_currentIndex == 2) {
return Container( child: Text("Contact Tab"));
}
}
Also please make sure your _tabsContent() have return the correct content.
Try below code
import 'package:flutter/material.dart';
class testing extends StatefulWidget {
#override
_testingState createState() {
return _testingState();
}
}
class _testingState extends State<testing> with SingleTickerProviderStateMixin {
TabController _tabController;
List tabs;
int _currentIndex = 0;
#override
void dispose() {
_tabController.dispose();
super.dispose();
}
void initState() {
super.initState();
tabs = ['Menu', 'About', 'Contact'];
_tabController = TabController(length: tabs.length, vsync: this);
_tabController.addListener(_handleTabControllerTick);
}
void _handleTabControllerTick() {
setState(() {
_currentIndex = _tabController.index;
});
}
_tabsContent() {
if (_currentIndex == 0) {
return Container( child: Text("Menu Tab"));
} else if (_currentIndex == 1) {
return Container( child: Text("About Tab"));
} else if (_currentIndex == 2) {
return Container( child: Text("Contact Tab"));
}
}
#override
Widget build(BuildContext context) {
return Material(
color: Theme.of(context).backgroundColor,
child: ListView(children: <Widget>[
Container( child: Text("Header")),
Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child:
Text("Name", style: Theme.of(context).textTheme.headline),
),
Padding(
padding: const EdgeInsets.fromLTRB(8, 4, 0, 6),
child:
Text("Subtitle", style: Theme.of(context).textTheme.body2),
),
],
),
),
Padding(
padding: const EdgeInsets.fromLTRB(3, 8, 3, 4),
child: Divider(),
),
TabBar(
indicatorColor: Theme.of(context).primaryColor,
labelColor: Theme.of(context).buttonColor,
labelStyle: Theme.of(context).textTheme.headline,
unselectedLabelColor: Theme.of(context).splashColor,
controller: _tabController,
tabs: tabs.map((e) => Tab(text: e)).toList(),
),
_tabsContent(),
]));
}
}