rustdesk/lib/widgets/gesture_help.dart

198 lines
7.5 KiB
Dart
Raw Normal View History

2022-02-23 21:16:30 +08:00
import 'package:flutter/material.dart';
2022-02-23 21:32:33 +08:00
import 'package:flutter_hbb/common.dart';
2022-02-23 21:16:30 +08:00
import 'package:toggle_switch/toggle_switch.dart';
2022-03-23 16:28:37 +08:00
import '../models/model.dart';
2022-02-23 21:16:30 +08:00
class GestureIcons {
static const String _family = 'gestureicons';
GestureIcons._();
static const IconData icon_mouse = IconData(0xe65c, fontFamily: _family);
static const IconData icon_Tablet_Touch =
IconData(0xe9ce, fontFamily: _family);
static const IconData icon_gesture_f_drag =
IconData(0xe686, fontFamily: _family);
static const IconData icon_Mobile_Touch =
IconData(0xe9cd, fontFamily: _family);
static const IconData icon_gesture_press =
IconData(0xe66c, fontFamily: _family);
static const IconData icon_gesture_tap =
IconData(0xe66f, fontFamily: _family);
static const IconData icon_gesture_pinch =
IconData(0xe66a, fontFamily: _family);
static const IconData icon_gesture_press_hold =
IconData(0xe66b, fontFamily: _family);
static const IconData icon_gesture_f_drag_up_down_ =
IconData(0xe685, fontFamily: _family);
static const IconData icon_gesture_f_tap_ =
IconData(0xe68e, fontFamily: _family);
static const IconData icon_gesture_f_swipe_right =
IconData(0xe68f, fontFamily: _family);
static const IconData icon_gesture_f_double_tap =
IconData(0xe691, fontFamily: _family);
}
2022-02-24 15:59:03 +08:00
typedef OnTouchModeChange = void Function(bool);
2022-02-23 21:16:30 +08:00
class GestureHelp extends StatefulWidget {
2022-03-23 16:28:37 +08:00
GestureHelp(
{Key? key, required this.touchMode, required this.onTouchModeChange})
: super(key: key);
2022-02-24 15:59:03 +08:00
final bool touchMode;
final OnTouchModeChange onTouchModeChange;
2022-03-23 16:28:37 +08:00
2022-02-23 21:16:30 +08:00
@override
State<StatefulWidget> createState() => _GestureHelpState();
}
class _GestureHelpState extends State<GestureHelp> {
2022-02-23 21:32:33 +08:00
var _selectedIndex;
var _touchMode;
@override
void initState() {
2022-02-24 15:59:03 +08:00
_touchMode = widget.touchMode;
2022-02-23 21:32:33 +08:00
_selectedIndex = _touchMode ? 1 : 0;
super.initState();
}
2022-02-23 21:16:30 +08:00
@override
Widget build(BuildContext context) {
return Center(
child: Padding(
2022-03-23 16:28:37 +08:00
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
2022-02-23 21:16:30 +08:00
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
2022-03-23 16:28:37 +08:00
crossAxisAlignment: CrossAxisAlignment.start,
2022-02-23 21:16:30 +08:00
children: <Widget>[
ToggleSwitch(
initialLabelIndex: _selectedIndex,
2022-02-24 15:59:03 +08:00
inactiveBgColor: MyTheme.darkGray,
2022-02-23 21:16:30 +08:00
totalSwitches: 2,
2022-03-23 16:28:37 +08:00
minWidth: 150,
2022-02-23 21:16:30 +08:00
fontSize: 15,
2022-03-23 16:28:37 +08:00
iconSize: 18,
labels: [translate("TouchPad mode"), translate("Touch mode")],
icons: [Icons.mouse, Icons.touch_app],
2022-02-23 21:16:30 +08:00
onToggle: (index) {
debugPrint(index.toString());
setState(() {
2022-03-23 16:28:37 +08:00
if (_selectedIndex != index) {
2022-02-24 15:59:03 +08:00
_selectedIndex = index ?? 0;
_touchMode = index == 0 ? false : true;
widget.onTouchModeChange(_touchMode);
}
2022-02-23 21:16:30 +08:00
});
},
),
const SizedBox(height: 15),
2022-03-23 16:28:37 +08:00
Container(
child: Column(
2022-02-23 21:16:30 +08:00
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: _touchMode
2022-03-23 16:28:37 +08:00
? [
GestureInfo(
GestureIcons.icon_Mobile_Touch,
translate("One-Finger Tap"),
translate("Left Mouse")),
GestureInfo(
GestureIcons.icon_gesture_press_hold,
translate("One-Long Tap"),
translate("Right Mouse")),
GestureInfo(
GestureIcons.icon_gesture_f_swipe_right,
translate("One-Finger Move"),
translate("Mouse Drag")),
2022-02-23 21:16:30 +08:00
GestureInfo(
2022-03-23 16:28:37 +08:00
GestureIcons.icon_gesture_f_drag_up_down_,
translate("Two-Finger vertically"),
translate("Mouse Wheel")),
2022-02-23 21:16:30 +08:00
GestureInfo(
2022-03-23 16:28:37 +08:00
GestureIcons.icon_gesture_f_drag,
translate("Two-Finger Move"),
translate("Canvas Move")),
2022-02-23 21:16:30 +08:00
GestureInfo(
2022-03-23 16:28:37 +08:00
GestureIcons.icon_gesture_pinch,
translate("Pinch to Zoom"),
translate("Canvas Zoom")),
2022-02-23 21:16:30 +08:00
]
2022-03-23 16:28:37 +08:00
: [
2022-02-23 21:16:30 +08:00
GestureInfo(
2022-03-23 16:28:37 +08:00
GestureIcons.icon_Mobile_Touch,
translate("One-Finger Tap"),
translate("Left Mouse")),
2022-02-23 21:16:30 +08:00
GestureInfo(
2022-03-23 16:28:37 +08:00
GestureIcons.icon_gesture_f_tap_,
translate("Two-Finger Tap"),
translate("Right Mouse")),
2022-02-23 21:16:30 +08:00
GestureInfo(
2022-03-23 16:28:37 +08:00
GestureIcons.icon_gesture_f_swipe_right,
translate("Double Tap & Move"),
translate("Mouse Drag")),
2022-02-23 21:16:30 +08:00
GestureInfo(
2022-03-23 16:28:37 +08:00
GestureIcons.icon_gesture_f_drag_up_down_,
translate("Two-Finger vertically"),
translate("Mouse Wheel")),
GestureInfo(
GestureIcons.icon_gesture_f_drag,
translate("Two-Finger Move"),
translate("Canvas Move")),
GestureInfo(
GestureIcons.icon_gesture_pinch,
translate("Pinch to Zoom"),
translate("Canvas Zoom")),
2022-02-23 21:16:30 +08:00
],
2022-03-23 16:28:37 +08:00
)),
2022-02-23 21:16:30 +08:00
],
)));
}
}
class GestureInfo extends StatelessWidget {
const GestureInfo(this.icon, this.fromText, this.toText, {Key? key})
: super(key: key);
final String fromText;
final String toText;
final IconData icon;
2022-03-23 16:28:37 +08:00
final textSize = 14.0;
2022-02-23 21:32:33 +08:00
final textColor = MyTheme.accent80;
2022-02-23 21:16:30 +08:00
final iconSize = 35.0;
2022-02-23 21:32:33 +08:00
final iconColor = MyTheme.darkGray;
2022-02-23 21:16:30 +08:00
@override
Widget build(BuildContext context) {
2022-03-23 16:28:37 +08:00
return Padding(
padding: const EdgeInsets.symmetric(vertical: 5),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 0),
child: Icon(
icon,
size: iconSize,
color: iconColor,
)),
Row(
2022-02-23 21:16:30 +08:00
children: [
2022-03-23 16:28:37 +08:00
Text(fromText,
style: TextStyle(fontSize: textSize, color: textColor)),
2022-02-23 21:16:30 +08:00
Padding(
2022-03-23 16:28:37 +08:00
padding: const EdgeInsets.symmetric(horizontal: 5),
child: Icon(Icons.arrow_forward_rounded,
size: 20, color: iconColor)),
Text(toText,
style: TextStyle(fontSize: textSize, color: textColor))
2022-02-23 21:16:30 +08:00
],
2022-03-23 16:28:37 +08:00
)
],
));
2022-02-23 21:16:30 +08:00
}
}