diff --git a/lib/pages/settings_page.dart b/lib/pages/settings_page.dart index c70f269..021c9c1 100644 --- a/lib/pages/settings_page.dart +++ b/lib/pages/settings_page.dart @@ -14,6 +14,7 @@ import "package:nexus/models/setting.dart"; import "package:nexus/models/settings.dart"; import "package:nexus/models/settings_category.dart"; import "package:nexus/widgets/divider_text.dart"; +import "package:nexus/widgets/highlight_wrapper.dart"; import "package:nexus/widgets/settings/dialog_list_tile.dart"; import "package:super_sliver_list/super_sliver_list.dart"; import "package:nexus/main.dart"; @@ -108,6 +109,10 @@ class SettingsPage extends ConsumerWidget { final selected = useState(0); + final highlightedMatch = useState<(int, int)?>(null); + final listController = useRef(ListController()); + final scrollController = useScrollController(); + final searchBar = SearchAnchor.bar( barHintText: "Search...", suggestionsBuilder: (context, controller) { @@ -140,15 +145,26 @@ class SettingsPage extends ConsumerWidget { return matches.map( (match) => ListTile( - onTap: () { - // TODO: Do something - // if (categoriesArePages) { - // // Navigator.of(context).push(route); - // } else { - // selected.value = match.$1.$1; - // } - - Navigator.of(context).pop(); + onTap: () async { + if (context.mounted) Navigator.of(context).pop(); + if (categoriesArePages) { + // Navigator.of(context).push(route); + } else { + selected.value = match.$1.$1; + listController.value.animateToItem( + index: match.$1.$2, + scrollController: scrollController, + alignment: 0.5, + duration: (_) => .new(milliseconds: 700), + curve: (_) => Curves.easeInOut, + ); + highlightedMatch.value = match.$1; + await Future.delayed(.new(seconds: 1), () { + if (highlightedMatch.value == match.$1) { + highlightedMatch.value = null; + } + }); + } }, leading: Icon(match.$2.icon), title: Text(match.$2.title), @@ -286,18 +302,25 @@ class SettingsPage extends ConsumerWidget { VerticalDivider(), Expanded( child: SuperListView( + listController: listController.value, + controller: scrollController, padding: .symmetric(vertical: 12), children: buildCategories(settings) .values .flattenedToList[selected.value] .settings - .map( - (setting) => Padding( + .mapIndexed( + (index, setting) => Padding( padding: .only(bottom: 4), - child: setting.builder( - setting.title, - setting.description, - setting.icon, + child: HighlightWrapper( + setting.builder( + setting.title, + setting.description, + setting.icon, + ), + isHighlighted: + highlightedMatch.value == + (selected.value, index), ), ), )