lee/rustdesk
1
0
Fork 0
mirror of https://github.com/rustdesk/rustdesk.git synced 2025-12-13 03:28:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: move peer_widget / peercard_widget / peer_tab_page & move connect

Browse Source 
new address_book class; add peer tab onPageChanged

android settings_page.dart add dark mode

opt peer_tab_page search bar, add mobile peer_tab support
This commit is contained in:
csf
2022-09-19 20:26:39 +08:00
parent 0c407994cd
commit 9e6e842247
12 changed files with 927 additions and 868 deletions
Download Patch File Download Diff File Expand all files Collapse all files

415
flutter/lib/common/widgets/address_book.dart Normal file
View File

@@ -0,0 +1,415 @@
import 'package:contextmenu/contextmenu.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hbb/common/widgets/peer_widget.dart';
import 'package:flutter_hbb/models/ab_model.dart';
import 'package:get/get.dart';
import 'package:provider/provider.dart';
import '../../common.dart';
import '../../desktop/pages/desktop_home_page.dart';
import '../../models/platform_model.dart';
class AddressBook extends StatefulWidget {
const AddressBook({Key? key}) : super(key: key);
@override
State<StatefulWidget> createState() {
return _AddressBookState();
}
}
class _AddressBookState extends State<AddressBook> {
@override
void initState() {
super.initState();
WidgetsBinding.instance.addPostFrameCallback((_) => gFFI.abModel.getAb());
}
@override
Widget build(BuildContext context) => FutureBuilder<Widget>(
future: buildAddressBook(context),
builder: (context, snapshot) {
if (snapshot.hasData) {
return snapshot.data!;
} else {
return const Offstage();
}
});
handleLogin() {
loginDialog().then((success) {
if (success) {
setState(() {});
}
});
}
Future<Widget> buildAddressBook(BuildContext context) async {
final token = await bind.mainGetLocalOption(key: 'access_token');
if (token.trim().isEmpty) {
return Center(
child: InkWell(
onTap: handleLogin,
child: Text(
translate("Login"),
style: const TextStyle(decoration: TextDecoration.underline),
),
),
);
}
final model = gFFI.abModel;
return FutureBuilder(
future: model.getAb(),
builder: (context, snapshot) {
if (snapshot.hasData) {
return _buildAddressBook(context);
} else if (snapshot.hasError) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(translate("${snapshot.error}")),
TextButton(
onPressed: () {
setState(() {});
},
child: Text(translate("Retry")))
],
);
} else {
if (model.abLoading) {
return const Center(
child: CircularProgressIndicator(),
);
} else if (model.abError.isNotEmpty) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(translate(model.abError)),
TextButton(
onPressed: () {
setState(() {});
},
child: Text(translate("Retry")))
],
),
);
} else {
return const Offstage();
}
}
});
}
Widget _buildAddressBook(BuildContext context) {
return Consumer<AbModel>(
builder: (context, model, child) => Row(
children: [
Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
side: const BorderSide(color: MyTheme.grayBg)),
child: Container(
width: 200,
height: double.infinity,
padding: const EdgeInsets.symmetric(
horizontal: 12.0, vertical: 8.0),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(translate('Tags')),
InkWell(
child: PopupMenuButton(
itemBuilder: (context) => [
PopupMenuItem(
value: 'add-id',
child: Text(translate("Add ID")),
),
PopupMenuItem(
value: 'add-tag',
child: Text(translate("Add Tag")),
),
PopupMenuItem(
value: 'unset-all-tag',
child: Text(
translate("Unselect all tags")),
),
],
onSelected: handleAbOp,
child: const Icon(Icons.more_vert_outlined)),
)
],
),
Expanded(
child: Container(
width: double.infinity,
height: double.infinity,
decoration: BoxDecoration(
border: Border.all(color: MyTheme.darkGray)),
child: Obx(
() => Wrap(
children: gFFI.abModel.tags
.map((e) =>
buildTag(e, gFFI.abModel.selectedTags,
onTap: () {
//
if (gFFI.abModel.selectedTags
.contains(e)) {
gFFI.abModel.selectedTags.remove(e);
} else {
gFFI.abModel.selectedTags.add(e);
}
}))
.toList(),
),
),
).marginSymmetric(vertical: 8.0),
)
],
),
),
).marginOnly(right: 8.0),
Expanded(
child: Align(
alignment: Alignment.topLeft,
child: AddressBookPeerWidget()),
)
],
));
}
Widget buildTag(String tagName, RxList<dynamic> rxTags, {Function()? onTap}) {
return ContextMenuArea(
width: 100,
builder: (context) => [
ListTile(
title: Text(translate("Delete")),
onTap: () {
gFFI.abModel.deleteTag(tagName);
gFFI.abModel.updateAb();
Future.delayed(Duration.zero, () => Get.back());
},
)
],
child: GestureDetector(
onTap: onTap,
child: Obx(
() => Container(
decoration: BoxDecoration(
color: rxTags.contains(tagName) ? Colors.blue : null,
border: Border.all(color: MyTheme.darkGray),
borderRadius: BorderRadius.circular(10)),
margin: const EdgeInsets.symmetric(horizontal: 4.0, vertical: 8.0),
padding: const EdgeInsets.symmetric(vertical: 2.0, horizontal: 8.0),
child: Text(
tagName,
style: TextStyle(
color: rxTags.contains(tagName) ? MyTheme.white : null),
),
),
),
),
);
}
/// tag operation
void handleAbOp(String value) {
if (value == 'add-id') {
abAddId();
} else if (value == 'add-tag') {
abAddTag();
} else if (value == 'unset-all-tag') {
gFFI.abModel.unsetSelectedTags();
}
}
void abAddId() async {
var field = "";
var msg = "";
var isInProgress = false;
TextEditingController controller = TextEditingController(text: field);
gFFI.dialogManager.show((setState, close) {
submit() async {
setState(() {
msg = "";
isInProgress = true;
});
field = controller.text.trim();
if (field.isEmpty) {
// pass
} else {
final ids = field.trim().split(RegExp(r"[\s,;\n]+"));
field = ids.join(',');
for (final newId in ids) {
if (gFFI.abModel.idContainBy(newId)) {
continue;
}
gFFI.abModel.addId(newId);
}
await gFFI.abModel.updateAb();
this.setState(() {});
// final currentPeers
}
close();
}
return CustomAlertDialog(
title: Text(translate("Add ID")),
content: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(translate("whitelist_sep")),
const SizedBox(
height: 8.0,
),
Row(
children: [
Expanded(
child: TextField(
maxLines: null,
decoration: InputDecoration(
border: const OutlineInputBorder(),
errorText: msg.isEmpty ? null : translate(msg),
),
controller: controller,
focusNode: FocusNode()..requestFocus()),
),
],
),
const SizedBox(
height: 4.0,
),
Offstage(
offstage: !isInProgress, child: const LinearProgressIndicator())
],
),
actions: [
TextButton(onPressed: close, child: Text(translate("Cancel"))),
TextButton(onPressed: submit, child: Text(translate("OK"))),
],
onSubmit: submit,
onCancel: close,
);
});
}
void abAddTag() async {
var field = "";
var msg = "";
var isInProgress = false;
TextEditingController controller = TextEditingController(text: field);
gFFI.dialogManager.show((setState, close) {
submit() async {
setState(() {
msg = "";
isInProgress = true;
});
field = controller.text.trim();
if (field.isEmpty) {
// pass
} else {
final tags = field.trim().split(RegExp(r"[\s,;\n]+"));
field = tags.join(',');
for (final tag in tags) {
gFFI.abModel.addTag(tag);
}
await gFFI.abModel.updateAb();
// final currentPeers
}
close();
}
return CustomAlertDialog(
title: Text(translate("Add Tag")),
content: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(translate("whitelist_sep")),
const SizedBox(
height: 8.0,
),
Row(
children: [
Expanded(
child: TextField(
maxLines: null,
decoration: InputDecoration(
border: const OutlineInputBorder(),
errorText: msg.isEmpty ? null : translate(msg),
),
controller: controller,
focusNode: FocusNode()..requestFocus(),
),
),
],
),
const SizedBox(
height: 4.0,
),
Offstage(
offstage: !isInProgress, child: const LinearProgressIndicator())
],
),
actions: [
TextButton(onPressed: close, child: Text(translate("Cancel"))),
TextButton(onPressed: submit, child: Text(translate("OK"))),
],
onSubmit: submit,
onCancel: close,
);
});
}
void abEditTag(String id) {
var isInProgress = false;
final tags = List.of(gFFI.abModel.tags);
var selectedTag = gFFI.abModel.getPeerTags(id).obs;
gFFI.dialogManager.show((setState, close) {
submit() async {
setState(() {
isInProgress = true;
});
gFFI.abModel.changeTagForPeer(id, selectedTag);
await gFFI.abModel.updateAb();
close();
}
return CustomAlertDialog(
title: Text(translate("Edit Tag")),
content: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
padding:
const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
child: Wrap(
children: tags
.map((e) => buildTag(e, selectedTag, onTap: () {
if (selectedTag.contains(e)) {
selectedTag.remove(e);
} else {
selectedTag.add(e);
}
}))
.toList(growable: false),
),
),
Offstage(
offstage: !isInProgress, child: const LinearProgressIndicator())
],
),
actions: [
TextButton(onPressed: close, child: Text(translate("Cancel"))),
TextButton(onPressed: submit, child: Text(translate("OK"))),
],
onSubmit: submit,
onCancel: close,
);
});
}
}

271
flutter/lib/common/widgets/peer_tab_page.dart Normal file
View File

@@ -0,0 +1,271 @@
import 'package:flutter/material.dart';
import 'package:flutter_hbb/common/widgets/peer_widget.dart';
import 'package:flutter_hbb/common/widgets/peercard_widget.dart';
import 'package:flutter_hbb/consts.dart';
import 'package:get/get.dart';
import '../../common.dart';
import '../../models/platform_model.dart';
class PeerTabPage extends StatefulWidget {
final List<String> tabs;
final List<Widget> children;
const PeerTabPage({required this.tabs, required this.children, Key? key})
: super(key: key);
@override
State<PeerTabPage> createState() => _PeerTabPageState();
}
class _PeerTabPageState extends State<PeerTabPage>
with SingleTickerProviderStateMixin {
late final PageController _pageController = PageController();
final RxInt _tabIndex = 0.obs;
@override
void initState() {
super.initState();
}
// hard code for now
void _handleTabSelection(int index) {
// reset search text
peerSearchText.value = "";
peerSearchTextController.clear();
_tabIndex.value = index;
_pageController.jumpToPage(index);
switch (index) {
case 0:
bind.mainLoadRecentPeers();
break;
case 1:
bind.mainLoadFavPeers();
break;
case 2:
bind.mainDiscover();
break;
case 3:
gFFI.abModel.getAb();
break;
}
}
@override
void dispose() {
_pageController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Column(
textBaseline: TextBaseline.ideographic,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: 28,
child: Container(
constraints: isDesktop ? null : kMobilePageConstraints,
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Expanded(child: _createTabBar(context)),
const SizedBox(width: 10),
const PeerSearchBar(),
Offstage(
offstage: !isDesktop,
child: _createPeerViewTypeSwitch(context)
.marginOnly(left: 13)),
],
)),
),
_createTabBarView(),
],
);
}
Widget _createTabBar(BuildContext context) {
return ListView(
scrollDirection: Axis.horizontal,
shrinkWrap: true,
controller: ScrollController(),
children: super.widget.tabs.asMap().entries.map((t) {
return Obx(() => GestureDetector(
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 8),
decoration: BoxDecoration(
color: _tabIndex.value == t.key
? MyTheme.color(context).bg
: null,
borderRadius: BorderRadius.circular(2),
),
child: Align(
alignment: Alignment.center,
child: Text(
t.value,
textAlign: TextAlign.center,
style: TextStyle(
height: 1,
fontSize: 14,
color: _tabIndex.value == t.key
? MyTheme.color(context).text
: MyTheme.color(context).lightText),
),
)),
onTap: () => _handleTabSelection(t.key),
));
}).toList());
}
Widget _createTabBarView() {
final verticalMargin = isDesktop ? 12.0 : 6.0;
return Expanded(
child: PageView(
physics: const BouncingScrollPhysics(),
controller: _pageController,
children: super.widget.children,
onPageChanged: (to) => _tabIndex.value = to)
.marginSymmetric(vertical: verticalMargin));
}
Widget _createPeerViewTypeSwitch(BuildContext context) {
final activeDeco = BoxDecoration(color: MyTheme.color(context).bg);
return Row(
children: [
Obx(
() => Container(
padding: const EdgeInsets.all(4.0),
decoration:
peerCardUiType.value == PeerUiType.grid ? activeDeco : null,
child: InkWell(
onTap: () {
peerCardUiType.value = PeerUiType.grid;
},
child: Icon(
Icons.grid_view_rounded,
size: 18,
color: peerCardUiType.value == PeerUiType.grid
? MyTheme.color(context).text
: MyTheme.color(context).lightText,
)),
),
),
Obx(
() => Container(
padding: const EdgeInsets.all(4.0),
decoration:
peerCardUiType.value == PeerUiType.list ? activeDeco : null,
child: InkWell(
onTap: () {
peerCardUiType.value = PeerUiType.list;
},
child: Icon(
Icons.list,
size: 18,
color: peerCardUiType.value == PeerUiType.list
? MyTheme.color(context).text
: MyTheme.color(context).lightText,
)),
),
),
],
);
}
}
class PeerSearchBar extends StatefulWidget {
const PeerSearchBar({Key? key}) : super(key: key);
@override
State<StatefulWidget> createState() => _PeerSearchBarState();
}
class _PeerSearchBarState extends State<PeerSearchBar> {
var drawer = false;
@override
Widget build(BuildContext context) {
return drawer
? _buildSearchBar()
: IconButton(
alignment: Alignment.centerRight,
padding: const EdgeInsets.only(right: 2),
onPressed: () {
setState(() {
drawer = true;
});
},
icon: const Icon(
Icons.search_rounded,
color: MyTheme.dark,
));
}
Widget _buildSearchBar() {
RxBool focused = false.obs;
FocusNode focusNode = FocusNode();
focusNode.addListener(() => focused.value = focusNode.hasFocus);
return Container(
width: 120,
decoration: BoxDecoration(
color: MyTheme.color(context).bg,
borderRadius: BorderRadius.circular(6),
),
child: Obx(() => Row(
children: [
Expanded(
child: Row(
children: [
Icon(
Icons.search_rounded,
color: MyTheme.color(context).placeholder,
).marginSymmetric(horizontal: 4),
Expanded(
child: TextField(
autofocus: true,
controller: peerSearchTextController,
onChanged: (searchText) {
peerSearchText.value = searchText;
},
focusNode: focusNode,
textAlign: TextAlign.start,
maxLines: 1,
cursorColor: MyTheme.color(context).lightText,
cursorHeight: 18,
cursorWidth: 1,
style: const TextStyle(fontSize: 14),
decoration: InputDecoration(
contentPadding:
const EdgeInsets.symmetric(vertical: 6),
hintText:
focused.value ? null : translate("Search ID"),
hintStyle: TextStyle(
fontSize: 14,
color: MyTheme.color(context).placeholder),
border: InputBorder.none,
isDense: true,
),
),
),
// Icon(Icons.close),
IconButton(
alignment: Alignment.centerRight,
padding: const EdgeInsets.only(right: 2),
onPressed: () {
setState(() {
peerSearchTextController.clear();
peerSearchText.value = "";
drawer = false;
});
},
icon: const Icon(
Icons.close,
color: MyTheme.dark,
)),
],
),
)
],
)),
);
}
}

317
flutter/lib/common/widgets/peer_widget.dart Normal file
View File

@@ -0,0 +1,317 @@
import 'dart:async';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:provider/provider.dart';
import 'package:visibility_detector/visibility_detector.dart';
import 'package:window_manager/window_manager.dart';
import '../../common.dart';
import '../../models/peer_model.dart';
import '../../models/platform_model.dart';
import 'peercard_widget.dart';
typedef OffstageFunc = bool Function(Peer peer);
typedef PeerCardWidgetFunc = Widget Function(Peer peer);
/// for peer search text, global obs value
final peerSearchText = "".obs;
final peerSearchTextController =
TextEditingController(text: peerSearchText.value);
class _PeerWidget extends StatefulWidget {
final Peers peers;
final OffstageFunc offstageFunc;
final PeerCardWidgetFunc peerCardWidgetFunc;
const _PeerWidget(
{required this.peers,
required this.offstageFunc,
required this.peerCardWidgetFunc,
Key? key})
: super(key: key);
@override
_PeerWidgetState createState() => _PeerWidgetState();
}
/// State for the peer widget.
class _PeerWidgetState extends State<_PeerWidget> with WindowListener {
static const int _maxQueryCount = 3;
final space = isDesktop ? 12.0 : 8.0;
final _curPeers = <String>{};
var _lastChangeTime = DateTime.now();
var _lastQueryPeers = <String>{};
var _lastQueryTime = DateTime.now().subtract(const Duration(hours: 1));
var _queryCoun = 0;
var _exit = false;
late final mobileWidth = () {
const minWidth = 320.0;
final windowWidth = MediaQuery.of(context).size.width;
var width = windowWidth - 2 * space;
if (windowWidth > minWidth + 2 * space) {
final n = (windowWidth / (minWidth + 2 * space)).floor();
width = windowWidth / n - 2 * space;
}
return width;
}();
_PeerWidgetState() {
_startCheckOnlines();
}
@override
void initState() {
windowManager.addListener(this);
super.initState();
}
@override
void dispose() {
windowManager.removeListener(this);
_exit = true;
super.dispose();
}
@override
void onWindowFocus() {
_queryCoun = 0;
}
@override
void onWindowMinimize() {
_queryCoun = _maxQueryCount;
}
@override
Widget build(BuildContext context) {
return ChangeNotifierProvider<Peers>(
create: (context) => widget.peers,
child: Consumer<Peers>(
builder: (context, peers, child) => peers.peers.isEmpty
? Center(
child: Text(translate("Empty")),
)
: SingleChildScrollView(
controller: ScrollController(),
child: ObxValue<RxString>((searchText) {
return FutureBuilder<List<Peer>>(
builder: (context, snapshot) {
if (snapshot.hasData) {
final peers = snapshot.data!;
final cards = <Widget>[];
for (final peer in peers) {
final visibilityChild = VisibilityDetector(
key: ValueKey(peer.id),
onVisibilityChanged: (info) {
final peerId = (info.key as ValueKey).value;
if (info.visibleFraction > 0.00001) {
_curPeers.add(peerId);
} else {
_curPeers.remove(peerId);
}
_lastChangeTime = DateTime.now();
},
child: widget.peerCardWidgetFunc(peer),
);
cards.add(Offstage(
key: ValueKey("off${peer.id}"),
offstage: widget.offstageFunc(peer),
child: isDesktop
? Obx(
() => SizedBox(
width: 220,
height: peerCardUiType.value ==
PeerUiType.grid
? 140
: 42,
child: visibilityChild,
),
)
: SizedBox(
width: mobileWidth,
child: visibilityChild)));
}
return Wrap(
spacing: space, runSpacing: space, children: cards);
} else {
return const Center(
child: CircularProgressIndicator(),
);
}
},
future: matchPeers(searchText.value, peers.peers),
);
}, peerSearchText),
),
),
);
}
// ignore: todo
// TODO: variables walk through async tasks?
void _startCheckOnlines() {
() async {
while (!_exit) {
final now = DateTime.now();
if (!setEquals(_curPeers, _lastQueryPeers)) {
if (now.difference(_lastChangeTime) > const Duration(seconds: 1)) {
if (_curPeers.isNotEmpty) {
platformFFI.ffiBind
.queryOnlines(ids: _curPeers.toList(growable: false));
_lastQueryPeers = {..._curPeers};
_lastQueryTime = DateTime.now();
_queryCoun = 0;
}
}
} else {
if (_queryCoun < _maxQueryCount) {
if (now.difference(_lastQueryTime) > const Duration(seconds: 20)) {
if (_curPeers.isNotEmpty) {
platformFFI.ffiBind
.queryOnlines(ids: _curPeers.toList(growable: false));
_lastQueryTime = DateTime.now();
_queryCoun += 1;
}
}
}
}
await Future.delayed(const Duration(milliseconds: 300));
}
}();
}
}
abstract class BasePeerWidget extends StatelessWidget {
final String name;
final String loadEvent;
final OffstageFunc offstageFunc;
final PeerCardWidgetFunc peerCardWidgetFunc;
final List<Peer> initPeers;
const BasePeerWidget({
Key? key,
required this.name,
required this.loadEvent,
required this.offstageFunc,
required this.peerCardWidgetFunc,
required this.initPeers,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return _PeerWidget(
peers: Peers(name: name, loadEvent: loadEvent, peers: initPeers),
offstageFunc: offstageFunc,
peerCardWidgetFunc: peerCardWidgetFunc);
}
}
class RecentPeerWidget extends BasePeerWidget {
RecentPeerWidget({Key? key})
: super(
key: key,
name: 'recent peer',
loadEvent: 'load_recent_peers',
offstageFunc: (Peer peer) => false,
peerCardWidgetFunc: (Peer peer) => RecentPeerCard(
peer: peer,
),
initPeers: [],
);
@override
Widget build(BuildContext context) {
final widget = super.build(context);
bind.mainLoadRecentPeers();
return widget;
}
}
class FavoritePeerWidget extends BasePeerWidget {
FavoritePeerWidget({Key? key})
: super(
key: key,
name: 'favorite peer',
loadEvent: 'load_fav_peers',
offstageFunc: (Peer peer) => false,
peerCardWidgetFunc: (Peer peer) => FavoritePeerCard(
peer: peer,
),
initPeers: [],
);
@override
Widget build(BuildContext context) {
final widget = super.build(context);
bind.mainLoadFavPeers();
return widget;
}
}
class DiscoveredPeerWidget extends BasePeerWidget {
DiscoveredPeerWidget({Key? key})
: super(
key: key,
name: 'discovered peer',
loadEvent: 'load_lan_peers',
offstageFunc: (Peer peer) => false,
peerCardWidgetFunc: (Peer peer) => DiscoveredPeerCard(
peer: peer,
),
initPeers: [],
);
@override
Widget build(BuildContext context) {
final widget = super.build(context);
bind.mainLoadLanPeers();
return widget;
}
}
class AddressBookPeerWidget extends BasePeerWidget {
AddressBookPeerWidget({Key? key})
: super(
key: key,
name: 'address book peer',
loadEvent: 'load_address_book_peers',
offstageFunc: (Peer peer) =>
!_hitTag(gFFI.abModel.selectedTags, peer.tags),
peerCardWidgetFunc: (Peer peer) => AddressBookPeerCard(
peer: peer,
),
initPeers: _loadPeers(),
);
static List<Peer> _loadPeers() {
debugPrint("_loadPeers : ${gFFI.abModel.peers.toString()}");
return gFFI.abModel.peers.map((e) {
return Peer.fromJson(e['id'], e);
}).toList();
}
static bool _hitTag(List<dynamic> selectedTags, List<dynamic> idents) {
if (selectedTags.isEmpty) {
return true;
}
if (idents.isEmpty) {
return false;
}
for (final tag in selectedTags) {
if (!idents.contains(tag)) {
return false;
}
}
return true;
}
@override
Widget build(BuildContext context) {
final widget = super.build(context);
// gFFI.abModel.updateAb();
return widget;
}
}

999
flutter/lib/common/widgets/peercard_widget.dart Normal file
View File

@@ -0,0 +1,999 @@
import 'package:contextmenu/contextmenu.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import '../../common.dart';
import '../../common/formatter/id_formatter.dart';
import '../../models/model.dart';
import '../../models/peer_model.dart';
import '../../models/platform_model.dart';
import '../../desktop/widgets/material_mod_popup_menu.dart' as mod_menu;
import '../../desktop/widgets/popup_menu.dart';
class _PopupMenuTheme {
static const Color commonColor = MyTheme.accent;
// kMinInteractiveDimension
static const double height = 25.0;
static const double dividerHeight = 3.0;
}
typedef PopupMenuEntryBuilder = Future<List<mod_menu.PopupMenuEntry<String>>>
Function(BuildContext);
enum PeerUiType { grid, list }
final peerCardUiType = PeerUiType.grid.obs;
class _PeerCard extends StatefulWidget {
final Peer peer;
final RxString alias;
final Function(BuildContext, String) connect;
final PopupMenuEntryBuilder popupMenuEntryBuilder;
const _PeerCard(
{required this.peer,
required this.alias,
required this.connect,
required this.popupMenuEntryBuilder,
Key? key})
: super(key: key);
@override
_PeerCardState createState() => _PeerCardState();
}
/// State for the connection page.
class _PeerCardState extends State<_PeerCard>
with AutomaticKeepAliveClientMixin {
var _menuPos = RelativeRect.fill;
final double _cardRadis = 16;
final double _borderWidth = 2;
final RxBool _iconMoreHover = false.obs;
@override
Widget build(BuildContext context) {
super.build(context);
if (isDesktop) {
return _buildDesktop();
} else {
return _buildMobile();
}
}
Widget _buildMobile() {
final peer = super.widget.peer;
return Card(
margin: EdgeInsets.zero,
child: GestureDetector(
onTap: !isWebDesktop ? () => connect(context, peer.id) : null,
onDoubleTap: isWebDesktop ? () => connect(context, peer.id) : null,
onLongPressStart: (details) {
final x = details.globalPosition.dx;
final y = details.globalPosition.dy;
_menuPos = RelativeRect.fromLTRB(x, y, x, y);
_showPeerMenu(peer.id);
},
child: ListTile(
contentPadding: const EdgeInsets.only(left: 12),
subtitle: Text('${peer.username}@${peer.hostname}'),
title: Text(peer.id),
leading: Container(
padding: const EdgeInsets.all(6),
color: str2color('${peer.id}${peer.platform}', 0x7f),
child: getPlatformImage(peer.platform)),
trailing: InkWell(
child: const Padding(
padding: EdgeInsets.all(12),
child: Icon(Icons.more_vert)),
onTapDown: (e) {
final x = e.globalPosition.dx;
final y = e.globalPosition.dy;
_menuPos = RelativeRect.fromLTRB(x, y, x, y);
},
onTap: () {
_showPeerMenu(peer.id);
}),
)));
}
Widget _buildDesktop() {
final peer = super.widget.peer;
var deco = Rx<BoxDecoration?>(BoxDecoration(
border: Border.all(color: Colors.transparent, width: _borderWidth),
borderRadius: peerCardUiType.value == PeerUiType.grid
? BorderRadius.circular(_cardRadis)
: null));
return MouseRegion(
onEnter: (evt) {
deco.value = BoxDecoration(
border: Border.all(color: MyTheme.button, width: _borderWidth),
borderRadius: peerCardUiType.value == PeerUiType.grid
? BorderRadius.circular(_cardRadis)
: null);
},
onExit: (evt) {
deco.value = BoxDecoration(
border: Border.all(color: Colors.transparent, width: _borderWidth),
borderRadius: peerCardUiType.value == PeerUiType.grid
? BorderRadius.circular(_cardRadis)
: null);
},
child: GestureDetector(
onDoubleTap: () => widget.connect(context, peer.id),
child: Obx(() => peerCardUiType.value == PeerUiType.grid
? _buildPeerCard(context, peer, deco)
: _buildPeerTile(context, peer, deco))),
);
}
Widget _buildPeerTile(
BuildContext context, Peer peer, Rx<BoxDecoration?> deco) {
final greyStyle =
TextStyle(fontSize: 12, color: MyTheme.color(context).lighterText);
return Obx(
() => Container(
foregroundDecoration: deco.value,
child: Row(
mainAxisSize: MainAxisSize.max,
children: [
Container(
decoration: BoxDecoration(
color: str2color('${peer.id}${peer.platform}', 0x7f),
),
alignment: Alignment.center,
child: getPlatformImage(peer.platform, size: 30).paddingAll(6),
),
Expanded(
child: Container(
decoration: BoxDecoration(color: MyTheme.color(context).bg),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
Row(children: [
Padding(
padding: const EdgeInsets.fromLTRB(0, 4, 4, 4),
child: CircleAvatar(
radius: 5,
backgroundColor: peer.online
? Colors.green
: Colors.yellow)),
Text(
formatID(peer.id),
style:
const TextStyle(fontWeight: FontWeight.w400),
),
]),
Align(
alignment: Alignment.centerLeft,
child: FutureBuilder<String>(
future: bind.mainGetPeerOption(
id: peer.id, key: 'alias'),
builder: (_, snapshot) {
if (snapshot.hasData) {
final name = snapshot.data!.isEmpty
? '${peer.username}@${peer.hostname}'
: snapshot.data!;
return Tooltip(
message: name,
waitDuration: const Duration(seconds: 1),
child: Text(
name,
style: greyStyle,
textAlign: TextAlign.start,
overflow: TextOverflow.ellipsis,
),
);
} else {
// alias has not arrived
return Text(
'${peer.username}@${peer.hostname}',
style: greyStyle,
textAlign: TextAlign.start,
overflow: TextOverflow.ellipsis,
);
}
},
),
),
],
),
),
_actionMore(peer),
],
).paddingSymmetric(horizontal: 4.0),
),
)
],
),
),
);
}
Widget _buildPeerCard(
BuildContext context, Peer peer, Rx<BoxDecoration?> deco) {
return Card(
color: Colors.transparent,
elevation: 0,
margin: EdgeInsets.zero,
child: Obx(
() => Container(
foregroundDecoration: deco.value,
child: ClipRRect(
borderRadius: BorderRadius.circular(_cardRadis - _borderWidth),
child: Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Expanded(
child: Container(
color: str2color('${peer.id}${peer.platform}', 0x7f),
child: Row(
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
padding: const EdgeInsets.all(6),
child:
getPlatformImage(peer.platform, size: 60),
),
Row(
children: [
Expanded(
child: Obx(() {
final name = widget.alias.value.isEmpty
? '${peer.username}@${peer.hostname}'
: widget.alias.value;
return Tooltip(
message: name,
waitDuration:
const Duration(seconds: 1),
child: Text(
name,
style: const TextStyle(
color: Colors.white70,
fontSize: 12),
textAlign: TextAlign.center,
overflow: TextOverflow.ellipsis,
),
);
}),
),
],
),
],
).paddingAll(4.0),
),
],
),
),
),
Container(
color: MyTheme.color(context).bg,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(children: [
Padding(
padding: const EdgeInsets.fromLTRB(0, 4, 8, 4),
child: CircleAvatar(
radius: 5,
backgroundColor: peer.online
? Colors.green
: Colors.yellow)),
Text(formatID(peer.id))
]).paddingSymmetric(vertical: 8),
_actionMore(peer),
],
).paddingSymmetric(horizontal: 12.0),
)
],
),
),
),
),
);
}
Widget _actionMore(Peer peer) => Listener(
onPointerDown: (e) {
final x = e.position.dx;
final y = e.position.dy;
_menuPos = RelativeRect.fromLTRB(x, y, x, y);
},
onPointerUp: (_) => _showPeerMenu(peer.id),
child: MouseRegion(
onEnter: (_) => _iconMoreHover.value = true,
onExit: (_) => _iconMoreHover.value = false,
child: CircleAvatar(
radius: 14,
backgroundColor: _iconMoreHover.value
? MyTheme.color(context).grayBg!
: MyTheme.color(context).bg!,
child: Icon(Icons.more_vert,
size: 18,
color: _iconMoreHover.value
? MyTheme.color(context).text
: MyTheme.color(context).lightText))));
/// Show the peer menu and handle user's choice.
/// User might remove the peer or send a file to the peer.
void _showPeerMenu(String id) async {
await mod_menu.showMenu(
context: context,
position: _menuPos,
items: await super.widget.popupMenuEntryBuilder(context),
elevation: 8,
);
}
@override
bool get wantKeepAlive => true;
}
abstract class BasePeerCard extends StatelessWidget {
final RxString alias = ''.obs;
final Peer peer;
BasePeerCard({required this.peer, Key? key}) : super(key: key) {
bind
.mainGetPeerOption(id: peer.id, key: 'alias')
.then((value) => alias.value = value);
}
@override
Widget build(BuildContext context) {
return _PeerCard(
peer: peer,
alias: alias,
connect: (BuildContext context, String id) => connect(context, id),
popupMenuEntryBuilder: _buildPopupMenuEntry,
);
}
Future<List<mod_menu.PopupMenuEntry<String>>> _buildPopupMenuEntry(
BuildContext context) async =>
(await _buildMenuItems(context))
.map((e) => e.build(
context,
const MenuConfig(
commonColor: _PopupMenuTheme.commonColor,
height: _PopupMenuTheme.height,
dividerHeight: _PopupMenuTheme.dividerHeight)))
.expand((i) => i)
.toList();
@protected
Future<List<MenuEntryBase<String>>> _buildMenuItems(BuildContext context);
MenuEntryBase<String> _connectCommonAction(
BuildContext context, String id, String title,
{bool isFileTransfer = false,
bool isTcpTunneling = false,
bool isRDP = false}) {
return MenuEntryButton<String>(
childBuilder: (TextStyle? style) => Text(
translate(title),
style: style,
),
proc: () {
connect(
context,
peer.id,
isFileTransfer: isFileTransfer,
isTcpTunneling: isTcpTunneling,
isRDP: isRDP,
);
},
dismissOnClicked: true,
);
}
@protected
MenuEntryBase<String> _connectAction(BuildContext context, String id) {
return _connectCommonAction(context, id, 'Connect');
}
@protected
MenuEntryBase<String> _transferFileAction(BuildContext context, String id) {
return _connectCommonAction(
context,
id,
'Transfer File',
isFileTransfer: true,
);
}
@protected
MenuEntryBase<String> _tcpTunnelingAction(BuildContext context, String id) {
return _connectCommonAction(
context,
id,
'TCP Tunneling',
isTcpTunneling: true,
);
}
@protected
MenuEntryBase<String> _rdpAction(BuildContext context, String id) {
return MenuEntryButton<String>(
childBuilder: (TextStyle? style) => Container(
alignment: AlignmentDirectional.center,
height: _PopupMenuTheme.height,
child: Row(
children: [
Text(
translate('RDP'),
style: style,
),
Expanded(
child: Align(
alignment: Alignment.centerRight,
child: IconButton(
padding: EdgeInsets.zero,
icon: const Icon(Icons.edit),
onPressed: () => _rdpDialog(id),
),
))
],
)),
proc: () {
connect(context, id, isRDP: true);
},
dismissOnClicked: true,
);
}
@protected
MenuEntryBase<String> _wolAction(String id) {
return MenuEntryButton<String>(
childBuilder: (TextStyle? style) => Text(
translate('WOL'),
style: style,
),
proc: () {
bind.mainWol(id: id);
},
dismissOnClicked: true,
);
}
@protected
Future<MenuEntryBase<String>> _forceAlwaysRelayAction(String id) async {
const option = 'force-always-relay';
return MenuEntrySwitch<String>(
text: translate('Always connect via relay'),
getter: () async {
return (await bind.mainGetPeerOption(id: id, key: option)).isNotEmpty;
},
setter: (bool v) async {
String value;
String oldValue = await bind.mainGetPeerOption(id: id, key: option);
if (oldValue.isEmpty) {
value = 'Y';
} else {
value = '';
}
await bind.mainSetPeerOption(id: id, key: option, value: value);
},
dismissOnClicked: true,
);
}
@protected
MenuEntryBase<String> _renameAction(String id, bool isAddressBook) {
return MenuEntryButton<String>(
childBuilder: (TextStyle? style) => Text(
translate('Rename'),
style: style,
),
proc: () {
_rename(id, isAddressBook);
},
dismissOnClicked: true,
);
}
@protected
MenuEntryBase<String> _removeAction(
String id, Future<void> Function() reloadFunc) {
return MenuEntryButton<String>(
childBuilder: (TextStyle? style) => Text(
translate('Remove'),
style: style,
),
proc: () {
() async {
await bind.mainRemovePeer(id: id);
removePreference(id);
await reloadFunc();
// Get.forceAppUpdate(); // TODO use inner model / state
}();
},
dismissOnClicked: true,
);
}
@protected
MenuEntryBase<String> _unrememberPasswordAction(String id) {
return MenuEntryButton<String>(
childBuilder: (TextStyle? style) => Text(
translate('Unremember Password'),
style: style,
),
proc: () {
bind.mainForgetPassword(id: id);
},
dismissOnClicked: true,
);
}
@protected
MenuEntryBase<String> _addFavAction(String id) {
return MenuEntryButton<String>(
childBuilder: (TextStyle? style) => Text(
translate('Add to Favorites'),
style: style,
),
proc: () {
() async {
final favs = (await bind.mainGetFav()).toList();
if (!favs.contains(id)) {
favs.add(id);
await bind.mainStoreFav(favs: favs);
}
}();
},
dismissOnClicked: true,
);
}
@protected
MenuEntryBase<String> _rmFavAction(
String id, Future<void> Function() reloadFunc) {
return MenuEntryButton<String>(
childBuilder: (TextStyle? style) => Text(
translate('Remove from Favorites'),
style: style,
),
proc: () {
() async {
final favs = (await bind.mainGetFav()).toList();
if (favs.remove(id)) {
await bind.mainStoreFav(favs: favs);
await reloadFunc();
// Get.forceAppUpdate(); // TODO use inner model / state
}
}();
},
dismissOnClicked: true,
);
}
void _rename(String id, bool isAddressBook) async {
RxBool isInProgress = false.obs;
var name = await bind.mainGetPeerOption(id: id, key: 'alias');
var controller = TextEditingController(text: name);
if (isAddressBook) {
final peer = gFFI.abModel.peers.firstWhere((p) => id == p['id']);
if (peer == null) {
// this should not happen
} else {
name = peer['alias'] ?? '';
}
}
gFFI.dialogManager.show((setState, close) {
submit() async {
isInProgress.value = true;
name = controller.text;
await bind.mainSetPeerOption(id: id, key: 'alias', value: name);
if (isAddressBook) {
gFFI.abModel.setPeerOption(id, 'alias', name);
await gFFI.abModel.updateAb();
}
alias.value = await bind.mainGetPeerOption(id: peer.id, key: 'alias');
close();
isInProgress.value = false;
}
return CustomAlertDialog(
title: Text(translate('Rename')),
content: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
padding:
const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
child: Form(
child: TextFormField(
controller: controller,
focusNode: FocusNode()..requestFocus(),
decoration:
const InputDecoration(border: OutlineInputBorder()),
),
),
),
Obx(() => Offstage(
offstage: isInProgress.isFalse,
child: const LinearProgressIndicator())),
],
),
actions: [
TextButton(onPressed: close, child: Text(translate("Cancel"))),
TextButton(onPressed: submit, child: Text(translate("OK"))),
],
onSubmit: submit,
onCancel: close,
);
});
}
}
class RecentPeerCard extends BasePeerCard {
RecentPeerCard({required Peer peer, Key? key}) : super(peer: peer, key: key);
@override
Future<List<MenuEntryBase<String>>> _buildMenuItems(
BuildContext context) async {
final List<MenuEntryBase<String>> menuItems = [
_connectAction(context, peer.id),
_transferFileAction(context, peer.id),
_tcpTunnelingAction(context, peer.id),
];
MenuEntryBase<String>? rdpAction;
if (peer.platform == 'Windows') {
rdpAction = _rdpAction(context, peer.id);
}
menuItems.add(await _forceAlwaysRelayAction(peer.id));
if (rdpAction != null) {
menuItems.add(rdpAction);
}
menuItems.add(_wolAction(peer.id));
menuItems.add(MenuEntryDivider());
menuItems.add(_renameAction(peer.id, false));
menuItems.add(_removeAction(peer.id, () async {
await bind.mainLoadRecentPeers();
}));
menuItems.add(_unrememberPasswordAction(peer.id));
menuItems.add(_addFavAction(peer.id));
return menuItems;
}
}
class FavoritePeerCard extends BasePeerCard {
FavoritePeerCard({required Peer peer, Key? key})
: super(peer: peer, key: key);
@override
Future<List<MenuEntryBase<String>>> _buildMenuItems(
BuildContext context) async {
final List<MenuEntryBase<String>> menuItems = [
_connectAction(context, peer.id),
_transferFileAction(context, peer.id),
_tcpTunnelingAction(context, peer.id),
];
MenuEntryBase<String>? rdpAction;
if (peer.platform == 'Windows') {
rdpAction = _rdpAction(context, peer.id);
}
menuItems.add(await _forceAlwaysRelayAction(peer.id));
if (rdpAction != null) {
menuItems.add(rdpAction);
}
menuItems.add(_wolAction(peer.id));
menuItems.add(MenuEntryDivider());
menuItems.add(_renameAction(peer.id, false));
menuItems.add(_removeAction(peer.id, () async {
await bind.mainLoadFavPeers();
}));
menuItems.add(_unrememberPasswordAction(peer.id));
menuItems.add(_rmFavAction(peer.id, () async {
await bind.mainLoadFavPeers();
}));
return menuItems;
}
}
class DiscoveredPeerCard extends BasePeerCard {
DiscoveredPeerCard({required Peer peer, Key? key})
: super(peer: peer, key: key);
@override
Future<List<MenuEntryBase<String>>> _buildMenuItems(
BuildContext context) async {
final List<MenuEntryBase<String>> menuItems = [
_connectAction(context, peer.id),
_transferFileAction(context, peer.id),
_tcpTunnelingAction(context, peer.id),
];
MenuEntryBase<String>? rdpAction;
if (peer.platform == 'Windows') {
rdpAction = _rdpAction(context, peer.id);
}
menuItems.add(await _forceAlwaysRelayAction(peer.id));
if (rdpAction != null) {
menuItems.add(rdpAction);
}
menuItems.add(_wolAction(peer.id));
menuItems.add(MenuEntryDivider());
menuItems.add(_renameAction(peer.id, false));
menuItems.add(_removeAction(peer.id, () async {
await bind.mainLoadLanPeers();
}));
menuItems.add(_unrememberPasswordAction(peer.id));
return menuItems;
}
}
class AddressBookPeerCard extends BasePeerCard {
AddressBookPeerCard({required Peer peer, Key? key})
: super(peer: peer, key: key);
@override
Future<List<MenuEntryBase<String>>> _buildMenuItems(
BuildContext context) async {
final List<MenuEntryBase<String>> menuItems = [
_connectAction(context, peer.id),
_transferFileAction(context, peer.id),
_tcpTunnelingAction(context, peer.id),
];
MenuEntryBase<String>? rdpAction;
if (peer.platform == 'Windows') {
rdpAction = _rdpAction(context, peer.id);
}
menuItems.add(await _forceAlwaysRelayAction(peer.id));
if (rdpAction != null) {
menuItems.add(rdpAction);
}
menuItems.add(_wolAction(peer.id));
menuItems.add(MenuEntryDivider());
menuItems.add(_renameAction(peer.id, false));
menuItems.add(_removeAction(peer.id, () async {}));
menuItems.add(_unrememberPasswordAction(peer.id));
menuItems.add(_addFavAction(peer.id));
menuItems.add(_editTagAction(peer.id));
return menuItems;
}
@protected
@override
MenuEntryBase<String> _removeAction(
String id, Future<void> Function() reloadFunc) {
return MenuEntryButton<String>(
childBuilder: (TextStyle? style) => Text(
translate('Remove'),
style: style,
),
proc: () {
() async {
gFFI.abModel.deletePeer(id);
await gFFI.abModel.updateAb();
}();
},
dismissOnClicked: true,
);
}
@protected
MenuEntryBase<String> _editTagAction(String id) {
return MenuEntryButton<String>(
childBuilder: (TextStyle? style) => Text(
translate('Edit Tag'),
style: style,
),
proc: () {
_abEditTag(id);
},
dismissOnClicked: true,
);
}
void _abEditTag(String id) {
var isInProgress = false;
final tags = List.of(gFFI.abModel.tags);
var selectedTag = gFFI.abModel.getPeerTags(id).obs;
gFFI.dialogManager.show((setState, close) {
submit() async {
setState(() {
isInProgress = true;
});
gFFI.abModel.changeTagForPeer(id, selectedTag);
await gFFI.abModel.updateAb();
close();
}
return CustomAlertDialog(
title: Text(translate("Edit Tag")),
content: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
padding:
const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
child: Wrap(
children: tags
.map((e) => _buildTag(e, selectedTag, onTap: () {
if (selectedTag.contains(e)) {
selectedTag.remove(e);
} else {
selectedTag.add(e);
}
}))
.toList(growable: false),
),
),
Offstage(
offstage: !isInProgress, child: const LinearProgressIndicator())
],
),
actions: [
TextButton(onPressed: close, child: Text(translate("Cancel"))),
TextButton(onPressed: submit, child: Text(translate("OK"))),
],
onSubmit: submit,
onCancel: close,
);
});
}
Widget _buildTag(String tagName, RxList<dynamic> rxTags,
{Function()? onTap}) {
return ContextMenuArea(
width: 100,
builder: (context) => [
ListTile(
title: Text(translate("Delete")),
onTap: () {
gFFI.abModel.deleteTag(tagName);
gFFI.abModel.updateAb();
Future.delayed(Duration.zero, () => Get.back());
},
)
],
child: GestureDetector(
onTap: onTap,
child: Obx(
() => Container(
decoration: BoxDecoration(
color: rxTags.contains(tagName) ? Colors.blue : null,
border: Border.all(color: MyTheme.darkGray),
borderRadius: BorderRadius.circular(10)),
margin: const EdgeInsets.symmetric(horizontal: 4.0, vertical: 8.0),
padding: const EdgeInsets.symmetric(vertical: 2.0, horizontal: 8.0),
child: Text(
tagName,
style: TextStyle(
color: rxTags.contains(tagName) ? MyTheme.white : null),
),
),
),
),
);
}
}
void _rdpDialog(String id) async {
final portController = TextEditingController(
text: await bind.mainGetPeerOption(id: id, key: 'rdp_port'));
final userController = TextEditingController(
text: await bind.mainGetPeerOption(id: id, key: 'rdp_username'));
final passwordContorller = TextEditingController(
text: await bind.mainGetPeerOption(id: id, key: 'rdp_password'));
RxBool secure = true.obs;
gFFI.dialogManager.show((setState, close) {
submit() async {
await bind.mainSetPeerOption(
id: id, key: 'rdp_port', value: portController.text.trim());
await bind.mainSetPeerOption(
id: id, key: 'rdp_username', value: userController.text);
await bind.mainSetPeerOption(
id: id, key: 'rdp_password', value: passwordContorller.text);
close();
}
return CustomAlertDialog(
title: Text('RDP ${translate('Settings')}'),
content: ConstrainedBox(
constraints: const BoxConstraints(minWidth: 500),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const SizedBox(
height: 8.0,
),
Row(
children: [
ConstrainedBox(
constraints: const BoxConstraints(minWidth: 100),
child: Text(
"${translate('Port')}:",
textAlign: TextAlign.start,
).marginOnly(bottom: 16.0)),
const SizedBox(
width: 24.0,
),
Expanded(
child: TextField(
inputFormatters: [
FilteringTextInputFormatter.allow(RegExp(
r'^([0-9]|[1-9]\d|[1-9]\d{2}|[1-9]\d{3}|[1-5]\d{4}|6[0-4]\d{3}|65[0-4]\d{2}|655[0-2]\d|6553[0-5])$'))
],
decoration: const InputDecoration(
border: OutlineInputBorder(), hintText: '3389'),
controller: portController,
focusNode: FocusNode()..requestFocus(),
),
),
],
),
const SizedBox(
height: 8.0,
),
Row(
children: [
ConstrainedBox(
constraints: const BoxConstraints(minWidth: 100),
child: Text(
"${translate('Username')}:",
textAlign: TextAlign.start,
).marginOnly(bottom: 16.0)),
const SizedBox(
width: 24.0,
),
Expanded(
child: TextField(
decoration:
const InputDecoration(border: OutlineInputBorder()),
controller: userController,
),
),
],
),
const SizedBox(
height: 8.0,
),
Row(
children: [
ConstrainedBox(
constraints: const BoxConstraints(minWidth: 100),
child: Text("${translate('Password')}:")
.marginOnly(bottom: 16.0)),
const SizedBox(
width: 24.0,
),
Expanded(
child: Obx(() => TextField(
obscureText: secure.value,
decoration: InputDecoration(
border: const OutlineInputBorder(),
suffixIcon: IconButton(
onPressed: () => secure.value = !secure.value,
icon: Icon(secure.value
? Icons.visibility_off
: Icons.visibility))),
controller: passwordContorller,
)),
),
],
),
],
),
),
actions: [
TextButton(onPressed: close, child: Text(translate("Cancel"))),
TextButton(onPressed: submit, child: Text(translate("OK"))),
],
onSubmit: submit,
onCancel: close,
);
});
}