如何使DataTable双向滚动。 我使数据表水平滚动,但是列表很大,无法向下滚动。
>tsc dynamic.ts -t ES6 -m commonjs
需要帮助。 预先感谢。
答案 0 :(得分:6)
更新,更简便的方法。
从Flutter的最新更新开始,您还可以将DataTable
属性设置为InteractiveViewer
,将constrained
包装在false
小部件中。与早期解决方案不同,这将允许您同时水平和垂直滚动。它也是更少的代码,可让您放大/缩小DataTable。
祝你好运!
答案 1 :(得分:5)
只需添加两个SingleChildScrollView
:
child: SingleChildScrollView(
scrollDirection: Axis.vertical,
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: DataTable(
答案 2 :(得分:0)
尝试使用此插件bidirectional_scroll_view。
答案 3 :(得分:0)
我曾经以这种方式进行编码,并且效果很好:
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:followmeifucan/constants/style_constants.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
class RankScreen extends StatefulWidget {
static String id = 'ranks_screen';
@override
_RankScreenState createState() => _RankScreenState();
}
class _RankScreenState extends State<RankScreen> {
final _firestore = Firestore.instance;
@override
void initState() {
super.initState();
}
List<DataCell> _createCellsForElement(DocumentSnapshot document){
Timestamp timestamp = document.data['when'];
return <DataCell>[
DataCell(Text(document.data['name'].toString())),
DataCell(Text(document.data['level'].toString())),
DataCell(Text(document.data['round'].toString())),
DataCell(Text(document.data['hits_ok'].toString())),
DataCell(Text(timestamp.toDate().toString().substring(0, 16))),
DataCell(Icon(document.data['plataform'].toString() == 'Android' ? Icons.android : FontAwesomeIcons.apple))
];
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
centerTitle: true,
backgroundColor: Colors.black,
title: Row(
children: <Widget>[
Flexible(
child: Hero(
tag: 'logo',
child: Container(
height: 30.0,
child: Image.asset('images/default_icon.png'),
),
),
),
SizedBox(width: 10.0,),
Text('HIGHSOCRES'),
],
),
),
body: SafeArea(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: SingleChildScrollView(
scrollDirection: Axis.vertical,
child: Column(
children: <Widget>[
StreamBuilder<QuerySnapshot>(
stream: _firestore.collection('ranks').snapshots(),
builder: (context, snapshot){
List<DataRow> rankLines = new List<DataRow>();
if(snapshot.hasData){
final ranks = snapshot.data.documents;
for(var rankData in ranks){
rankLines.add(
DataRow(
cells: _createCellsForElement(rankData)
)
);
}
}
return Container(
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: DataTable(
sortAscending: true,
sortColumnIndex: 3,
columns: <DataColumn>[
DataColumn(label: Text('NAME', style: kRankLabelStyle,)),
DataColumn(label:Text('LEVEL', style: kRankLabelStyle,), numeric: true,),
DataColumn(label:Text('ROUND', style: kRankLabelStyle,), numeric: true,),
DataColumn(label:Text('HITS OK', style: kRankLabelStyle,), numeric: true,),
DataColumn(label:Text('WHEN', style: kRankLabelStyle,),),
DataColumn(label:Icon(Icons.phone_iphone)),
],
rows: rankLines,
),
),
);
},
),
]
),
),
),
),
);
}
}