这是我的代码。更改标签栏视图内容不会更改内容。请告知我是新来的我尝试将选项卡视图的子级更改为文本,但仍然没有效果请告诉我代码的问题,stackoverflow告诉我的问题主要是代码,所以我要添加乱码
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Material App',
home: Scaffold(
backgroundColor: Colors.white,
body: SafeArea(
child: Column(
children: <Widget>[
Container(
height: 60,
width: 500,
color: Colors.teal,
margin: EdgeInsets.fromLTRB(0, 0, 0, 0),
padding: EdgeInsets.fromLTRB(10, 0, 0, 0),
child: Text(
'Choose Your Topic',
textAlign: TextAlign.left,
style: TextStyle(
fontFamily: 'BalooBhaina2-Regular',
fontWeight: FontWeight.normal,
fontSize: 35,
letterSpacing: 0.5,
wordSpacing: 2.0,
shadows: [
Shadow(
blurRadius: 50.0,
color: Colors.black,
offset: Offset(5.0, 5.0),
),
],
),
),
),
Container(
height: 50,
width: 800,
margin: EdgeInsets.fromLTRB(0, 0, 0, 5),
child: DefaultTabController(
length: 4,
child: Scaffold(
appBar: AppBar(
bottom: TabBar(tabs: [
Tab(icon: Icon(Icons.touch_app)),
Tab(icon: Icon(Icons.directions_bike)),
Tab(icon: Icon(Icons.movie)),
Tab(icon: Icon(Icons.music_video)),
]),
),
body: TabBarView(
children: [
Icon(Icons.touch_app),
Icon(Icons.directions_bike),
Icon(Icons.movie),
Icon(Icons.music_video),
],
),
),
),
),
],
),
),
),
);
}
}
Scaffold
和Appbar
步骤2:您可以用TabBar
包裹TabBarView
和Container
代码段
Container(
color: Colors.blue,
height: 50,
width: 800,
margin: EdgeInsets.fromLTRB(0, 0, 0, 5),
child: TabBar(controller: _tabController, tabs: [
Tab(icon: Icon(Icons.touch_app)),
Tab(icon: Icon(Icons.directions_bike)),
Tab(icon: Icon(Icons.movie)),
Tab(icon: Icon(Icons.music_video)),
]),
),
Expanded(
child: Container(
//height: 50,
//width: 800,
margin: EdgeInsets.fromLTRB(0, 0, 0, 5),
child: TabBarView(
controller: _tabController,
children: [
Icon(Icons.touch_app),
工作演示完整代码
import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatefulWidget { @override _MyAppState createState() => _MyAppState(); } class _MyAppState extends State<MyApp> with SingleTickerProviderStateMixin { TabController _tabController; @override void initState() { super.initState(); _tabController = TabController(vsync: this, length: 4); } @override Widget build(BuildContext context) { return MaterialApp( title: 'Material App', home: Scaffold( backgroundColor: Colors.white, body: SafeArea( child: Column( children: <Widget>[ Container( height: 60, width: 500, color: Colors.teal, margin: EdgeInsets.fromLTRB(0, 0, 0, 0), padding: EdgeInsets.fromLTRB(10, 0, 0, 0), child: Text( 'Choose Your Topic', textAlign: TextAlign.left, style: TextStyle( fontFamily: 'BalooBhaina2-Regular', fontWeight: FontWeight.normal, fontSize: 35, letterSpacing: 0.5, wordSpacing: 2.0, shadows: [ Shadow( blurRadius: 50.0, color: Colors.black, offset: Offset(5.0, 5.0), ), ], ), ), ), Container( color: Colors.blue, height: 50, width: 800, margin: EdgeInsets.fromLTRB(0, 0, 0, 5), child: TabBar(controller: _tabController, tabs: [ Tab(icon: Icon(Icons.touch_app)), Tab(icon: Icon(Icons.directions_bike)), Tab(icon: Icon(Icons.movie)), Tab(icon: Icon(Icons.music_video)), ]), ), Expanded( child: Container( //height: 50, //width: 800, margin: EdgeInsets.fromLTRB(0, 0, 0, 5), child: TabBarView( controller: _tabController, children: [ Icon(Icons.touch_app), Icon(Icons.directions_bike), Icon(Icons.movie), Icon(Icons.music_video), ], ), ), ), ], ), ), ), ); } }