在 Flutter 中同时进行垂直和水平滚动
Vertical and Horizontal scrolling at the same time in Flutter
我正在构建一个 flutter 应用程序,它需要以 table 格式显示数据,我是在 DataTable 小部件的帮助下完成的,但是在呈现时,列和行计数太高,所以他们离开了视野。使用列表视图,我可以水平或垂直移动。我不能同时做这两件事。我想要一个像 Microsoft Excel 移动应用程序一样可以拖拽的功能,我们可以在其中自由拖拽和移动。任何人都可以向我建议一种方法吗?
你用两个 SingleChildScrollView
和一个 Scrollbar
扭曲它并注意 ScrollOrientation
,这个关于如何实现它的例子:
PS: 对不起,DataTable 上的代码很乱,但我没有时间写格式化代码
import 'package:flutter/material.dart';
class TestPage extends StatelessWidget {
TestPage({Key? key}) : super(key: key);
final ScrollController controller = ScrollController();
final ScrollController controller2 = ScrollController();
@override
Widget build(BuildContext context) {
return Scrollbar(
controller: controller2,
isAlwaysShown: true,
child: SingleChildScrollView(
controller: controller2,
scrollDirection: Axis.horizontal,
child: SingleChildScrollView(
controller: controller,
child: DataTable(
columns: const [
DataColumn(label: Text('Test')),
DataColumn(label: Text('Test')),
DataColumn(label: Text('Test')),
DataColumn(label: Text('Test')),
DataColumn(label: Text('Test')),
],
rows: const [
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
],
),
),
),
);
}
}
我正在构建一个 flutter 应用程序,它需要以 table 格式显示数据,我是在 DataTable 小部件的帮助下完成的,但是在呈现时,列和行计数太高,所以他们离开了视野。使用列表视图,我可以水平或垂直移动。我不能同时做这两件事。我想要一个像 Microsoft Excel 移动应用程序一样可以拖拽的功能,我们可以在其中自由拖拽和移动。任何人都可以向我建议一种方法吗?
你用两个 SingleChildScrollView
和一个 Scrollbar
扭曲它并注意 ScrollOrientation
,这个关于如何实现它的例子:
PS: 对不起,DataTable 上的代码很乱,但我没有时间写格式化代码
import 'package:flutter/material.dart';
class TestPage extends StatelessWidget {
TestPage({Key? key}) : super(key: key);
final ScrollController controller = ScrollController();
final ScrollController controller2 = ScrollController();
@override
Widget build(BuildContext context) {
return Scrollbar(
controller: controller2,
isAlwaysShown: true,
child: SingleChildScrollView(
controller: controller2,
scrollDirection: Axis.horizontal,
child: SingleChildScrollView(
controller: controller,
child: DataTable(
columns: const [
DataColumn(label: Text('Test')),
DataColumn(label: Text('Test')),
DataColumn(label: Text('Test')),
DataColumn(label: Text('Test')),
DataColumn(label: Text('Test')),
],
rows: const [
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
DataRow(
cells: [
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
DataCell(
Text('tesssssssssssssssssssssssssssssssssst'),
),
],
),
],
),
),
),
);
}
}