Reputation: 1
I'm trying to move a player with swipe (using onPan), when I build for the web it works as expected on desktop and android but is inverted (eg: you have to swipe right to go left) on ios.
I've used chrome on the three devices. (Also tried with Firefox on desktop, Opera on android and Edge on iPhone but the problem still only occur on iPhone). Here's my code for moving the player:
class _PlayerState extends State<Player> {
Data? data;
bool hasMoved = false;
@override
Widget build(BuildContext context) {
data = Provider.of<Data>(context);
return GestureDetector(
onPanUpdate: (details) {
if (hasMoved) return;
if ((details.delta.dx).abs()<(details.delta.dy).abs()) { //vertical
if (details.delta.dy>0) {//down
data!.changePosition(0,1);
hasMoved = true;
}else if (details.delta.dy<0) {//up
data!.changePosition(0,-1);
hasMoved = true;
}
}else { //horizontal
if (details.delta.dx>0) {//right
data!.changePosition(1,0);
hasMoved = true;
}else if (details.delta.dx<0) {//left
data!.changePosition(-1,0);
hasMoved = true;
}
}},
onPanEnd: (details) {hasMoved = false;},
child: Container( //The maximal size transparent container allow the detection of the swipe anywhere and not only on the player
color: Colors.transparent, //without the color the detection only happen on the player
width: double.infinity,
height: double.infinity,
alignment: FractionalOffset((data!.position.$1)/30, (data!.position.$2)/16), //the playing board is 30 by 16
child: FractionallySizedBox( //The player has a size of 1.4.
widthFactor: 1.4/30,
heightFactor: 1.4/16,
child: Focus(
canRequestFocus: true,
autofocus: true, //So that the keyboard input are detected
onKeyEvent: (node, event) {
if (event is KeyUpEvent) {
return KeyEventResult.ignored;
}
if (event.logicalKey == LogicalKeyboardKey.arrowDown) {
data!.changePosition(0,1);
} else if (event.logicalKey == LogicalKeyboardKey.arrowUp) {
data!.changePosition(0,-1);
} else if (event.logicalKey == LogicalKeyboardKey.arrowRight) {
data!.changePosition(1,0);
} else if (event.logicalKey == LogicalKeyboardKey.arrowLeft) {
data!.changePosition(-1,0);
} else {
return KeyEventResult.ignored;
}
return KeyEventResult.handled;
},
child: const ImageObject(image: "player.png", width: double.infinity, height: double.infinity),
),
))
);
}
}
I've not been able to reproduce the bug with the inspector tool to simulate mobile devices. If anyone has any idea where the bug might come from please let me know as I have not found anyone having a similar issue which is even weirder.
Upvotes: 0
Views: 45