Flutter-图标小部件



我正在使用一个图标小部件,我希望当我按下图标跳到另一个地方时(像呼叫图标(,并在按下图标时打开另一个小部件的选项(像三点图标(,我的问题是在flutter图标小部件中没有onlongpress。。。有什么样的代码可以帮助你做到这一点吗?

这是我现在的代码:

child: ListTile(
leading: CircleAvatar(
radius: 25.0,
backgroundColor: Colors.brown,
),
title: Text(helpRequest.category),
subtitle: Text(helpRequest.description),
trailing: Row(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
IconButton(
icon: Icon(
Icons.call,
size: 20.0,
color: Colors.brown[900],
),
onPressed: () {
},
),
IconButton(
icon: Icon(
Icons.more_vert,
size: 20.0,
color: Colors.brown[900],
),
onPressed: () {

},
),
],
),
),

不要使用IconButton,而是用手势检测器包裹图标,这将同时提供onLongPress和onTap(onPressed(。请参阅下面的代码-

import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: const Text("Flutter Demo")),
body: MyStatefulWidget(),
),
);
}
}
class MyStatefulWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
Offset _tapPosition;
void _storePosition(TapDownDetails details) {
_tapPosition = details.globalPosition;
}
return ListTile(
leading: const CircleAvatar(
radius: 25.0,
backgroundColor: Colors.brown,
),
title: const Text("helpRequest.category"),
subtitle: const Text("helpRequest.description"),
trailing: Row(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
GestureDetector(
onTap: () => print("Tap: call"),
onLongPress: () => print("Long Press: Call"),
child: Icon(
Icons.call,
size: 20.0,
color: Colors.brown[900],
),
),
GestureDetector(
onTap: () => print("Tap: more_vert"),
onTapDown: _storePosition,
onLongPress: () async {
final RenderBox overlay =
Overlay.of(context).context.findRenderObject();
final int _selected = await showMenu(
items: [
PopupMenuItem(
value: 1,
child: Row(
children: <Widget>[
const Icon(Icons.delete),
const Text("Delete"),
],
),
),
PopupMenuItem(
value: 2,
child: Row(
children: <Widget>[
const Icon(Icons.edit),
const Text("Edit"),
],
),
)
],
context: context,
position: RelativeRect.fromRect(
_tapPosition &
const Size(40, 40), // smaller rect, the touch area
Offset.zero & overlay.size // Bigger rect, the entire screen
),
);
switch (_selected) {
case 1:
print("delete seleted");
break;
case 2:
print("edit seleted");
break;
}
},
child: Icon(
Icons.more_vert,
size: 20.0,
color: Colors.brown[900],
),
),
],
),
);
}
}

最新更新