fix web peer card tap (#9622)

Signed-off-by: 21pages <sunboeasy@gmail.com>
This commit is contained in:
21pages 2024-10-11 16:35:15 +08:00 committed by GitHub
parent 844b853074
commit cde7620eda
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 94 additions and 91 deletions

View File

@ -58,27 +58,33 @@ class _PeerCardState extends State<_PeerCard>
stateGlobal.isPortrait.isTrue ? _buildPortrait() : _buildLandscape()); stateGlobal.isPortrait.isTrue ? _buildPortrait() : _buildLandscape());
} }
Widget gestureDetector({required Widget child}) {
final PeerTabModel peerTabModel = Provider.of(context);
final peer = super.widget.peer;
return GestureDetector(
onDoubleTap: peerTabModel.multiSelectionMode || peerTabModel.isShiftDown
? null
: () => widget.connect(context, peer.id),
onTap: () {
if (peerTabModel.multiSelectionMode) {
peerTabModel.select(peer);
} else {
if (isMobile) {
widget.connect(context, peer.id);
} else {
peerTabModel.select(peer);
}
}
},
onLongPress: () => peerTabModel.select(peer),
child: child);
}
Widget _buildPortrait() { Widget _buildPortrait() {
final peer = super.widget.peer; final peer = super.widget.peer;
final PeerTabModel peerTabModel = Provider.of(context);
return Card( return Card(
margin: EdgeInsets.symmetric(horizontal: 2), margin: EdgeInsets.symmetric(horizontal: 2),
child: GestureDetector( child: gestureDetector(
onTap: () {
if (peerTabModel.multiSelectionMode) {
peerTabModel.select(peer);
} else {
if (!isWebDesktop) {
connectInPeerTab(context, peer, widget.tab);
}
}
},
onDoubleTap: isWebDesktop
? () => connectInPeerTab(context, peer, widget.tab)
: null,
onLongPress: () {
peerTabModel.select(peer);
},
child: Container( child: Container(
padding: EdgeInsets.only(left: 12, top: 8, bottom: 8), padding: EdgeInsets.only(left: 12, top: 8, bottom: 8),
child: _buildPeerTile(context, peer, null)), child: _buildPeerTile(context, peer, null)),
@ -86,7 +92,6 @@ class _PeerCardState extends State<_PeerCard>
} }
Widget _buildLandscape() { Widget _buildLandscape() {
final PeerTabModel peerTabModel = Provider.of(context);
final peer = super.widget.peer; final peer = super.widget.peer;
var deco = Rx<BoxDecoration?>( var deco = Rx<BoxDecoration?>(
BoxDecoration( BoxDecoration(
@ -115,30 +120,21 @@ class _PeerCardState extends State<_PeerCard>
), ),
); );
}, },
child: GestureDetector( child: gestureDetector(
onDoubleTap:
peerTabModel.multiSelectionMode || peerTabModel.isShiftDown
? null
: () => widget.connect(context, peer.id),
onTap: () => peerTabModel.select(peer),
onLongPress: () => peerTabModel.select(peer),
child: Obx(() => peerCardUiType.value == PeerUiType.grid child: Obx(() => peerCardUiType.value == PeerUiType.grid
? _buildPeerCard(context, peer, deco) ? _buildPeerCard(context, peer, deco)
: _buildPeerTile(context, peer, deco))), : _buildPeerTile(context, peer, deco))),
); );
} }
Widget _buildPeerTile( makeChild(bool isPortrait, Peer peer) {
BuildContext context, Peer peer, Rx<BoxDecoration?>? deco) {
hideUsernameOnCard ??=
bind.mainGetBuildinOption(key: kHideUsernameOnCard) == 'Y';
final name = hideUsernameOnCard == true final name = hideUsernameOnCard == true
? peer.hostname ? peer.hostname
: '${peer.username}${peer.username.isNotEmpty && peer.hostname.isNotEmpty ? '@' : ''}${peer.hostname}'; : '${peer.username}${peer.username.isNotEmpty && peer.hostname.isNotEmpty ? '@' : ''}${peer.hostname}';
final greyStyle = TextStyle( final greyStyle = TextStyle(
fontSize: 11, fontSize: 11,
color: Theme.of(context).textTheme.titleLarge?.color?.withOpacity(0.6)); color: Theme.of(context).textTheme.titleLarge?.color?.withOpacity(0.6));
makeChild(bool isPortrait) => Row( return Row(
mainAxisSize: MainAxisSize.max, mainAxisSize: MainAxisSize.max,
children: [ children: [
Container( Container(
@ -210,6 +206,12 @@ class _PeerCardState extends State<_PeerCard>
) )
], ],
); );
}
Widget _buildPeerTile(
BuildContext context, Peer peer, Rx<BoxDecoration?>? deco) {
hideUsernameOnCard ??=
bind.mainGetBuildinOption(key: kHideUsernameOnCard) == 'Y';
final colors = _frontN(peer.tags, 25) final colors = _frontN(peer.tags, 25)
.map((e) => gFFI.abModel.getCurrentAbTagColor(e)) .map((e) => gFFI.abModel.getCurrentAbTagColor(e))
.toList(); .toList();
@ -220,21 +222,22 @@ class _PeerCardState extends State<_PeerCard>
? '${translate('Tags')}: ${peer.tags.join(', ')}' ? '${translate('Tags')}: ${peer.tags.join(', ')}'
: '', : '',
child: Stack(children: [ child: Stack(children: [
Obx(() => deco == null Obx(
? makeChild(stateGlobal.isPortrait.isTrue) () => deco == null
: Container( ? makeChild(stateGlobal.isPortrait.isTrue, peer)
: Container(
foregroundDecoration: deco.value, foregroundDecoration: deco.value,
child: makeChild(stateGlobal.isPortrait.isTrue), child: makeChild(stateGlobal.isPortrait.isTrue, peer),
), ),
), ),
if (colors.isNotEmpty) if (colors.isNotEmpty)
Obx(()=> Positioned( Obx(() => Positioned(
top: 2, top: 2,
right: stateGlobal.isPortrait.isTrue ? 20 : 10, right: stateGlobal.isPortrait.isTrue ? 20 : 10,
child: CustomPaint( child: CustomPaint(
painter: TagPainter(radius: 3, colors: colors), painter: TagPainter(radius: 3, colors: colors),
), ),
)) ))
]), ]),
); );
} }
@ -1259,54 +1262,53 @@ void _rdpDialog(String id) async {
], ],
).marginOnly(bottom: isDesktop ? 8 : 0), ).marginOnly(bottom: isDesktop ? 8 : 0),
Obx(() => Row( Obx(() => Row(
children: [ children: [
stateGlobal.isPortrait.isFalse stateGlobal.isPortrait.isFalse
? ConstrainedBox( ? ConstrainedBox(
constraints: const BoxConstraints(minWidth: 140), constraints: const BoxConstraints(minWidth: 140),
child: Text( child: Text(
"${translate('Username')}:", "${translate('Username')}:",
textAlign: TextAlign.right, textAlign: TextAlign.right,
).marginOnly(right: 10)) ).marginOnly(right: 10))
: SizedBox.shrink(), : SizedBox.shrink(),
Expanded( Expanded(
child: TextField( child: TextField(
decoration: InputDecoration(
labelText: isDesktop
? null
: translate('Username')),
controller: userController,
),
),
],
).marginOnly(bottom: stateGlobal.isPortrait.isFalse ? 8 : 0)),
Obx(() => Row(
children: [
stateGlobal.isPortrait.isFalse
? ConstrainedBox(
constraints: const BoxConstraints(minWidth: 140),
child: Text(
"${translate('Password')}:",
textAlign: TextAlign.right,
).marginOnly(right: 10))
: SizedBox.shrink(),
Expanded(
child: Obx(() => TextField(
obscureText: secure.value,
maxLength: maxLength,
decoration: InputDecoration( decoration: InputDecoration(
labelText: isDesktop labelText:
? null isDesktop ? null : translate('Username')),
: translate('Password'), controller: userController,
suffixIcon: IconButton( ),
onPressed: () => secure.value = !secure.value, ),
icon: Icon(secure.value ],
? Icons.visibility_off ).marginOnly(bottom: stateGlobal.isPortrait.isFalse ? 8 : 0)),
: Icons.visibility))), Obx(() => Row(
controller: passwordController, children: [
)), stateGlobal.isPortrait.isFalse
), ? ConstrainedBox(
], constraints: const BoxConstraints(minWidth: 140),
)) child: Text(
"${translate('Password')}:",
textAlign: TextAlign.right,
).marginOnly(right: 10))
: SizedBox.shrink(),
Expanded(
child: Obx(() => TextField(
obscureText: secure.value,
maxLength: maxLength,
decoration: InputDecoration(
labelText:
isDesktop ? null : translate('Password'),
suffixIcon: IconButton(
onPressed: () =>
secure.value = !secure.value,
icon: Icon(secure.value
? Icons.visibility_off
: Icons.visibility))),
controller: passwordController,
)),
),
],
))
], ],
), ),
), ),

View File

@ -475,7 +475,8 @@ class _AppState extends State<App> with WidgetsBindingObserver {
: (context, child) { : (context, child) {
child = _keepScaleBuilder(context, child); child = _keepScaleBuilder(context, child);
child = botToastBuilder(context, child); child = botToastBuilder(context, child);
if (isDesktop && desktopType == DesktopType.main) { if ((isDesktop && desktopType == DesktopType.main) ||
isWebDesktop) {
child = keyListenerBuilder(context, child); child = keyListenerBuilder(context, child);
} }
if (isLinux) { if (isLinux) {

View File

@ -152,7 +152,7 @@ class PeerTabModel with ChangeNotifier {
// https://github.com/flutter/flutter/issues/101275#issuecomment-1604541700 // https://github.com/flutter/flutter/issues/101275#issuecomment-1604541700
// After onTap, the shift key should be pressed for a while when not in multiselection mode, // After onTap, the shift key should be pressed for a while when not in multiselection mode,
// because onTap is delayed when onDoubleTap is not null // because onTap is delayed when onDoubleTap is not null
if (isDesktop && !_isShiftDown) return; if ((isDesktop || isWebDesktop) && !_isShiftDown) return;
_multiSelectionMode = true; _multiSelectionMode = true;
} }
final cached = _currentTabCachedPeers.map((e) => e.id).toList(); final cached = _currentTabCachedPeers.map((e) => e.id).toList();