refact: mobile actions (#8236)
Signed-off-by: fufesou <linlong1266@gmail.com>
This commit is contained in:
parent
df36580451
commit
ed5487a1fc
@ -18,6 +18,7 @@ import 'package:flutter_hbb/utils/multi_window_manager.dart';
|
|||||||
import 'package:flutter_hbb/utils/platform_channel.dart';
|
import 'package:flutter_hbb/utils/platform_channel.dart';
|
||||||
import 'package:flutter_svg/flutter_svg.dart';
|
import 'package:flutter_svg/flutter_svg.dart';
|
||||||
import 'package:get/get.dart';
|
import 'package:get/get.dart';
|
||||||
|
import 'package:provider/provider.dart';
|
||||||
import 'package:uni_links/uni_links.dart';
|
import 'package:uni_links/uni_links.dart';
|
||||||
import 'package:url_launcher/url_launcher.dart';
|
import 'package:url_launcher/url_launcher.dart';
|
||||||
import 'package:uuid/uuid.dart';
|
import 'package:uuid/uuid.dart';
|
||||||
@ -858,30 +859,10 @@ class OverlayDialogManager {
|
|||||||
final overlayState = _overlayKeyState.state;
|
final overlayState = _overlayKeyState.state;
|
||||||
if (overlayState == null) return;
|
if (overlayState == null) return;
|
||||||
|
|
||||||
// compute overlay position
|
final overlay = makeMobileActionsOverlayEntry(
|
||||||
final screenW = MediaQuery.of(globalKey.currentContext!).size.width;
|
() => hideMobileActionsOverlay(),
|
||||||
final screenH = MediaQuery.of(globalKey.currentContext!).size.height;
|
ffi: ffi,
|
||||||
const double overlayW = 200;
|
|
||||||
const double overlayH = 45;
|
|
||||||
final left = (screenW - overlayW) / 2;
|
|
||||||
final top = screenH - overlayH - 80;
|
|
||||||
|
|
||||||
final overlay = OverlayEntry(builder: (context) {
|
|
||||||
final session = ffi ?? gFFI;
|
|
||||||
return DraggableMobileActions(
|
|
||||||
position: Offset(left, top),
|
|
||||||
width: overlayW,
|
|
||||||
height: overlayH,
|
|
||||||
onBackPressed: () => session.inputModel.tap(MouseButtons.right),
|
|
||||||
onHomePressed: () => session.inputModel.tap(MouseButtons.wheel),
|
|
||||||
onRecentPressed: () async {
|
|
||||||
session.inputModel.sendMouse('down', MouseButtons.wheel);
|
|
||||||
await Future.delayed(const Duration(milliseconds: 500));
|
|
||||||
session.inputModel.sendMouse('up', MouseButtons.wheel);
|
|
||||||
},
|
|
||||||
onHidePressed: () => hideMobileActionsOverlay(),
|
|
||||||
);
|
);
|
||||||
});
|
|
||||||
overlayState.insert(overlay);
|
overlayState.insert(overlay);
|
||||||
_mobileActionsOverlayEntry = overlay;
|
_mobileActionsOverlayEntry = overlay;
|
||||||
mobileActionsOverlayVisible.value = true;
|
mobileActionsOverlayVisible.value = true;
|
||||||
@ -909,6 +890,45 @@ class OverlayDialogManager {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
makeMobileActionsOverlayEntry(VoidCallback? onHide, {FFI? ffi}) {
|
||||||
|
final position = SimpleWrapper(Offset(0, 0));
|
||||||
|
makeMobileActions(BuildContext context, double s) {
|
||||||
|
final scale = s < 0.85 ? 0.85 : s;
|
||||||
|
final session = ffi ?? gFFI;
|
||||||
|
// compute overlay position
|
||||||
|
final screenW = MediaQuery.of(context).size.width;
|
||||||
|
final screenH = MediaQuery.of(context).size.height;
|
||||||
|
const double overlayW = 200;
|
||||||
|
const double overlayH = 45;
|
||||||
|
final left = (screenW - overlayW * scale) / 2;
|
||||||
|
final top = screenH - (overlayH + 80) * scale;
|
||||||
|
position.value = Offset(left, top);
|
||||||
|
return DraggableMobileActions(
|
||||||
|
scale: scale,
|
||||||
|
position: position,
|
||||||
|
width: overlayW,
|
||||||
|
height: overlayH,
|
||||||
|
onBackPressed: () => session.inputModel.tap(MouseButtons.right),
|
||||||
|
onHomePressed: () => session.inputModel.tap(MouseButtons.wheel),
|
||||||
|
onRecentPressed: () async {
|
||||||
|
session.inputModel.sendMouse('down', MouseButtons.wheel);
|
||||||
|
await Future.delayed(const Duration(milliseconds: 500));
|
||||||
|
session.inputModel.sendMouse('up', MouseButtons.wheel);
|
||||||
|
},
|
||||||
|
onHidePressed: onHide,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
return OverlayEntry(builder: (context) {
|
||||||
|
if (isDesktop) {
|
||||||
|
final c = Provider.of<CanvasModel>(context);
|
||||||
|
return makeMobileActions(context, c.scale * 2.0);
|
||||||
|
} else {
|
||||||
|
return makeMobileActions(globalKey.currentContext!, 1.0);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
void showToast(String text, {Duration timeout = const Duration(seconds: 3)}) {
|
void showToast(String text, {Duration timeout = const Duration(seconds: 3)}) {
|
||||||
final overlayState = globalKey.currentState?.overlay;
|
final overlayState = globalKey.currentState?.overlay;
|
||||||
if (overlayState == null) return;
|
if (overlayState == null) return;
|
||||||
@ -3255,7 +3275,8 @@ Widget buildPresetPasswordWarning() {
|
|||||||
translate("Security Alert"),
|
translate("Security Alert"),
|
||||||
style: TextStyle(
|
style: TextStyle(
|
||||||
color: Colors.red,
|
color: Colors.red,
|
||||||
fontSize: 18, // https://github.com/rustdesk/rustdesk-server-pro/issues/261
|
fontSize:
|
||||||
|
18, // https://github.com/rustdesk/rustdesk-server-pro/issues/261
|
||||||
fontWeight: FontWeight.bold,
|
fontWeight: FontWeight.bold,
|
||||||
),
|
),
|
||||||
)).paddingOnly(bottom: 8),
|
)).paddingOnly(bottom: 8),
|
||||||
|
@ -45,7 +45,7 @@ class DraggableChatWindow extends StatelessWidget {
|
|||||||
)
|
)
|
||||||
: Draggable(
|
: Draggable(
|
||||||
checkKeyboard: true,
|
checkKeyboard: true,
|
||||||
position: position,
|
position: SimpleWrapper(position),
|
||||||
width: width,
|
width: width,
|
||||||
height: height,
|
height: height,
|
||||||
chatModel: chatModel,
|
chatModel: chatModel,
|
||||||
@ -166,15 +166,17 @@ class CustomAppBar extends StatelessWidget implements PreferredSizeWidget {
|
|||||||
/// floating buttons of back/home/recent actions for android
|
/// floating buttons of back/home/recent actions for android
|
||||||
class DraggableMobileActions extends StatelessWidget {
|
class DraggableMobileActions extends StatelessWidget {
|
||||||
DraggableMobileActions(
|
DraggableMobileActions(
|
||||||
{this.position = Offset.zero,
|
{this.onBackPressed,
|
||||||
this.onBackPressed,
|
|
||||||
this.onRecentPressed,
|
this.onRecentPressed,
|
||||||
this.onHomePressed,
|
this.onHomePressed,
|
||||||
this.onHidePressed,
|
this.onHidePressed,
|
||||||
|
required this.position,
|
||||||
required this.width,
|
required this.width,
|
||||||
required this.height});
|
required this.height,
|
||||||
|
required this.scale});
|
||||||
|
|
||||||
final Offset position;
|
final double scale;
|
||||||
|
final SimpleWrapper<Offset> position;
|
||||||
final double width;
|
final double width;
|
||||||
final double height;
|
final double height;
|
||||||
final VoidCallback? onBackPressed;
|
final VoidCallback? onBackPressed;
|
||||||
@ -186,8 +188,8 @@ class DraggableMobileActions extends StatelessWidget {
|
|||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Draggable(
|
return Draggable(
|
||||||
position: position,
|
position: position,
|
||||||
width: width,
|
width: scale * width,
|
||||||
height: height,
|
height: scale * height,
|
||||||
builder: (_, onPanUpdate) {
|
builder: (_, onPanUpdate) {
|
||||||
return GestureDetector(
|
return GestureDetector(
|
||||||
onPanUpdate: onPanUpdate,
|
onPanUpdate: onPanUpdate,
|
||||||
@ -197,7 +199,8 @@ class DraggableMobileActions extends StatelessWidget {
|
|||||||
child: Container(
|
child: Container(
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
color: MyTheme.accent.withOpacity(0.4),
|
color: MyTheme.accent.withOpacity(0.4),
|
||||||
borderRadius: BorderRadius.all(Radius.circular(15))),
|
borderRadius:
|
||||||
|
BorderRadius.all(Radius.circular(15 * scale))),
|
||||||
child: Row(
|
child: Row(
|
||||||
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
||||||
children: [
|
children: [
|
||||||
@ -205,17 +208,20 @@ class DraggableMobileActions extends StatelessWidget {
|
|||||||
color: Colors.white,
|
color: Colors.white,
|
||||||
onPressed: onBackPressed,
|
onPressed: onBackPressed,
|
||||||
splashRadius: kDesktopIconButtonSplashRadius,
|
splashRadius: kDesktopIconButtonSplashRadius,
|
||||||
icon: const Icon(Icons.arrow_back)),
|
icon: const Icon(Icons.arrow_back),
|
||||||
|
iconSize: 24 * scale),
|
||||||
IconButton(
|
IconButton(
|
||||||
color: Colors.white,
|
color: Colors.white,
|
||||||
onPressed: onHomePressed,
|
onPressed: onHomePressed,
|
||||||
splashRadius: kDesktopIconButtonSplashRadius,
|
splashRadius: kDesktopIconButtonSplashRadius,
|
||||||
icon: const Icon(Icons.home)),
|
icon: const Icon(Icons.home),
|
||||||
|
iconSize: 24 * scale),
|
||||||
IconButton(
|
IconButton(
|
||||||
color: Colors.white,
|
color: Colors.white,
|
||||||
onPressed: onRecentPressed,
|
onPressed: onRecentPressed,
|
||||||
splashRadius: kDesktopIconButtonSplashRadius,
|
splashRadius: kDesktopIconButtonSplashRadius,
|
||||||
icon: const Icon(Icons.more_horiz)),
|
icon: const Icon(Icons.more_horiz),
|
||||||
|
iconSize: 24 * scale),
|
||||||
const VerticalDivider(
|
const VerticalDivider(
|
||||||
width: 0,
|
width: 0,
|
||||||
thickness: 2,
|
thickness: 2,
|
||||||
@ -226,7 +232,8 @@ class DraggableMobileActions extends StatelessWidget {
|
|||||||
color: Colors.white,
|
color: Colors.white,
|
||||||
onPressed: onHidePressed,
|
onPressed: onHidePressed,
|
||||||
splashRadius: kDesktopIconButtonSplashRadius,
|
splashRadius: kDesktopIconButtonSplashRadius,
|
||||||
icon: const Icon(Icons.keyboard_arrow_down)),
|
icon: const Icon(Icons.keyboard_arrow_down),
|
||||||
|
iconSize: 24 * scale),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
)));
|
)));
|
||||||
@ -235,11 +242,11 @@ class DraggableMobileActions extends StatelessWidget {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class Draggable extends StatefulWidget {
|
class Draggable extends StatefulWidget {
|
||||||
const Draggable(
|
Draggable(
|
||||||
{Key? key,
|
{Key? key,
|
||||||
this.checkKeyboard = false,
|
this.checkKeyboard = false,
|
||||||
this.checkScreenSize = false,
|
this.checkScreenSize = false,
|
||||||
this.position = Offset.zero,
|
required this.position,
|
||||||
required this.width,
|
required this.width,
|
||||||
required this.height,
|
required this.height,
|
||||||
this.chatModel,
|
this.chatModel,
|
||||||
@ -248,7 +255,7 @@ class Draggable extends StatefulWidget {
|
|||||||
|
|
||||||
final bool checkKeyboard;
|
final bool checkKeyboard;
|
||||||
final bool checkScreenSize;
|
final bool checkScreenSize;
|
||||||
final Offset position;
|
final SimpleWrapper<Offset> position;
|
||||||
final double width;
|
final double width;
|
||||||
final double height;
|
final double height;
|
||||||
final ChatModel? chatModel;
|
final ChatModel? chatModel;
|
||||||
@ -259,7 +266,6 @@ class Draggable extends StatefulWidget {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class _DraggableState extends State<Draggable> {
|
class _DraggableState extends State<Draggable> {
|
||||||
late Offset _position;
|
|
||||||
late ChatModel? _chatModel;
|
late ChatModel? _chatModel;
|
||||||
bool _keyboardVisible = false;
|
bool _keyboardVisible = false;
|
||||||
double _saveHeight = 0;
|
double _saveHeight = 0;
|
||||||
@ -268,35 +274,36 @@ class _DraggableState extends State<Draggable> {
|
|||||||
@override
|
@override
|
||||||
void initState() {
|
void initState() {
|
||||||
super.initState();
|
super.initState();
|
||||||
_position = widget.position;
|
|
||||||
_chatModel = widget.chatModel;
|
_chatModel = widget.chatModel;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get position => widget.position.value;
|
||||||
|
|
||||||
void onPanUpdate(DragUpdateDetails d) {
|
void onPanUpdate(DragUpdateDetails d) {
|
||||||
final offset = d.delta;
|
final offset = d.delta;
|
||||||
final size = MediaQuery.of(context).size;
|
final size = MediaQuery.of(context).size;
|
||||||
double x = 0;
|
double x = 0;
|
||||||
double y = 0;
|
double y = 0;
|
||||||
|
|
||||||
if (_position.dx + offset.dx + widget.width > size.width) {
|
if (position.dx + offset.dx + widget.width > size.width) {
|
||||||
x = size.width - widget.width;
|
x = size.width - widget.width;
|
||||||
} else if (_position.dx + offset.dx < 0) {
|
} else if (position.dx + offset.dx < 0) {
|
||||||
x = 0;
|
x = 0;
|
||||||
} else {
|
} else {
|
||||||
x = _position.dx + offset.dx;
|
x = position.dx + offset.dx;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (_position.dy + offset.dy + widget.height > size.height) {
|
if (position.dy + offset.dy + widget.height > size.height) {
|
||||||
y = size.height - widget.height;
|
y = size.height - widget.height;
|
||||||
} else if (_position.dy + offset.dy < 0) {
|
} else if (position.dy + offset.dy < 0) {
|
||||||
y = 0;
|
y = 0;
|
||||||
} else {
|
} else {
|
||||||
y = _position.dy + offset.dy;
|
y = position.dy + offset.dy;
|
||||||
}
|
}
|
||||||
setState(() {
|
setState(() {
|
||||||
_position = Offset(x, y);
|
widget.position.value = Offset(x, y);
|
||||||
});
|
});
|
||||||
_chatModel?.setChatWindowPosition(_position);
|
_chatModel?.setChatWindowPosition(position);
|
||||||
}
|
}
|
||||||
|
|
||||||
checkScreenSize() {}
|
checkScreenSize() {}
|
||||||
@ -307,13 +314,13 @@ class _DraggableState extends State<Draggable> {
|
|||||||
|
|
||||||
// save
|
// save
|
||||||
if (!_keyboardVisible && currentVisible) {
|
if (!_keyboardVisible && currentVisible) {
|
||||||
_saveHeight = _position.dy;
|
_saveHeight = position.dy;
|
||||||
}
|
}
|
||||||
|
|
||||||
// reset
|
// reset
|
||||||
if (_lastBottomHeight > 0 && bottomHeight == 0) {
|
if (_lastBottomHeight > 0 && bottomHeight == 0) {
|
||||||
setState(() {
|
setState(() {
|
||||||
_position = Offset(_position.dx, _saveHeight);
|
widget.position.value = Offset(position.dx, _saveHeight);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -321,10 +328,10 @@ class _DraggableState extends State<Draggable> {
|
|||||||
if (_keyboardVisible && currentVisible) {
|
if (_keyboardVisible && currentVisible) {
|
||||||
final sumHeight = bottomHeight + widget.height;
|
final sumHeight = bottomHeight + widget.height;
|
||||||
final contextHeight = MediaQuery.of(context).size.height;
|
final contextHeight = MediaQuery.of(context).size.height;
|
||||||
if (sumHeight + _position.dy > contextHeight) {
|
if (sumHeight + position.dy > contextHeight) {
|
||||||
final y = contextHeight - sumHeight;
|
final y = contextHeight - sumHeight;
|
||||||
setState(() {
|
setState(() {
|
||||||
_position = Offset(_position.dx, y);
|
widget.position.value = Offset(position.dx, y);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -343,8 +350,8 @@ class _DraggableState extends State<Draggable> {
|
|||||||
}
|
}
|
||||||
return Stack(children: [
|
return Stack(children: [
|
||||||
Positioned(
|
Positioned(
|
||||||
top: _position.dy,
|
top: position.dy,
|
||||||
left: _position.dx,
|
left: position.dx,
|
||||||
width: widget.width,
|
width: widget.width,
|
||||||
height: widget.height,
|
height: widget.height,
|
||||||
child: widget.builder(context, onPanUpdate))
|
child: widget.builder(context, onPanUpdate))
|
||||||
|
@ -307,8 +307,30 @@ class _RemotePageState extends State<RemotePage>
|
|||||||
_ffi.ffiModel.waitForFirstImage.isTrue
|
_ffi.ffiModel.waitForFirstImage.isTrue
|
||||||
? emptyOverlay()
|
? emptyOverlay()
|
||||||
: () {
|
: () {
|
||||||
_ffi.ffiModel.tryShowAndroidActionsOverlay();
|
if (!_ffi.ffiModel.isPeerAndroid) {
|
||||||
return Offstage();
|
return Offstage();
|
||||||
|
} else {
|
||||||
|
if (_ffi.connType == ConnType.defaultConn &&
|
||||||
|
_ffi.ffiModel.permissions['keyboard'] != false) {
|
||||||
|
Timer(
|
||||||
|
Duration(milliseconds: 10),
|
||||||
|
() => _ffi.dialogManager
|
||||||
|
.mobileActionsOverlayVisible.value = true);
|
||||||
|
}
|
||||||
|
return Obx(() => Offstage(
|
||||||
|
offstage: _ffi.dialogManager
|
||||||
|
.mobileActionsOverlayVisible.isFalse,
|
||||||
|
child: Overlay(initialEntries: [
|
||||||
|
makeMobileActionsOverlayEntry(
|
||||||
|
() => _ffi
|
||||||
|
.dialogManager
|
||||||
|
.mobileActionsOverlayVisible
|
||||||
|
.value = false,
|
||||||
|
ffi: _ffi,
|
||||||
|
)
|
||||||
|
]),
|
||||||
|
));
|
||||||
|
}
|
||||||
}(),
|
}(),
|
||||||
// Use Overlay to enable rebuild every time on menu button click.
|
// Use Overlay to enable rebuild every time on menu button click.
|
||||||
_ffi.ffiModel.pi.isSet.isTrue
|
_ffi.ffiModel.pi.isSet.isTrue
|
||||||
|
@ -588,7 +588,7 @@ class _MobileActionMenu extends StatelessWidget {
|
|||||||
assetName: 'assets/actions_mobile.svg',
|
assetName: 'assets/actions_mobile.svg',
|
||||||
tooltip: 'Mobile Actions',
|
tooltip: 'Mobile Actions',
|
||||||
onPressed: () =>
|
onPressed: () =>
|
||||||
ffi.dialogManager.toggleMobileActionsOverlay(ffi: ffi),
|
ffi.dialogManager.mobileActionsOverlayVisible.toggle(),
|
||||||
color: ffi.dialogManager.mobileActionsOverlayVisible.isTrue
|
color: ffi.dialogManager.mobileActionsOverlayVisible.isTrue
|
||||||
? _ToolbarTheme.blueColor
|
? _ToolbarTheme.blueColor
|
||||||
: _ToolbarTheme.inactiveColor,
|
: _ToolbarTheme.inactiveColor,
|
||||||
|
Loading…
x
Reference in New Issue
Block a user