flutter - Flutter 中的可拖动滚动条到 DataTable 中
问题描述
我有一个带有 SingleChildScrollView 的 DataTable,它工作正常,我可以用鼠标滚动,但我也想要一个可拖动的滚动条,有人知道怎么做吗?
这是我的 DateTable 与 SingleChildScrollView 代码:
return SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: SingleChildScrollView(
child: DataTable(
dataTextStyle:
TextStyle(color: Colors.black, fontStyle: FontStyle.italic),
columns: [
DataColumn(numeric: true, label: Text('Codigo')),
DataColumn(label: Text('Nombre')),
DataColumn(label: Text('Direccion')),
DataColumn(label: Text('Telefono')),
DataColumn(label: Text('Acciones')),
],
rows: provider.sede.data
.map((data) => DataRow(cells: [
DataCell(Text(data.codigo.toString())),
DataCell(
Text(data.nombre),
),
DataCell(Text(data.direccion)),
DataCell(Text(data.telefono)),
DataCell(Container(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
IconButton(
icon: Icon(Icons.edit),
iconSize: 20,
color: Colors.green,
splashRadius: 20,
tooltip: 'Editar',
onPressed: () {
Navigator.pushNamed(context, '/crearSedes',
arguments: {
'direccion': data.direccion,
'telefono': data.telefono,
'nombre': data.nombre,
});
},
),
IconButton(
icon: Icon(Icons.delete),
iconSize: 20,
color: Colors.red,
splashRadius: 20,
tooltip: 'Eliminar',
onPressed: () {
showAlertDialog(BuildContext context) {
Widget cancelButton = FlatButton(
child: Text("Cancelar"),
onPressed: () {
Navigator.of(context).pop();
},
);
Widget continueButton = FlatButton(
child: Text("Eliminar"),
onPressed: () {
provider.EliminarSedes(
data.codigo.toString());
Navigator.of(context).pop();
Scaffold.of(context).showSnackBar(SnackBar(
elevation: 16.0,
behavior: SnackBarBehavior.floating,
duration: Duration(seconds: 2),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(
Radius.circular(15)),
),
backgroundColor: Colors.red,
content: Text(
"Se ha eliminado la sede ${data.nombre}",
style: TextStyle(
fontStyle: FontStyle.italic,
fontSize: 20)),
));
},
);
AlertDialog alert = AlertDialog(
title: Text("Eliminar"),
content: Text(
"¿Seguro que quieres eliminar la sede ${data.nombre.toString()}?"),
actions: [
cancelButton,
continueButton,
],
);
showDialog(
context: context,
builder: (BuildContext context) {
return alert;
},
);
}
showAlertDialog(context);
},
),
],
),
)),
]))
.toList(),
),
),
);
我想在我的 DataTable 上有这样的东西
我用draggable_scrollbar试过了,但没有成功,有可能变成DataTable吗?可能是我在实施中犯了一些错误。
解决方案
- 编辑:您可以在 pub.dev 上使用draggable_scrollable包
用Scrollbar小部件包装 SingleChildScrollView 。您可以在 Scrollbar 内嵌套任何可滚动的小部件,它会在右侧显示该栏。
推荐阅读
- angular - Http调用在角度通用中进行了两次
- php - 将 HTML 标记添加到所见即所得编辑器
- java - 重新获取 BufferedImage 的先前 Graphics2D 实例
- wordpress - 如何在模板 Wordpress 中插入标题属性
- android - 实现 webview 以使用 vimeo 嵌入链接
- weblogic - 重新启动服务器后 Weblogic 管理控制台未启动
- python - 您可以使用 MySQL 返回作为条件在 Python 中运行 for 循环吗?
- javascript - 在 MonoRepo 中编译 React 项目失败
- sql - 使用With Clause后如何保存数据?
- c# - 在 While 循环中对锁调用 Monitor.Wait() 的目的是什么?