Use OnLongPress and OnPress differently in flutter datatable? - flutter

Is there a way to do different actions on a DataTable object depending on LongPress vs ShortPress?
ShortPress -- Present details (read only),
LongPress -- Present details (read-write).
I do
await Navigator.push(
context, new MaterialPageRoute(builder: (context) => new Page2(dataRow, editMode)));
from the DataTable's OnSelectChanged,but I don't know how to set "editmode" based on a longPress vs a shortPress (or double-tap)...

Adding a GestureDetector to every DataCell may not be the best solution but it should work
DataTable(columns: [
DataColumn(
label: Text("Name"),
),
DataColumn(
label: Text("Age"),
),
DataColumn(
label: Text("Year"),
),
], rows: [
DataRow(cells: [
DataCell(
GestureDetector(
child: Text("Ross"),
onTap: () {
print('Tap');
},
onLongPress: () {
print('Long Press');
},
),
),
DataCell(
GestureDetector(
child: Text("28"),
onTap: () {
print('Tap');
},
onLongPress: () {
print('Long Press');
},
),
),
DataCell(
GestureDetector(
child: Text("2003"),
onTap: () {
print('Tap');
},
onLongPress: () {
print('Long Press');
},
),
),
]),
]);
}

Related

Flutter Alert dialog is not showing when I debug on chrome

When I debug on chrome the alert dialog is not showing.
My code:
PopupMenuItem(
value: 1,
onTap: () {
ShowMyDialog();
Navigator.pop(context);
},
child: ListTile(
leading: Icon(Icons.edit),
title: Text("Edit"),
),
),
Future<void> ShowMyDialog() async {
return await showDialog(
context: context,
builder: (BuildContext context) {
return AlertDialog(
title: Text("Update"),
content: Container(
child: TextField(
controller: editingController,
),
),
actions: [
TextButton(
onPressed: () {
Navigator.pop(context);
},
child: Text("Cancel"),
),
TextButton(
onPressed: () {
Navigator.pop(context);
},
child: Text("Update"),
),
],
);
},
);
}
Pass context to ShowMyDialog() method. like ShowMyDialog(context);
onTap: () {
ShowMyDialog();
Navigator.pop(context);
},
to
onTap: () {
ShowMyDialog();
},
You were popping the context as soon as the Dialog open so it wasn't showing on that time . now try with this

How to use the Simple Dialog widget

I'm trying to use a SimpleDialog to select an image from Gallery or Camera but I'm getting the run error type 'SimpleDialog' is not a subtype of type '(() => void)?'
This is my function to call the dialog box
selectImage(context) {
{
return SimpleDialog(
title: Text("Upload Image"),
children: [
SimpleDialogOption(
child: Text("Take Photo"),
onPressed: handleTakePhoto,
),
SimpleDialogOption(
child: Text("Upload From Gallery"),
onPressed: handleChooseFromGallery,
),
SimpleDialogOption(
onPressed: () => Navigator.pop(context),
child: Center(
child: Text("Cancel"),
),
),
],
);
}
}
My handleTakePhoto and handleChooseFromGallery functions are as
handleTakePhoto() async {
Navigator.pop(context);
File file = (await ImagePicker().getImage(
source: ImageSource.camera,
maxHeight: 675.0,
maxWidth: 960,
// imageQuality: 50, //TODO: Look into this
)) as File;
setState(() {
this.file = file;
});
}
handleChooseFromGallery() async {
Navigator.pop(context);
File file = (await ImagePicker().getImage(
source: ImageSource.gallery,
maxWidth: 960,
maxHeight: 675,
preferredCameraDevice: CameraDevice.rear)) as File;
setState(() {
this.file = file;
});
}
Where have I gone wrong?
try to this way implement third dialog
SimpleDialogOption(
onPressed: () { Navigator.pop(context) },
child: Center(
child: Text("Cancel"),
),
),
SimpleDialog needs to be wrap inside showDialog, to get it displayed
Future<void> selectImage() async {
await showDialog(
context: context,
builder: (BuildContext context) {
return SimpleDialog(
title: Text("Upload Image"),
children: [
SimpleDialogOption(
child: Text("Take Photo"),
onPressed: handleTakePhoto,
),
SimpleDialogOption(
child: Text("Upload From Gallery"),
onPressed: handleChooseFromGallery,
),
SimpleDialogOption(
onPressed: () => Navigator.pop(context),
child: Center(
child: Text("Cancel"),
),
),
],
);
});
}
Output:

How to open an AlertDialog in Flutter by Button-Press?

after Button-press, i want to open an AlertDialog, but only if the variable bool showAlert is true.
This is my code until now:
FlatButton(
child: Text("HIER"),
onPressed: () {
return AlertDialog(
title: Text("HI"),
content: Text("Are you there?"),
actions: [
FlatButton(child: Text("Yes"), onPressed: () {},),
FlatButton(child: Text("No"), onPressed: () {},)
],
elevation: 24,
);
},
),
For my question (opening the alert if bool is true), the problem is, the AlertDialog is not opening.
Any solutions? Thanks
To show an AlertDialog you need a showDialog, so the code results like this :
FlatButton(
child: Text("HIER"),
onPressed: () {
if(showAlert){
showDialog(
//if set to true allow to close popup by tapping out of the popup
barrierDismissible: false,
context: context,
builder: (BuildContext context) => AlertDialog(
title: Text("HI"),
content: Text("Are you there?"),
actions: [
FlatButton(child: Text("Yes"), onPressed: () {},),
FlatButton(child: Text("No"), onPressed: () {},)
],
elevation: 24,
),
);
}
},
),
Use this code to show native diolog depends on platform:
FlatButton(
child: Text("HIER"),
onPressed: () {
if (Platform.isIOS) {
showCupertinoDialog(
context: context,
builder: (context) {
return CupertinoAlertDialog(
title: Text("HI"),
content: Text("Are you there?"),
actions: [
CupertinoDialogAction(
child: Text("Yes"),
onPressed: () {},
),
CupertinoDialogAction(
child: Text("No"),
onPressed: () {},
)
],
);
},
);
} else {
showDialog(
context: context,
builder: (context) {
return AlertDialog(
title: Text("HI"),
content: Text("Are you there?"),
actions: [
FlatButton(
child: Text("Yes"),
onPressed: () {},
),
FlatButton(
child: Text("No"),
onPressed: () {},
)
],
elevation: 24,
);
},
);
}
},
);
Check out this code, Hope it will help you
openDialog(bool showAlert, BuildContext context) async {
if(!showAlert) return;
var result = await showDialog(
context: context,
builder: (BuildContext context) => AlertDialog(
title: Text("HI"),
content: Text("Are you there?"),
actions: [
FlatButton(child: Text("Yes"), onPressed: () {
Navigator.pop(context, true);
},),
FlatButton(child: Text("No"), onPressed: () {
Navigator.pop(context, false);
},)
],
elevation: 24,
),
);
if(!(result ?? false)) {
// Yes click
} else {
// No click
}
}
Alternative
GetX Package Get.dialog()
And for many other scaffold components.
Dialog, Bottosheet, Snackbar, StateManagent Getx and Obx builder, and much more.
Visit pub.dev and search for GetX

How to navigate to a different page using MenuItem in Flutter?

I'm new to Flutter, I have a list of MenuItems in Drawer like below.
MenuItem selectedMenuItem;
List<MenuItem> menuItems = [
MenuItem(title: 'Contact', items: [
MenuItem(title: 'Contact Us'),
MenuItem(title: 'Call center'),
MenuItem(title: 'WhatsApp'),
]),
MenuItem(title: 'language'),
MenuItem(title: 'Customer'),
];
I want to open a different page when each item is clicked. What should be my next step? Any ideas?
subItems(BuildContext context) {
return selectedMenuItem.items.map(
(item) => MaterialButton(
onPressed: () {
redirectItem(item);
},
child: Row(
children: [
Text(
item.title,
),
],
),
),
);
} style: TextStyle(fontSize: 14),
);
}
Welcome to the Flutter Community! I don't see your complete code so I guess you're already able to perform something when onPressed() is triggered.
You can navigate to another widget using this code:
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => YourWidget(),
),
);
},

Open collapsed ListTile after choose row

How could I do so that on the onTap of the line I open another ListTile below?
return ListTile(
title: Html(data: "<br/> <b>${team[index]['code']}</b>"),
trailing: Icon(Icons.keyboard_arrow_right),
onTap: () {
setState(() {
// call open colapsed or child listtile here
});
},
);
If I understand your question correctly, you want to show more ListTile items when the user taps on one of the ListTile items?
If that's the case, you can use ExpansionTile instead.
Here is an example code:
ExpansionTile(
onExpansionChanged: (res) {
print(res ? 'Open' : 'Close');
},
title: Text('Dropdown'),
children: [
ListTile(
title: Text('Test #1'),
trailing: Icon(Icons.keyboard_arrow_right),
onTap: () {
print('Test #1');
},
),
ListTile(
title: Text('Test #1'),
trailing: Icon(Icons.keyboard_arrow_right),
onTap: () {
print('Test #1');
},
),
],
)
P.S. You can also nest ExpansionTile inside another ExpansionTile.