#flutter #tabbar
#flutter #панель вкладок
Вопрос:
Ответ №1:
Если под значком вы подразумеваете виджет значков, их можно добавить непосредственно в Tab
виджет, используя его icon
свойство.
Tab(icon: Icon(Icons.verified), text: 'Tab 1', ),
Полный пример виджета:
class HomePage extends StatelessWidget {
HomePage({Key key, this.title}) : super(key: key);
final String title;
@override
Widget build(BuildContext context) {
return DefaultTabController(
length: 2,
child: Scaffold(
appBar: AppBar(
title: Text(title),
bottom: TabBar(
tabs: <Tab>[
Tab(
icon: Icon(Icons.verified),
text: 'Tab 1',
),
Tab(
icon: Icon(Icons.new_releases),
text: 'Tab 2',
),
],
),
),
backgroundColor: Colors.black,
body: TabBarView(children: <ExampleTab>[
ExampleTab(),
ExampleTab()
]),
));
}
}
Если вы имеете в виду изображение без текста, как изображение, которое вы связали, вы можете использовать child
свойство для добавления любого виджета, который вам нравится, который может быть Image
виджетом, например.
Tab(child: Image.network("https://placeimg.com/50/50")),
class HomePage extends StatelessWidget {
HomePage({Key key, this.title}) : super(key: key);
final String title;
@override
Widget build(BuildContext context) {
return DefaultTabController(
length: 2,
child: Scaffold(
appBar: AppBar(
title: Text(title),
bottom: TabBar(
tabs: <Tab>[
Tab(
child: Image.network("https://placeimg.com/50/50"),
),
Tab(
icon: Icon(Icons.new_releases),
text: 'Tab 2',
),
],
),
),
backgroundColor: Colors.black,
body: TabBarView(children: <ExampleTab>[
ExampleTab(),
ExampleTab()
]),
));
}
}
Вы можете добавить рамку, закругленные углы или другие стили, заключающие Image
в Container
.