我有包含LstTiles的ListView构建器adsList adTile包含卡片。
当我按下Card窗口小部件时,我期望执行一个操作并导航到另一个屏幕,或者只是在控制台中打印,但是尽管我将卡片包装在GestureDetector中,但没有任何反应。
这是代码
class _AdTileState extends State<AdTile> {
@override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.only(top: 8),
child: GestureDetector(
onTap: (){
print('card pressed');
Navigator.push(context, new MaterialPageRoute(builder: (context) => AdView()));
},
child: Card(
margin: EdgeInsets.fromLTRB(20, 6, 20, 0),
child: ListTile(
trailing: Image.network(widget.adModel.adImage),
title: Text(widget.adModel.adName),
subtitle: Text(widget.adModel.location),
),
),
),
);
}
}
这是AdList中的代码:class _AdsListState extends State<AdsList> {
@override
Widget build(BuildContext context) {
final ads = Provider.of<List<AdModel>>(context);
return ListView.builder(
scrollDirection: Axis.vertical,
itemCount:(ads == null) ? 0 : ads.length,
itemBuilder: (context, index){
return
CustomAdTile(adModel: ads[index],);
});
}
}
这是页面上显示ListView Builder的代码: Widget build(BuildContext context) {
return StreamProvider<List<Profile>>.value(
value: DatabaseService().profiles,
child: StreamProvider<List<AdModel>>.value(
value: DatabaseService().ads,
child: Directionality(
textDirection: TextDirection.rtl,
child: Scaffold(
appBar: AppBar(),
body: Column(
children: <Widget>[
Container(),
Row(),
Expanded(
child: AdsList()
),
],
),
CustomAdTile的代码: class _CustomAdTileState extends State<CustomAdTile> {
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 5.0),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Expanded(
flex: 3,
child: Padding(
padding: const EdgeInsets.fromLTRB(0.0, 0.0, 10.0, 0.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(
widget.adModel.adName,
style: const TextStyle(
fontWeight: FontWeight.w500,
fontSize: 14.0,
),
),
const Padding(padding: EdgeInsets.symmetric(vertical: 2.0)),
Text(
widget.adModel.location,
style: const TextStyle(fontSize: 10.0),
),
const Padding(padding: EdgeInsets.symmetric(vertical: 1.0)),
Text(
'${widget.adModel.category} views',
style: const TextStyle(fontSize: 10.0),
),
],
),
),
),
const Icon(
Icons.more_vert,
size: 16.0,
),
Container(
height: 80,
width: 80,
decoration: BoxDecoration(
image: DecorationImage(image: NetworkImage(widget.adModel.adImage),
fit: BoxFit.fill),
),
)
],
),
);
}
}
最佳答案
看来您从未使用过AdTile,而是在使用CustomAdTile。您需要在CustomAdTile中添加onTap。
这是CustomAdTile的更新代码。
class _CustomAdTileState extends State<CustomAdTile> {
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 5.0),
child: InkWell(
///Add onTap here
onTap: () {
print('card pressed');
Navigator.push(
context, new MaterialPageRoute(builder: (context) => AdView()));
},
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Expanded(
flex: 3,
child: Padding(
padding: const EdgeInsets.fromLTRB(0.0, 0.0, 10.0, 0.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(
widget.adModel.adName,
style: const TextStyle(
fontWeight: FontWeight.w500,
fontSize: 14.0,
),
),
const Padding(padding: EdgeInsets.symmetric(vertical: 2.0)),
Text(
widget.adModel.location,
style: const TextStyle(fontSize: 10.0),
),
const Padding(padding: EdgeInsets.symmetric(vertical: 1.0)),
Text(
'${widget.adModel.category} views',
style: const TextStyle(fontSize: 10.0),
),
],
),
),
),
const Icon(
Icons.more_vert,
size: 16.0,
),
Container(
height: 80,
width: 80,
decoration: BoxDecoration(
image: DecorationImage(
image: NetworkImage(widget.adModel.adImage),
fit: BoxFit.fill),
),
)
],
),
),
);
}
}