Comment détecter le glissement dans le flottement
J'ai essayé d'utiliser le plugin swipedetector pour flutter pour atteindre la navigation vers un nouvel écran en glissant vers la droite mais cela ne fonctionne pas, aucune erreur n'est générée et le point d'arrêt n'est jamais atteint lorsque je le débogue. J'ai regardé dans le GestureDector mais je n'étais pas sûr que cela fonctionnerait pour un scénario de balayage vers la droite, nous voulons qu'il navigue vers un écran lorsque n'importe où sur l'écran est glissé vers la droite.
Voici mon code en utilisant le plugin
@override
Widget build(BuildContext context){
return new Scaffold(
appBar : LBAppBar().getAppBar(),
//drawer: new LBDrawer().getDrawer(),
body: Container(
decoration: BoxDecoration(
gradient: new LinearGradient(
colors: [Color.fromRGBO(1,89,99, 1.0), Colors.grey],
begin: Alignment.bottomLeft,
end: Alignment.topRight
)
),
child:
SwipeDetector(
onSwipeRight: () {
Navigator.of(context).Push(new MaterialPageRoute(builder: (BuildContext context) => new WidgetsPage())
); },
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children:[
Row(
children: [
Container(
margin: EdgeInsets.only(left: 20.0,top: 10.0, bottom: 10.0, right:30.0),
child: Column(
children: <Widget>[
Text("Hi ${user.firstName}, Today is " + formatDate(), style: new TextStyle( color: Colors.white70, fontWeight: FontWeight.bold, fontSize: 19.0
)),
],
),
),
]
),
Row(
//ROW 1
children: [
Container(
margin: EdgeInsets.only(left: 30.0,top: 60.0, bottom: 30.0, right:30.0),
child: Column(
children: <Widget>[
GestureDetector(
child: Icon(
FontAwesomeIcons.checkSquare,
size: 50.0,
color: Colors.white70,
),
onTap: () {
Navigator.of(context).Push(new MaterialPageRoute(builder: (BuildContext context) => new CheckIn()));
}),
Text("Check In", style: new TextStyle( color: Colors.white70, fontWeight: FontWeight.normal ))
],
),
),
Container(
margin: EdgeInsets.only(left: 50.0,top: 60.0, bottom: 30.0, right:30.0),
child: Column(
children: <Widget>[
GestureDetector(
child: Icon(
FontAwesomeIcons.list,
size: 50.0,
color: Colors.white70,
),
onTap: () {
Navigator.of(context).Push(new MaterialPageRoute(builder: (BuildContext context) => new DayAtAGlance()));
}),
Text("My Day", style: new TextStyle( color: Colors.white70, fontWeight: FontWeight.normal ))
],
),
),
Container(
margin: EdgeInsets.only(left: 30.0,top: 60.0, bottom: 30.0, right:30.0),
child: Column(
children: <Widget>[
GestureDetector(
child: Icon(
FontAwesomeIcons.phone,
size: 45.0,
color: Colors.white70,
),
onTap: () {
Navigator.of(context).Push(new MaterialPageRoute(builder: (BuildContext context) => new CommunicationLinks()));
}),
Text("Communication", style: new TextStyle( color: Colors.white70, fontWeight: FontWeight.normal ))
],
),
),
]
),
Row(//ROW 2
children: [
Container(
margin: EdgeInsets.only(left: 32.0,top: 50.0, bottom: 30.0),
child: Column(
children: <Widget>[
GestureDetector(
child: Icon(
FontAwesomeIcons.dollarSign,
size: 50.0,
color: Colors.white70,
),
onTap: () {
Navigator.of(context).Push(new MaterialPageRoute(builder: (BuildContext context) => new Budget()));
}),
Text("Budget", style: new TextStyle( color: Colors.white70, fontWeight: FontWeight.normal ))
],
),
),
Container(
margin: EdgeInsets.only(left: 75.0, top: 50.0, bottom: 30.0, right: 30.0),
child: Column(
children: <Widget>[
GestureDetector(
child: Icon(
FontAwesomeIcons.trophy,
size: 50.0,
color: Colors.white70,
),
onTap: () {
print("Pressed");
}),
Text("Goals", style: new TextStyle( color: Colors.white70, fontWeight: FontWeight.normal ))
],
),
),
Container(
margin: EdgeInsets.only(left: 50.0, top: 50.0, bottom: 30.0, right: 20.0),
child: Column(
children: <Widget>[
GestureDetector(
child: Icon(
FontAwesomeIcons.calendar,
size: 50.0,
color: Colors.white70,
),
onTap: () {
Navigator.of(context).Push(new MaterialPageRoute(builder: (BuildContext context) => new CalendarsPage()));
}),
Text("Calendar", style: new TextStyle( color: Colors.white70, fontWeight: FontWeight.normal ))
],
),
)
]),
Row(// ROW 3
children: [
Container(
margin: EdgeInsets.only(left: 30.0, top: 50.0, bottom: 30.0, right: 30.0),
child: Column(
children: <Widget>[
GestureDetector(
child: Icon(
FontAwesomeIcons.comments,
size: 50.0,
color: Colors.white70,
),
onTap: () {
print("Pressed");
}),
Text("Community", style: new TextStyle( color: Colors.white70, fontWeight: FontWeight.normal ))
],
),
),
Container(
margin: EdgeInsets.only(left: 20.0, top: 50.0, bottom: 30.0, right: 20.0),
child: Column(
children: <Widget>[
GestureDetector(
child: Icon(
FontAwesomeIcons.shoppingCart,
size: 50.0,
color: Colors.white70,
),
onTap: () {
Navigator.of(context).Push(new MaterialPageRoute(builder: (BuildContext context) => new ShoppingList()));
}),
Text("Shopping", style: new TextStyle( color: Colors.white70, fontWeight: FontWeight.normal ))
],
),
),
Container(
margin: EdgeInsets.only(left: 50.0, top: 50.0, bottom: 30.0, right: 40.0),
child: Column(
children: <Widget>[
GestureDetector(
child: Icon(
FontAwesomeIcons.solidCheckSquare,
size: 50.0,
color: Colors.white70,
),
onTap: () {
Navigator.of(context).Push(new MaterialPageRoute(builder: (BuildContext context) => new CheckOut()));
}),
Text("Check Out", style: new TextStyle( color: Colors.white70, fontWeight: FontWeight.bold ))
],
),
),
]),
],
),
)
)
);
Enveloppez votre widget dans GestureDetector et utilisez onPanUpdate comme ceci:
GestureDetector(onPanUpdate: (details) {
if (details.delta.dx > 0) {
// swiping in right direction
}
});
Enveloppez votre widget dans GestureDetector et utilisez onHorizontalDragUpdate
GestureDetector(onPanUpdate: (details) {
if (details.delta.dx > senstivity) {
// Right Swipe
// Sestivity is integer is used when you don't want to mess up vertical drag
} else if(details.delta.dx < -senstivity){
//Left Swipe
}
});