refact, show global displays' arrangement

Signed-off-by: fufesou <shuanglongchen@yeah.net>
This commit is contained in:
fufesou 2023-10-30 20:22:44 +08:00
parent fa046df923
commit 06dda24431
2 changed files with 88 additions and 48 deletions

View File

@ -580,6 +580,8 @@ class _MobileActionMenu extends StatelessWidget {
} }
} }
const _defaultButtonSize = Size(24.0, 18.0);
class _MonitorMenu extends StatelessWidget { class _MonitorMenu extends StatelessWidget {
final String id; final String id;
final FFI ffi; final FFI ffi;
@ -604,7 +606,7 @@ class _MonitorMenu extends StatelessWidget {
Widget buildMonitorMenu() { Widget buildMonitorMenu() {
return _IconSubmenuButton( return _IconSubmenuButton(
tooltip: 'Select Monitor', tooltip: 'Select Monitor',
icon: icon(), icon: icon(_defaultButtonSize),
ffi: ffi, ffi: ffi,
color: _ToolbarTheme.blueColor, color: _ToolbarTheme.blueColor,
hoverColor: _ToolbarTheme.hoverBlueColor, hoverColor: _ToolbarTheme.hoverBlueColor,
@ -644,26 +646,29 @@ class _MonitorMenu extends StatelessWidget {
child: Text(translate('Show displays as individual windows'))); child: Text(translate('Show displays as individual windows')));
} }
buildOneMonitorButton(i, curDisplay) => Text(
'${i + 1}',
style: TextStyle(
color: i == curDisplay
? _ToolbarTheme.blueColor
: _ToolbarTheme.inactiveColor,
fontSize: 12,
fontWeight: FontWeight.bold,
),
);
List<Widget> buildMonitorList(bool isMulti) { List<Widget> buildMonitorList(bool isMulti) {
final List<Widget> monitorList = []; final List<Widget> monitorList = [];
final pi = ffi.ffiModel.pi; final pi = ffi.ffiModel.pi;
getMonitorText(int i) {
if (i == kAllDisplayValue) {
if (pi.displays.length == 2) {
return '1|2';
} else {
return 'ALL';
}
} else {
return (i + 1).toString();
}
}
buildMonitorButton(int i) => Obx(() { buildMonitorButton(int i) => Obx(() {
RxInt display = CurrentDisplayState.find(id); RxInt display = CurrentDisplayState.find(id);
return _IconMenuButton( return _IconMenuButton(
tooltip: isMulti ? '' : '#${i + 1} monitor', tooltip: isMulti
? ''
: i == kAllDisplayValue
? 'all monitors'
: '#${i + 1} monitor',
hMargin: isMulti ? null : 6, hMargin: isMulti ? null : 6,
vMargin: isMulti ? null : 12, vMargin: isMulti ? null : 12,
topLevel: false, topLevel: false,
@ -685,18 +690,9 @@ class _MonitorMenu extends StatelessWidget {
colorFilter: colorFilter:
ColorFilter.mode(Colors.white, BlendMode.srcIn), ColorFilter.mode(Colors.white, BlendMode.srcIn),
), ),
Obx( i == kAllDisplayValue
() => Text( ? globalMonitorsWidget(_defaultButtonSize)
getMonitorText(i), : Obx(() => buildOneMonitorButton(i, display.value)),
style: TextStyle(
color: i == display.value
? _ToolbarTheme.blueColor
: _ToolbarTheme.inactiveColor,
fontSize: 12,
fontWeight: FontWeight.bold,
),
),
),
], ],
), ),
), ),
@ -713,30 +709,73 @@ class _MonitorMenu extends StatelessWidget {
return monitorList; return monitorList;
} }
icon() { globalMonitorsWidget(Size size) {
final pi = ffi.ffiModel.pi; final pi = ffi.ffiModel.pi;
return Stack( return Obx(() {
alignment: Alignment.center, RxInt display = CurrentDisplayState.find(id);
children: [ final rect = ffi.ffiModel.globalDisplaysRect();
SvgPicture.asset( if (rect == null) {
"assets/screen.svg", return Offstage();
colorFilter: ColorFilter.mode(Colors.white, BlendMode.srcIn), }
), final scaleX = size.width / rect.width;
Obx(() { final scaleY = size.height / rect.height;
RxInt display = CurrentDisplayState.find(id); final children = <Widget>[];
return Text( for (var i = 0; i < pi.displays.length; i++) {
'${display.value == kAllDisplayValue ? 'A' : '${display.value + 1}'}/${pi.displays.length}', final d = pi.displays[i];
style: const TextStyle( final fontSize = (d.width * scaleX < d.height * scaleY
color: _ToolbarTheme.blueColor, ? d.width * scaleX
fontSize: 8, : d.height * scaleY) *
fontWeight: FontWeight.bold, 0.75;
children.add(Positioned(
left: (d.x - rect.left) * scaleX,
top: (d.y - rect.top) * scaleY,
child: SizedBox(
width: d.width * scaleX,
height: d.height * scaleY,
child: Container(
decoration: BoxDecoration(
border: Border.all(
color: Colors.grey,
width: 1.0,
),
borderRadius: BorderRadius.circular(1.0),
),
child: Center(
child: Text(
'${i + 1}',
style: TextStyle(
color: display.value == i
? _ToolbarTheme.blueColor
: _ToolbarTheme.inactiveColor,
fontSize: fontSize,
fontWeight: FontWeight.bold,
),
)),
), ),
); ),
}), ));
], }
); return Container(
width: size.width,
height: size.height,
child: Stack(
children: children,
),
);
});
} }
icon(Size size) => Stack(
alignment: Alignment.center,
children: [
SvgPicture.asset(
"assets/screen.svg",
colorFilter: ColorFilter.mode(Colors.white, BlendMode.srcIn),
),
globalMonitorsWidget(size),
],
);
onPressed(int i, PeerInfo pi) { onPressed(int i, PeerInfo pi) {
_menuDismissCallback(ffi); _menuDismissCallback(ffi);
RxInt display = CurrentDisplayState.find(id); RxInt display = CurrentDisplayState.find(id);

View File

@ -138,8 +138,9 @@ class FfiModel with ChangeNotifier {
sessionId = parent.target!.sessionId; sessionId = parent.target!.sessionId;
} }
Rect? displaysRect() { Rect? globalDisplaysRect() => _getDisplaysRect(_pi.displays);
final displays = _pi.getCurDisplays(); Rect? displaysRect() => _getDisplaysRect(_pi.getCurDisplays());
Rect? _getDisplaysRect(List<Display> displays) {
if (displays.isEmpty) { if (displays.isEmpty) {
return null; return null;
} }