From 832879b9c280bec21728ee382af878f95a23be53 Mon Sep 17 00:00:00 2001 From: ggurdin <46800240+ggurdin@users.noreply.github.com> Date: Mon, 28 Apr 2025 11:48:32 -0400 Subject: [PATCH] chore: scroll to top of learning settings dialog on language selection error (#2569) --- .../pages/settings_learning.dart | 9 + .../pages/settings_learning_view.dart | 252 ++++++++++-------- .../widgets/p_language_dropdown.dart | 7 +- 3 files changed, 149 insertions(+), 119 deletions(-) diff --git a/lib/pangea/learning_settings/pages/settings_learning.dart b/lib/pangea/learning_settings/pages/settings_learning.dart index a30ad6913..1275c180b 100644 --- a/lib/pangea/learning_settings/pages/settings_learning.dart +++ b/lib/pangea/learning_settings/pages/settings_learning.dart @@ -40,6 +40,8 @@ class SettingsLearningController extends State { final GlobalKey formKey = GlobalKey(); String? languageMatchError; + final ScrollController scrollController = ScrollController(); + @override void initState() { super.initState(); @@ -50,6 +52,7 @@ class SettingsLearningController extends State { @override void dispose() { tts.dispose(); + scrollController.dispose(); super.dispose(); } @@ -100,6 +103,12 @@ class SettingsLearningController extends State { setState(() { languageMatchError = L10n.of(context).noIdenticalLanguages; }); + + scrollController.animateTo( + 0, + duration: const Duration(milliseconds: 300), + curve: Curves.easeInOut, + ); return; } diff --git a/lib/pangea/learning_settings/pages/settings_learning_view.dart b/lib/pangea/learning_settings/pages/settings_learning_view.dart index 5cd146e6c..1609b3e1b 100644 --- a/lib/pangea/learning_settings/pages/settings_learning_view.dart +++ b/lib/pangea/learning_settings/pages/settings_learning_view.dart @@ -124,139 +124,157 @@ class SettingsLearningView extends StatelessWidget { child: ListTileTheme( iconColor: Theme.of(context).textTheme.bodyLarge!.color, child: MaxWidthBody( + withScrolling: false, child: Column( children: [ - SingleChildScrollView( - child: Padding( - padding: const EdgeInsets.all(16.0), + Expanded( + child: SingleChildScrollView( + controller: controller.scrollController, child: Column( - spacing: 16.0, children: [ - PLanguageDropdown( - onChange: (lang) => - controller.setSelectedLanguage( - sourceLanguage: lang, - ), - initialLanguage: - controller.selectedSourceLanguage ?? - LanguageModel.unknown, - languages: MatrixState - .pangeaController.pLanguageStore.baseOptions, - isL2List: false, - decorationText: L10n.of(context).myBaseLanguage, - hasError: controller.languageMatchError != null, - backgroundColor: Theme.of(context) - .colorScheme - .surfaceContainerHigh, - ), - PLanguageDropdown( - onChange: (lang) => - controller.setSelectedLanguage( - targetLanguage: lang, - ), - initialLanguage: - controller.selectedTargetLanguage, - languages: MatrixState.pangeaController - .pLanguageStore.targetOptions, - isL2List: true, - decorationText: L10n.of(context).iWantToLearn, - error: controller.languageMatchError, - backgroundColor: Theme.of(context) - .colorScheme - .surfaceContainerHigh, - ), - CountryPickerDropdown(controller), - LanguageLevelDropdown( - initialLevel: controller.cefrLevel, - onChanged: controller.setCefrLevel, - ), - Container( - decoration: BoxDecoration( - border: Border.all( - color: Colors.white54, - ), - borderRadius: BorderRadius.circular(8.0), - ), - padding: const EdgeInsets.all(8.0), + Padding( + padding: const EdgeInsets.all(16.0), child: Column( + spacing: 16.0, children: [ - ProfileSettingsSwitchListTile.adaptive( - defaultValue: controller.getToolSetting( - ToolSetting.autoIGC, + PLanguageDropdown( + onChange: (lang) => + controller.setSelectedLanguage( + sourceLanguage: lang, ), - title: - ToolSetting.autoIGC.toolName(context), - subtitle: ToolSetting.autoIGC - .toolDescription(context), - onChange: (bool value) => - controller.updateToolSetting( - ToolSetting.autoIGC, - value, + initialLanguage: + controller.selectedSourceLanguage ?? + LanguageModel.unknown, + languages: MatrixState.pangeaController + .pLanguageStore.baseOptions, + isL2List: false, + decorationText: + L10n.of(context).myBaseLanguage, + hasError: + controller.languageMatchError != null, + backgroundColor: Theme.of(context) + .colorScheme + .surfaceContainerHigh, + ), + PLanguageDropdown( + onChange: (lang) => + controller.setSelectedLanguage( + targetLanguage: lang, ), - enabled: true, + initialLanguage: + controller.selectedTargetLanguage, + languages: MatrixState.pangeaController + .pLanguageStore.targetOptions, + isL2List: true, + decorationText: + L10n.of(context).iWantToLearn, + error: controller.languageMatchError, + backgroundColor: Theme.of(context) + .colorScheme + .surfaceContainerHigh, ), - ProfileSettingsSwitchListTile.adaptive( - defaultValue: controller.getToolSetting( - ToolSetting.enableAutocorrect, + CountryPickerDropdown(controller), + LanguageLevelDropdown( + initialLevel: controller.cefrLevel, + onChanged: controller.setCefrLevel, + ), + Container( + decoration: BoxDecoration( + border: Border.all( + color: Colors.white54, + ), + borderRadius: BorderRadius.circular(8.0), + ), + padding: const EdgeInsets.all(8.0), + child: Column( + children: [ + ProfileSettingsSwitchListTile.adaptive( + defaultValue: + controller.getToolSetting( + ToolSetting.autoIGC, + ), + title: ToolSetting.autoIGC + .toolName(context), + subtitle: ToolSetting.autoIGC + .toolDescription(context), + onChange: (bool value) => + controller.updateToolSetting( + ToolSetting.autoIGC, + value, + ), + enabled: true, + ), + ProfileSettingsSwitchListTile.adaptive( + defaultValue: + controller.getToolSetting( + ToolSetting.enableAutocorrect, + ), + title: ToolSetting.enableAutocorrect + .toolName(context), + subtitle: ToolSetting + .enableAutocorrect + .toolDescription(context), + onChange: (bool value) { + controller.updateToolSetting( + ToolSetting.enableAutocorrect, + value, + ); + if (value) { + _showKeyboardSettingsDialog( + context, + ); + } + }, + enabled: true, + ), + ], ), - title: ToolSetting.enableAutocorrect - .toolName(context), - subtitle: ToolSetting.enableAutocorrect - .toolDescription(context), - onChange: (bool value) { - controller.updateToolSetting( - ToolSetting.enableAutocorrect, - value, - ); - if (value) { - _showKeyboardSettingsDialog( - context, - ); - } - }, - enabled: true, ), - ], - ), - ), - for (final toolSetting in ToolSetting.values.where( - (tool) => - tool.isAvailableSetting && - tool != ToolSetting.autoIGC && - tool != ToolSetting.enableAutocorrect, - )) - Column( - children: [ - ProfileSettingsSwitchListTile.adaptive( - defaultValue: - controller.getToolSetting(toolSetting), - title: toolSetting.toolName(context), - subtitle: toolSetting == - ToolSetting.enableTTS && - !controller.isTTSSupported - ? null - : toolSetting.toolDescription(context), - onChange: (bool value) => - controller.updateToolSetting( - toolSetting, - value, + for (final toolSetting + in ToolSetting.values.where( + (tool) => + tool.isAvailableSetting && + tool != ToolSetting.autoIGC && + tool != ToolSetting.enableAutocorrect, + )) + Column( + children: [ + ProfileSettingsSwitchListTile.adaptive( + defaultValue: controller + .getToolSetting(toolSetting), + title: toolSetting.toolName(context), + subtitle: toolSetting == + ToolSetting.enableTTS && + !controller.isTTSSupported + ? null + : toolSetting + .toolDescription(context), + onChange: (bool value) => + controller.updateToolSetting( + toolSetting, + value, + ), + ), + ], + ), + SwitchListTile.adaptive( + value: controller.publicProfile, + onChanged: controller.setPublicProfile, + title: Text( + L10n.of(context).publicProfileTitle, ), + subtitle: Text( + L10n.of(context).publicProfileDesc, + ), + activeColor: AppConfig.activeToggleColor, + contentPadding: EdgeInsets.zero, + ), + ResetInstructionsListTile( + controller: controller, ), ], ), - SwitchListTile.adaptive( - value: controller.publicProfile, - onChanged: controller.setPublicProfile, - title: Text( - L10n.of(context).publicProfileTitle, - ), - subtitle: Text( - L10n.of(context).publicProfileDesc, - ), - activeColor: AppConfig.activeToggleColor, - contentPadding: EdgeInsets.zero, ), - ResetInstructionsListTile(controller: controller), ], ), ), diff --git a/lib/pangea/learning_settings/widgets/p_language_dropdown.dart b/lib/pangea/learning_settings/widgets/p_language_dropdown.dart index afbcee914..0fa8a9c84 100644 --- a/lib/pangea/learning_settings/widgets/p_language_dropdown.dart +++ b/lib/pangea/learning_settings/widgets/p_language_dropdown.dart @@ -102,12 +102,15 @@ class PLanguageDropdownState extends State { labelText: widget.decorationText, enabledBorder: hasError ? OutlineInputBorder( - borderSide: - BorderSide(color: Theme.of(context).colorScheme.error), + borderRadius: BorderRadius.circular(14), + borderSide: BorderSide( + color: Theme.of(context).colorScheme.error, + ), ) : null, focusedBorder: hasError ? OutlineInputBorder( + borderRadius: BorderRadius.circular(14), borderSide: BorderSide( color: Theme.of(context).colorScheme.error, width: 2,