From 4aec412ce70ba38a149bc3c5e6d7742cce488edb Mon Sep 17 00:00:00 2001 From: ryleedavis Date: Wed, 2 Nov 2022 14:16:38 -0600 Subject: [PATCH] working language dialog --- .../language_settings/language_dialog.dart | 408 +++++++++--------- 1 file changed, 197 insertions(+), 211 deletions(-) diff --git a/lib/pages_desktop_specific/home/settings_menu/language_settings/language_dialog.dart b/lib/pages_desktop_specific/home/settings_menu/language_settings/language_dialog.dart index 0bf5d0fcd..f68196710 100644 --- a/lib/pages_desktop_specific/home/settings_menu/language_settings/language_dialog.dart +++ b/lib/pages_desktop_specific/home/settings_menu/language_settings/language_dialog.dart @@ -12,6 +12,10 @@ import 'package:stackwallet/widgets/desktop/secondary_button.dart'; import 'package:stackwallet/widgets/stack_text_field.dart'; import '../../../../utilities/assets.dart'; +import '../../../../utilities/theme/stack_colors.dart'; +import '../../../../widgets/icon_widgets/x_icon.dart'; +import '../../../../widgets/rounded_container.dart'; +import '../../../../widgets/textfield_icon_button.dart'; class LanguageDialog extends ConsumerStatefulWidget { const LanguageDialog({Key? key}) : super(key: key); @@ -94,6 +98,13 @@ class _LanguageDialog extends ConsumerState { current = ref .watch(prefsChangeNotifierProvider.select((value) => value.language)); + listWithoutSelected = languages; + if (current.isNotEmpty) { + listWithoutSelected.remove(current); + listWithoutSelected.insert(0, current); + } + listWithoutSelected = _filtered(); + return DesktopDialog( maxHeight: 700, maxWidth: 600, @@ -113,41 +124,196 @@ class _LanguageDialog extends ConsumerState { const DesktopDialogCloseButton(), ], ), - Padding( - padding: EdgeInsets.symmetric(vertical: 16, horizontal: 32), - child: Column( - children: [ - ClipRRect( - borderRadius: BorderRadius.circular( - Constants.size.circularBorderRadius, - ), - child: TextField( - autocorrect: false, - enableSuggestions: false, - controller: searchLanguageController, - focusNode: searchLanguageFocusNode, - style: STextStyles.desktopTextMedium(context).copyWith( - height: 2, - ), - textAlign: TextAlign.left, - decoration: standardInputDecoration( - "Search", searchLanguageFocusNode, context) - .copyWith( - prefixIcon: Padding( - padding: const EdgeInsets.symmetric( - horizontal: 10, - vertical: 16, - ), - child: SvgPicture.asset( - Assets.svg.search, - width: 16, - height: 16, + Expanded( + child: NestedScrollView( + floatHeaderSlivers: true, + headerSliverBuilder: (context, innerBoxIsScrolled) { + return [ + SliverOverlapAbsorber( + handle: NestedScrollView.sliverOverlapAbsorberHandleFor( + context), + sliver: SliverToBoxAdapter( + child: Padding( + padding: + EdgeInsets.symmetric(vertical: 16, horizontal: 32), + child: Column( + children: [ + Padding( + padding: const EdgeInsets.only(bottom: 16), + child: ClipRRect( + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius, + ), + child: TextField( + autocorrect: false, + enableSuggestions: false, + controller: searchLanguageController, + focusNode: searchLanguageFocusNode, + style: STextStyles.desktopTextMedium(context) + .copyWith( + height: 2, + ), + textAlign: TextAlign.left, + decoration: standardInputDecoration("Search", + searchLanguageFocusNode, context) + .copyWith( + prefixIcon: Padding( + padding: const EdgeInsets.symmetric( + horizontal: 10, + vertical: 16, + ), + child: SvgPicture.asset( + Assets.svg.search, + width: 16, + height: 16, + ), + ), + suffixIcon: searchLanguageController + .text.isNotEmpty + ? Padding( + padding: + const EdgeInsets.only(right: 0), + child: UnconstrainedBox( + child: Row( + children: [ + TextFieldIconButton( + child: const XIcon(), + onTap: () async { + setState(() { + searchLanguageController + .text = ""; + filter = ""; + }); + }, + ), + ], + ), + ), + ) + : null, + ), + ), + ), + ), + ], ), ), ), ), - ), - ], + ]; + }, + body: Builder( + builder: (context) { + return CustomScrollView( + slivers: [ + SliverOverlapInjector( + handle: NestedScrollView.sliverOverlapAbsorberHandleFor( + context, + ), + ), + SliverList( + delegate: SliverChildBuilderDelegate( + (context, index) { + return Container( + decoration: BoxDecoration( + color: Theme.of(context) + .extension()! + .popupBG, + borderRadius: _borderRadius(index), + ), + child: Padding( + padding: const EdgeInsets.all(4), + key: Key( + "desktopSelectLanguage_${listWithoutSelected[index]}"), + child: Padding( + padding: const EdgeInsets.symmetric( + horizontal: 32), + child: RoundedContainer( + padding: const EdgeInsets.all(0), + color: index == 0 + ? Theme.of(context) + .extension()! + .currencyListItemBG + : Theme.of(context) + .extension()! + .popupBG, + child: RawMaterialButton( + onPressed: () async { + onTap(index); + }, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular( + Constants.size.circularBorderRadius, + ), + ), + child: Padding( + padding: const EdgeInsets.all(12.0), + child: Row( + crossAxisAlignment: + CrossAxisAlignment.start, + children: [ + SizedBox( + width: 20, + height: 20, + child: Radio( + activeColor: Theme.of(context) + .extension()! + .radioButtonIconEnabled, + value: true, + groupValue: index == 0, + onChanged: (_) { + onTap(index); + }, + ), + ), + const SizedBox( + width: 12, + ), + Column( + crossAxisAlignment: + CrossAxisAlignment.start, + children: [ + Text( + listWithoutSelected[index], + key: (index == 0) + ? const Key( + "desktopSettingsSelectedLanguageText") + : null, + style: + STextStyles.largeMedium14( + context), + ), + const SizedBox( + height: 2, + ), + Text( + listWithoutSelected[index], + key: (index == 0) + ? const Key( + "desktopSettingsSelectedLanguageTextDescription") + : null, + style: + STextStyles.itemSubtitle( + context), + ), + ], + ), + ], + ), + ), + ), + ), + ), + ), + ); + }, + childCount: listWithoutSelected.length, + ), + ), + ], + ); + }, + ), ), ), const Spacer(), @@ -180,183 +346,3 @@ class _LanguageDialog extends ConsumerState { ); } } - -// NestedScrollView( -// floatHeaderSlivers: true, -// headerSliverBuilder: (context, innerBoxIsScrolled) { -// return [ -// SliverOverlapAbsorber( -// handle: NestedScrollView.sliverOverlapAbsorberHandleFor( -// context), -// sliver: SliverToBoxAdapter( -// child: Padding( -// padding: const EdgeInsets.only(bottom: 16), -// child: ClipRRect( -// borderRadius: BorderRadius.circular( -// Constants.size.circularBorderRadius, -// ), -// child: TextField( -// autocorrect: Util.isDesktop ? false : true, -// enableSuggestions: -// Util.isDesktop ? false : true, -// controller: searchLanguageController, -// focusNode: searchLanguageFocusNode, -// onChanged: (newString) { -// setState(() => filter = newString); -// }, -// style: STextStyles.field(context), -// decoration: standardInputDecoration( -// "Search", -// searchLanguageFocusNode, -// context, -// ).copyWith( -// prefixIcon: Padding( -// padding: const EdgeInsets.symmetric( -// horizontal: 10, -// vertical: 16, -// ), -// child: SvgPicture.asset( -// Assets.svg.search, -// width: 16, -// height: 16, -// ), -// ), -// suffixIcon: searchLanguageController -// .text.isNotEmpty -// ? Padding( -// padding: -// const EdgeInsets.only(right: 0), -// child: UnconstrainedBox( -// child: Row( -// children: [ -// TextFieldIconButton( -// child: const XIcon(), -// onTap: () async { -// setState(() { -// searchLanguageController -// .text = ""; -// filter = ""; -// }); -// }, -// ), -// ], -// ), -// ), -// ) -// : null, -// ), -// ), -// ), -// ), -// ), -// ), -// ]; -// }, -// body: Builder( -// builder: (context) { -// return CustomScrollView( -// slivers: [ -// SliverOverlapInjector( -// handle: -// NestedScrollView.sliverOverlapAbsorberHandleFor( -// context, -// ), -// ), -// SliverList( -// delegate: SliverChildBuilderDelegate( -// (context, index) { -// return Container( -// decoration: BoxDecoration( -// color: Theme.of(context) -// .extension()! -// .popupBG, -// borderRadius: _borderRadius(index), -// ), -// child: Padding( -// padding: const EdgeInsets.all(4), -// key: Key( -// "languageSelect_${listWithoutSelected[index]}"), -// child: RoundedContainer( -// padding: const EdgeInsets.all(0), -// color: index == 0 -// ? Theme.of(context) -// .extension()! -// .currencyListItemBG -// : Theme.of(context) -// .extension()! -// .popupBG, -// child: RawMaterialButton( -// onPressed: () async { -// onTap(index); -// }, -// shape: RoundedRectangleBorder( -// borderRadius: BorderRadius.circular( -// Constants.size.circularBorderRadius, -// ), -// ), -// child: Padding( -// padding: const EdgeInsets.all(12.0), -// child: Row( -// crossAxisAlignment: -// CrossAxisAlignment.start, -// children: [ -// SizedBox( -// width: 20, -// height: 20, -// child: Radio( -// activeColor: Theme.of(context) -// .extension()! -// .radioButtonIconEnabled, -// value: true, -// groupValue: index == 0, -// onChanged: (_) { -// onTap(index); -// }, -// ), -// ), -// const SizedBox( -// width: 12, -// ), -// Column( -// crossAxisAlignment: -// CrossAxisAlignment.start, -// children: [ -// Text( -// listWithoutSelected[index], -// key: (index == 0) -// ? const Key( -// "selectedLanguageSettingsLanguageText") -// : null, -// style: STextStyles -// .largeMedium14(context), -// ), -// const SizedBox( -// height: 2, -// ), -// Text( -// listWithoutSelected[index], -// key: (index == 0) -// ? const Key( -// "selectedLanguageSettingsLanguageTextDescription") -// : null, -// style: STextStyles -// .itemSubtitle(context), -// ), -// ], -// ), -// ], -// ), -// ), -// ), -// ), -// ), -// ); -// }, -// childCount: listWithoutSelected.length, -// ), -// ), -// ], -// ); -// }, -// ), -// ),