我想实现带有固定标题的双向滚动 View 。例如,您可以在excel工作表中找到它的方式:
有谁知道我可以使用的包装或小部件吗?
还是我必须自己实现这种逻辑?
如果是这样,您能给我一些从哪里开始的提示吗?
我发现的唯一有用的东西是:https://pub.dev/packages/bidirectional_scroll_view
但是此解决方案不支持 header 。
希望你有美好的一天;希望你今天过得很开心 !
丹尼斯
最佳答案
这是利用scrollListener
提供的BidirectionalScrollBiewPlugin
的可能解决方案:
ScrollController _horizontalController = ScrollController();
ScrollController _verticalController = ScrollController();
@override
Widget build(BuildContext context) {
return Stack(
children: <Widget>[
BidirectionalScrollViewPlugin(
child: Container(
alignment: Alignment.topLeft,
margin: EdgeInsets.only(top: 15, left: 20),
width: 1000,
height: 1000,
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Text('test asdasd asdqwdqwdqeqweqw eqweqeqweqweqwe'),
Text('test asdasd asdqwdqwdqeqweqw eqweqeqweqweqwe'),
Text('test asdasd asdqwdqwdqeqweqw eqweqeqweqweqwe'),
Text('test asdasd asdqwdqwdqeqweqw eqweqeqweqweqwe'),
],
)
),
scrollListener: directionalScrollListener,
),
Container(
height: 18,
color: Colors.white,
padding: const EdgeInsets.only(left: 10.0),
child: ListView(
controller: _horizontalController,
scrollDirection: Axis.horizontal,
children: List.generate(200, (index) {
return Container(
padding: EdgeInsets.only(left: 5, right: 5, top: 2, bottom: 2),
child: Text(index.toString()),
);
}),
),
),
Container(
width: 20,
color: Colors.white,
margin: const EdgeInsets.only(top: 16.0),
child: ListView(
controller: _verticalController,
scrollDirection: Axis.vertical,
children: List.generate(200, (index) {
return Container(
padding: EdgeInsets.only(left: 2, right: 2, top: 5, bottom: 5),
child: Text(index.toString()),
);
}),
),
),
],
);