diff --git a/flutter/lib/common/widgets/peer_tab_page.dart b/flutter/lib/common/widgets/peer_tab_page.dart index cbc3b1370..cdafbc4f1 100644 --- a/flutter/lib/common/widgets/peer_tab_page.dart +++ b/flutter/lib/common/widgets/peer_tab_page.dart @@ -17,6 +17,7 @@ import 'package:get/get.dart'; import 'package:get/get_rx/src/rx_workers/utils/debouncer.dart'; import 'package:provider/provider.dart'; import 'package:visibility_detector/visibility_detector.dart'; +import 'package:dropdown_button2/dropdown_button2.dart'; import '../../common.dart'; import '../../models/platform_model.dart'; @@ -112,19 +113,14 @@ class _PeerTabPageState extends State offstage: !isDesktop, child: _createPeerViewTypeSwitch(context) .marginOnly(left: 13)), + Offstage( + offstage: _hideSort, + child: PeerSortDropdown().marginOnly(left: 8), + ), ], ), ), ), - Row( - children: [ - Expanded(child: SizedBox()), - Offstage( - offstage: _hideSort, - child: PeerSortDropdown(), - ), - ], - ), _createPeersView(), ], ); @@ -244,7 +240,7 @@ class _PeerTabPageState extends State Widget _createPeerViewTypeSwitch(BuildContext context) { final textColor = Theme.of(context).textTheme.titleLarge?.color; - final activeDeco = BoxDecoration( + final deco = BoxDecoration( color: Theme.of(context).colorScheme.background, borderRadius: BorderRadius.circular(5), ); @@ -253,7 +249,7 @@ class _PeerTabPageState extends State return Obx( () => Container( padding: EdgeInsets.all(4.0), - decoration: activeDeco, + decoration: deco, child: InkWell( onTap: () async { final type = types.elementAt( @@ -439,39 +435,74 @@ class PeerSortDropdown extends StatefulWidget { } class _PeerSortDropdownState extends State { - final List sort_names = ['id', 'username', "status"]; + final List sort_names = ['Remote ID', 'Username', "Status"]; String _sortType = peerSort.value; @override Widget build(BuildContext context) { - return DropdownButton( - value: _sortType.isEmpty ? 'id' : _sortType, - elevation: 16, - underline: SizedBox(), - onChanged: (v) { - if (v != null) { - setState(() { - _sortType = v; - bind.setLocalFlutterConfig( - k: "peer-sorting", - v: _sortType, - ); - }); - peerSort.value = _sortType; - } - }, - dropdownColor: Theme.of(context).cardColor, - items: sort_names - .map>( - (String value) => DropdownMenuItem( - value: value, - child: Text( - value, - overflow: TextOverflow.ellipsis, - ), + final deco = BoxDecoration( + color: Theme.of(context).colorScheme.background, + borderRadius: BorderRadius.circular(5), + ); + return Container( + padding: EdgeInsets.all(4.0), + decoration: deco, + child: DropdownButtonHideUnderline( + child: DropdownButton2( + value: sort_names.contains(_sortType) ? _sortType : sort_names[0], + onChanged: (v) async { + if (v != null) { + setState(() => _sortType = v); + await bind.setLocalFlutterConfig( + k: "peer-sorting", + v: _sortType, + ); + peerSort.value = _sortType; + } + }, + customButton: Icon( + Icons.sort, + size: 18, ), - ) - .toList(), + dropdownStyleData: DropdownStyleData( + decoration: BoxDecoration( + color: Theme.of(context).cardColor, + borderRadius: BorderRadius.circular(10), + ), + width: 160, + ), + items: [ + DropdownMenuItem( + alignment: Alignment.center, + child: Text( + translate("Sort by"), + style: TextStyle(fontWeight: FontWeight.bold), + ), + enabled: false, + ), + ...sort_names + .map>( + (String value) => DropdownMenuItem( + value: value, + child: Row( + children: [ + Icon( + value == _sortType + ? Icons.radio_button_checked_rounded + : Icons.radio_button_off_rounded, + size: 18, + ).paddingOnly(right: 12), + Text( + translate(value), + overflow: TextOverflow.ellipsis, + ), + ], + ), + ), + ) + .toList(), + ]), + ), ); } } diff --git a/flutter/pubspec.lock b/flutter/pubspec.lock index 63f6c804c..f3db95378 100644 --- a/flutter/pubspec.lock +++ b/flutter/pubspec.lock @@ -386,6 +386,14 @@ packages: url: "https://pub.dev" source: hosted version: "0.0.2" + dropdown_button2: + dependency: "direct main" + description: + name: dropdown_button2 + sha256: "4458d81bfd24207f3d58f66f78097064e02f810f94cf1bc80bf20fe7685ebc80" + url: "https://pub.dev" + source: hosted + version: "2.0.0" event_bus: dependency: transitive description: diff --git a/flutter/pubspec.yaml b/flutter/pubspec.yaml index ccb53cc9c..a212a5093 100644 --- a/flutter/pubspec.yaml +++ b/flutter/pubspec.yaml @@ -94,6 +94,7 @@ dependencies: flutter_keyboard_visibility: ^5.4.0 texture_rgba_renderer: ^0.0.12 percent_indicator: ^4.2.2 + dropdown_button2: ^2.0.0 dev_dependencies: icons_launcher: ^2.0.4