Anonymous
Slidable: как закрыть слайд, нажав в любом месте экрана?
Сообщение
Anonymous » 26 май 2024, 10:36
Есть ли решение закрыть слайд, автоматически нажав в любом месте экрана, вместо того, чтобы делать это вручную? Например, у меня есть этот код:
Код: Выделить всё
import 'package:flutter/material.dart';
import 'package:flutter_slidable/flutter_slidable.dart';
void main() => runApp(const MyApp());
class MyApp extends StatefulWidget {
const MyApp({
super.key,
});
@override
State createState() => _MyAppState();
}
class _MyAppState extends State with SingleTickerProviderStateMixin {
late final controller = SlidableController(this);
// Define a list of items
final List items = List.generate(10, (index) => 'Item $index');
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Slidable Example',
home: Scaffold(
appBar: AppBar(title: const Text('Slidable List Example')),
body: SlidableAutoCloseBehavior(
child: Column(
children: [
const Text(
"HELLO",
style: TextStyle(fontSize: 50),
),
Flexible(
child: ListView.builder(
itemCount: items.length,
itemBuilder: (context, index) {
return Slidable(
key: ValueKey(index),
startActionPane: ActionPane(
motion: const ScrollMotion(),
children: [
SlidableAction(
onPressed: (context) => editItem(context, index),
backgroundColor: const Color(0xFF21B7CA),
foregroundColor: Colors.white,
icon: Icons.edit,
label: 'Edit',
),
SlidableAction(
onPressed: (context) => deleteItem(index),
backgroundColor: const Color(0xFFFE4A49),
foregroundColor: Colors.white,
icon: Icons.delete,
label: 'Delete',
),
],
),
endActionPane: ActionPane(
motion: const ScrollMotion(),
children: [
SlidableAction(
onPressed: (context) =>
controller.openEndActionPane(),
backgroundColor: const Color(0xFF7BC043),
foregroundColor: Colors.white,
icon: Icons.archive,
label: 'Archive',
),
SlidableAction(
onPressed: (context) => controller.close(),
backgroundColor: const Color(0xFF0392CF),
foregroundColor: Colors.white,
icon: Icons.save,
label: 'Save',
),
],
),
child: ListTile(title: Text(items[index])),
);
},
),
),
],
),
),
),
);
}
// Method to handle item editing
void editItem(BuildContext context, int index) {
// For demonstration, showing a simple dialog to edit item
showDialog(
context: context,
builder: (context) {
final TextEditingController controller =
TextEditingController(text: items[index]);
return AlertDialog(
title: const Text('Edit Item'),
content: TextField(
controller: controller,
decoration: const InputDecoration(hintText: 'Enter new value'),
),
actions: [
TextButton(
onPressed: () {
setState(() {
items[index] = controller.text;
});
Navigator.of(context).pop();
},
child: const Text('Save'),
),
],
);
},
);
}
// Method to handle item deletion
void deleteItem(int index) {
setState(() {
items.removeAt(index);
});
}
}
в этом коде мне нужно закрыть слайдер даже при нажатии за пределами списка, например, «HELLO».
Подробнее здесь:
https://stackoverflow.com/questions/785 ... the-screen
1716708970
Anonymous
Есть ли решение закрыть слайд, автоматически нажав в любом месте экрана, вместо того, чтобы делать это вручную? Например, у меня есть этот код: [code]import 'package:flutter/material.dart'; import 'package:flutter_slidable/flutter_slidable.dart'; void main() => runApp(const MyApp()); class MyApp extends StatefulWidget { const MyApp({ super.key, }); @override State createState() => _MyAppState(); } class _MyAppState extends State with SingleTickerProviderStateMixin { late final controller = SlidableController(this); // Define a list of items final List items = List.generate(10, (index) => 'Item $index'); @override Widget build(BuildContext context) { return MaterialApp( title: 'Slidable Example', home: Scaffold( appBar: AppBar(title: const Text('Slidable List Example')), body: SlidableAutoCloseBehavior( child: Column( children: [ const Text( "HELLO", style: TextStyle(fontSize: 50), ), Flexible( child: ListView.builder( itemCount: items.length, itemBuilder: (context, index) { return Slidable( key: ValueKey(index), startActionPane: ActionPane( motion: const ScrollMotion(), children: [ SlidableAction( onPressed: (context) => editItem(context, index), backgroundColor: const Color(0xFF21B7CA), foregroundColor: Colors.white, icon: Icons.edit, label: 'Edit', ), SlidableAction( onPressed: (context) => deleteItem(index), backgroundColor: const Color(0xFFFE4A49), foregroundColor: Colors.white, icon: Icons.delete, label: 'Delete', ), ], ), endActionPane: ActionPane( motion: const ScrollMotion(), children: [ SlidableAction( onPressed: (context) => controller.openEndActionPane(), backgroundColor: const Color(0xFF7BC043), foregroundColor: Colors.white, icon: Icons.archive, label: 'Archive', ), SlidableAction( onPressed: (context) => controller.close(), backgroundColor: const Color(0xFF0392CF), foregroundColor: Colors.white, icon: Icons.save, label: 'Save', ), ], ), child: ListTile(title: Text(items[index])), ); }, ), ), ], ), ), ), ); } // Method to handle item editing void editItem(BuildContext context, int index) { // For demonstration, showing a simple dialog to edit item showDialog( context: context, builder: (context) { final TextEditingController controller = TextEditingController(text: items[index]); return AlertDialog( title: const Text('Edit Item'), content: TextField( controller: controller, decoration: const InputDecoration(hintText: 'Enter new value'), ), actions: [ TextButton( onPressed: () { setState(() { items[index] = controller.text; }); Navigator.of(context).pop(); }, child: const Text('Save'), ), ], ); }, ); } // Method to handle item deletion void deleteItem(int index) { setState(() { items.removeAt(index); }); } } [/code] в этом коде мне нужно закрыть слайдер даже при нажатии за пределами списка, например, «HELLO». Подробнее здесь: [url]https://stackoverflow.com/questions/78534579/slidable-how-to-close-a-slidable-by-tapping-anywhere-on-the-screen[/url]