我想做一个可滚动的制表视图。标签栏视图列表的长度不是固定的。我想在滚动列表项时更改选择标签,标签也应该在点击时工作。代码给出了异常消息:
- 发生异常。_Assert错误('package:flutter/src/material/tab_controller. dart ':Assert失败:第181行位置12:'值〉= 0 &&(值〈长度||长度== 0)":不正确)**
当scroll到达列表的最后一个并ontap时,选项卡不会滚动到其列表。
下面是我的代码:
class _HomePageState extends State<HomePage> with SingleTickerProviderStateMixin {
late TabController _controller;
late ScrollController _scrollController;
List<Map<String, List<String>>> _tablist = \[
{ "tab1": \[ "Tab11", "tab12", "tab13", "tab14", \]
},
{
"tab2": \[ "Tab21", "tab22", "tab23","tab24", \]
},
{ "tab3": \[ "Tab31", "tab32", \]
},
{
"tab4": \[ "Tab41", "tab42", "tab43","tab44", \]
},
\];
@override
void initState() {
super.initState();
_controller = TabController(vsync: this, length: _tablist.length);
_scrollController = ScrollController();
_scrollController.addListener(() {
int index = (_scrollController.offset /
(_scrollController.position.maxScrollExtent / _tablist.length))
.floor();
_controller.animateTo(index);
});
}
@override
void dispose() {
_controller.dispose();
_scrollController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Food Menu"),
bottom: TabBar(
controller: _controller,
tabs: _tablist.map((item) => Tab(text: item.keys.first)).toList(),
),
),
body: ListView.builder(
controller: _scrollController,
itemCount: _tablist.length,
itemBuilder: (context, index) {
return Column(
children: <Widget>\[
Container(
color: _controller.index == index ? Colors.grey\[200\] : null,
padding: EdgeInsets.all(16),
child: Text(
_tablist\[index\].keys.first,
style: TextStyle(
fontSize: 24,
fontWeight: FontWeight.bold,
),
),
),
..._tablist\[index\].values.first.map((item) => ListTile(title: Text(item))).toList()
\],
);
},
),
);
}
}
我想把它做成这样:https://drive.google.com/file/d/1ZCcAvxnnzNfJiKyQ0ZQG6LUsDxaXVqeD/view?usp=share_link
1条答案
按热度按时间col17t5w1#
存在名为“isScrollable:“在选项卡栏中