在我探索颤振框架的过程中,我遇到了一个问题,我不知道如何解决.我可以将TabBar与TabBarView结合使用作为其他小部件的子代吗?
结果证明它有效.这是相关的代码段:
new Container( decoration: new BoxDecoration(color: Theme.of(context).primaryColor), child: new TabBar( controller: _controller, tabs: [ new Tab( icon: const Icon(Icons.home), text: 'Address', ), new Tab( icon: const Icon(Icons.my_location), text: 'Location', ), ], ), ), new Container( height: 80.0, child: new TabBarView( controller: _controller, children:[ new Card( child: new ListTile( leading: const Icon(Icons.home), title: new TextField( decoration: const InputDecoration(hintText: 'Search for address...'), ), ), ), new Card( child: new ListTile( leading: const Icon(Icons.location_on), title: new Text('Latitude: 48.09342\nLongitude: 11.23403'), trailing: new IconButton(icon: const Icon(Icons.my_location), onPressed: () {}), ), ), ], ), ),
这是一个有效的例子:
import 'package:flutter/material.dart'; void main() { runApp(new MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return new MaterialApp( title: 'Flutter Demo', home: new MyHomePage(), ); } } class MyHomePage extends StatefulWidget { @override _MyHomePageState createState() => new _MyHomePageState(); } class _MyHomePageState extends Statewith SingleTickerProviderStateMixin { TabController _controller; @override void initState() { super.initState(); _controller = new TabController(length: 2, vsync: this); } @override Widget build(BuildContext context) { return new Scaffold( appBar: new AppBar( title: new Text('TestProject'), ), body: new ListView( children: [ new Card( child: new ListTile( title: const Text('Some information'), ), ), new Container( decoration: new BoxDecoration(color: Theme.of(context).primaryColor), child: new TabBar( controller: _controller, tabs: [ new Tab( icon: const Icon(Icons.home), text: 'Address', ), new Tab( icon: const Icon(Icons.my_location), text: 'Location', ), ], ), ), new Container( height: 80.0, child: new TabBarView( controller: _controller, children: [ new Card( child: new ListTile( leading: const Icon(Icons.home), title: new TextField( decoration: const InputDecoration(hintText: 'Search for address...'), ), ), ), new Card( child: new ListTile( leading: const Icon(Icons.location_on), title: new Text('Latitude: 48.09342\nLongitude: 11.23403'), trailing: new IconButton(icon: const Icon(Icons.my_location), onPressed: () {}), ), ), ], ), ), new Card( child: new ListTile( title: const Text('Some more information'), ), ), new RaisedButton( color: Theme.of(context).primaryColor, onPressed: () {}, child: const Text( 'Search for POIs', style: const TextStyle(color: Colors.white), ), ), ], ), ); } }