我有一个DataTable
,我想提取小部件,因为我在整个应用程序中都使用了它。 DataTable
具有排序列名称的功能。
我能够完美地完成所有工作,但是我无法理解如何提取小部件并同时保持功能性。我正在使用回调方法,但无法解决。
我的代码
Column(
crossAxisAlignment: CrossAxisAlignment.center,
// this int and bool I need to pass, but it is onlyh in setState()
children: <Widget>[GetTable(true, 0, quantityPressed(1, true), [], getListItemsAccount())]
)
获取表类
import 'package:flutter/material.dart';
class GetTable extends StatefulWidget {
int indexCol;
bool as;
final void Function(int, bool) callback;
final List<String> columns;
final List<DataRow> rows;
GetTable(this.as, this.indexCol, this.callback, this.columns, this.rows);
@override
_GetTableState createState() => _GetTableState();
}
class _GetTableState extends State<GetTable> {
@override
Widget build(BuildContext context) {
return DataTable(
columnSpacing: 30,
horizontalMargin: 0,
sortColumnIndex: widget.indexCol,
sortAscending: widget.as,
columns: createColumns(),
rows: widget.rows,
);
}
List<DataColumn> createColumns() {
var list = List<DataColumn>();
for (var i = 0; i < widget.columns.length; i++) {
list.add(DataColumn(
numeric: true,
label: Text(
widget.columns[i],
style: TextStyle(fontFamily: 'Comfortaa'),
),
onSort: (index, bool) {
widget.callback(index, bool);
},
));
}
return list;
}
}
不提取屏幕内部小部件的完整代码为:
var colTable = 0;
var asTable = true;
List<ItemShopModel> items;
var total = 0.0;
var currency = getKenya();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('CALCULATOR'),
),
body: ListView(
shrinkWrap: true,
children: <Widget>[
Center(
child: Form(
key: _formKey,
child: Padding(
padding: EdgeInsets.all(16.0),
// Extract this Widget
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
DataTable(
columnSpacing: 30,
horizontalMargin: 0,
sortColumnIndex: colTable,
sortAscending: asTable,
columns: [
DataColumn(
numeric: true,
label: Text(
'Quantity',
style: TextStyle(fontFamily: 'Comfortaa'),
),
onSort: (index, bool) {
setState(() {
colTable = index;
asTable = bool;
if (bool) {
items.sort((a, b) =>
a.getQuantity().compareTo(b.getQuantity()));
} else {
items.sort((a, b) =>
b.getQuantity().compareTo(a.getQuantity()));
}
});
},
),
DataColumn(
label: Text(
'Item',
style: TextStyle(fontFamily: 'Comfortaa'),
),
onSort: (index, bool) {
setState(() {
colTable = index;
asTable = bool;
if (bool) {
items.sort((a, b) => a
.getItem()
.getName()
.compareTo(b.getItem().getName()));
} else {
items.sort((a, b) => b
.getItem()
.getName()
.compareTo(a.getItem().getName()));
}
});
},
),
DataColumn(
label: Text(
'Total price',
style: TextStyle(fontFamily: 'Comfortaa'),
),
onSort: (index, bool) {
setState(() {
colTable = index;
asTable = bool;
if (bool) {
items.sort((a, b) => a
.getFinalPrice()
.compareTo(b.getFinalPrice()));
} else {
items.sort((a, b) => b
.getItem()
.getName()
.compareTo(a.getItem().getName()));
}
});
},
),
],
rows: getListItemsAccount(),
),
SizedBox(
height: 30,
),
Container(
height: 76.00,
width: 252.00,
decoration: BoxDecoration(
color: Color(0xff48a999),
border: Border.all(
width: 3.00,
color: Color(0xff00796b),
),
borderRadius: BorderRadius.circular(21.00),
),
child: Center(
child: Text(
total.toString(),
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: "Indie Flower",
fontSize: 54,
color: Color(0xffffffff),
),
),
),
),
getChange(),
],
),
),
),
),
],
),
);
}
如何有效地提取小部件?