只是尝试构建一个带有列表的简单应用，您可以在其中轻触以转到详细信息页面，向左和向右滑动以执行一些操作。
列表页面的代码如下。但是，一旦我添加了Dismissible，轻按就会停止工作，而刷卡也无法正常工作。
当我启用debugPaintPointersEnabled时，列表图块（行）只是不响应任何轻拍。很奇怪，我正在使用此example并且代码几乎相同，但是不知道为什么我的代码不起作用，但是示例起作用。任何建议将不胜感激！谢谢！
import 'package:flutter/material.dart';
import 'package:xxx/routes/utils.dart';
import 'package:xxxx/models/SomeItem.dart';
import 'SomeItem_DoSth.dart';
import 'package:xxxxxh/constants.dart';
class SomeItemListRoute extends StatefulWidget {
@override
_SomeItemListState createState() => new _SomeItemListState();
}
class _SomeItemListState extends State<SomeItemListRoute> {
List<SomeItem> SomeItemList;
@override
Widget build(BuildContext context) {
SomeAppDb.get().getSomeItems().then((SomeItems) {
if (SomeItems != null) {
setState(() {
SomeItemList = SomeItems;
});
}
});
if (SomeItemList == null || SomeItemList.length <= 0) {
return emptyView("No items yet");
}
return new Container(
child: new ListView.builder(
itemCount: SomeItemList.length,
itemBuilder: (context, index) {
return new Dismissible(
key: new ObjectKey(SomeItemList[index]),
onDismissed: (DismissDirection direction) {
var taskID = SomeItemList[index].id;
setState(() {
SomeItemList.removeAt(index);
});
if (direction == DismissDirection.endToStart) {
SomeAppDb
.get()
.updateSomeItemStatus(taskID, SomeItemStatus.COMPLETE)
.then((value) {
Scaffold.of(context).showSnackBar(new SnackBar(
content: new Text("Completed"),
backgroundColor: Colors.green));
});
} else {
SomeAppDb.get().deleteSomeItem(taskID).then((value) {
Scaffold.of(context).showSnackBar(new SnackBar(
content: new Text("Deleted"),
backgroundColor: Colors.red));
});
}
},
background: new Container(
color: Colors.red,
child: new ListTile(
leading: new Icon(Icons.delete, color: Colors.white),
),
),
secondaryBackground: new Container(
color: Colors.green,
child: new ListTile(
trailing: new Icon(Icons.check, color: Colors.white),
),
),
child: SomeItemRow(SomeItemList[index]));
},
));
}
}
class SomeItemRow extends StatelessWidget {
SomeItem SomeItem;
static final date_label = "Date";
SomeItemRow(SomeItem) {
this.SomeItem = SomeItem;
}
@override
Widget build(BuildContext context) {
return new GestureDetector(
onTap: () {
Navigator.of(context).push(new MaterialPageRoute(
builder: (context) {
return SomeItemDoSthRoute();
},
));
},
child: Column(
children: <Widget>[
new Container(
margin: const EdgeInsets.symmetric(vertical: PADDING_TINY),
decoration: new BoxDecoration(
border: new Border(
left: new BorderSide(
width: 4.0,
color: Colors.blue,
),
),
),
child: new Padding(
padding: const EdgeInsets.all(PADDING_SMALL),
child: new Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Padding(
padding: const EdgeInsets.only(
left: PADDING_SMALL, bottom: PADDING_VERY_SMALL),
child: new Text(SomeItem.DoSthNo,
style: new TextStyle(
fontSize: FONT_SIZE_TITLE,
fontWeight: FontWeight.bold)),
),
new Container(),
new Padding(
padding: const EdgeInsets.only(
left: PADDING_SMALL, bottom: PADDING_VERY_SMALL),
child: new Row(
children: <Widget>[
new Text(
"Date Placeholder",
style: new TextStyle(
color: Colors.grey, fontSize: FONT_SIZE_DATE),
key: new Key(date_label),
),
new Expanded(
child: new Column(
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
new Row(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
new Text('Consignee Placeholder',
style: new TextStyle(
color: Colors.grey,
fontSize: FONT_SIZE_LABEL)),
new Container(
margin: const EdgeInsets.symmetric(
horizontal: 8.0),
width: 8.0,
height: 8.0,
child: new CircleAvatar(
backgroundColor: Colors.red,
),
)
],
),
],
),
)
],
),
),
],
),
),
),
new Container(
decoration: new BoxDecoration(
border: new Border(
bottom: new BorderSide(
width: 0.5,
color: Colors.grey,
),
),
))
],
));
}
}
答案 0 :(得分：1)
就像上面的nomad一样，您的代码中的个人变量太多，这使得其他人很难重新创建您的确切问题。我能够使用与您上面类似的功能，可解除。我建议您首先从一个有效的布局开始，如下面的代码，然后一次添加一项功能，以找出破坏布局的原因。首先使用硬编码值仅演示内容，然后使用模拟数据，然后添加这些函数调用，最后将模拟数据替换为数据库中的真实数据。找到确切原因后，您将知道如何解决该问题，或者可以发布一个更明智的问题。
import'package:flutter/material.dart';
class SwipeLeftRightDismissible extends StatefulWidget {
@override
_SwipeLeftRightDismissibleState createState() {
return new _SwipeLeftRightDismissibleState();
}
}
class _SwipeLeftRightDismissibleState extends State<SwipeLeftRightDismissible> {
List<String> _itemList;
@override
void initState() {
super.initState();
_itemList = ["first", "second", "third", "fourth"];
}
@override
Widget build(BuildContext context) {
return new Scaffold(
body: new Container(
child: new ListView.builder(
itemCount: _itemList.length,
itemBuilder: (context, index) {
return new Dismissible(
key: new ObjectKey(_itemList[index]),
child: ItemRow(_itemList[index]),
onDismissed: (direction) {
setState(() {
_itemList.removeAt(index);
});
if (direction == DismissDirection.endToStart) {
debugPrint("dismiss end to start");
} else {
debugPrint("dismiss start to end");
}
},
background: new Container(
color: Colors.red,
child: new ListTile(
leading: new Icon(Icons.delete, color: Colors.white),
),
),
secondaryBackground: new Container(
color: Colors.green,
child: new ListTile(
trailing: new Icon(Icons.check, color: Colors.white),
),
),
);
}
),
),
);
}
}
class ItemRow extends StatelessWidget {
final String item;
ItemRow(this.item);
@override
Widget build(BuildContext context) {
return new GestureDetector(
onTap: () {
Navigator.push(context, new MaterialPageRoute(
builder: (context) => new SwipeLeftRightDismissible()));
},
child: Column(
children: <Widget>[
new Container(
margin: const EdgeInsets.symmetric(vertical: 4.0),
decoration: new BoxDecoration(
border: new Border(
left: new BorderSide(
width: 4.0,
color: Colors.blue,
),
),
),
child: new Padding(
padding: const EdgeInsets.all(8.0),
child: new Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Padding(
padding: const EdgeInsets.only(
left: 8.0, bottom: 4.0),
child: new Text(item,
style: new TextStyle(
fontWeight: FontWeight.bold)),
),
new Container(),
new Padding(
padding: const EdgeInsets.only(
left: 4.0, bottom: 4.0),
child: new Row(
children: <Widget>[
new Text(
"Date Placeholder",
style: new TextStyle(
color: Colors.grey, ),
),
new Expanded(
child: new Column(
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
new Text("column 1"),
new Text("column 2"),
],
),
)
],
),
),
],
),
),
),
new Container(
decoration: new BoxDecoration(
border: new Border(
bottom: new BorderSide(
width: 0.5,
color: Colors.grey,
),
),
))
],
),
);
}
}