From 5c04b37484afa2ea42065c543eb294c608f09dde Mon Sep 17 00:00:00 2001 From: ggurdin <46800240+ggurdin@users.noreply.github.com> Date: Thu, 16 Jan 2025 15:45:13 -0500 Subject: [PATCH] fix: fix overflows in lemma / morph correction overlay (#1488) --- .../word_zoom/lemma_meaning_widget.dart | 22 +- .../morphs/morphological_center_widget.dart | 260 +++++++++--------- 2 files changed, 147 insertions(+), 135 deletions(-) diff --git a/lib/pangea/toolbar/widgets/word_zoom/lemma_meaning_widget.dart b/lib/pangea/toolbar/widgets/word_zoom/lemma_meaning_widget.dart index 5b420e09f..91ab281a8 100644 --- a/lib/pangea/toolbar/widgets/word_zoom/lemma_meaning_widget.dart +++ b/lib/pangea/toolbar/widgets/word_zoom/lemma_meaning_widget.dart @@ -5,7 +5,6 @@ import 'package:flutter/material.dart'; import 'package:flutter_gen/gen_l10n/l10n.dart'; -import 'package:fluffychat/config/app_config.dart'; import 'package:fluffychat/pangea/analytics/repo/lemma_info_repo.dart'; import 'package:fluffychat/pangea/analytics/repo/lemma_info_request.dart'; import 'package:fluffychat/pangea/analytics/repo/lemma_info_response.dart'; @@ -90,12 +89,7 @@ class LemmaMeaningWidgetState extends State { if (_editMode) { _controller.text = snapshot.data!.meaning; - return Container( - constraints: const BoxConstraints( - maxWidth: AppConfig.toolbarMinWidth, - maxHeight: 225, - minHeight: 100, - ), + return Expanded( child: Column( mainAxisSize: MainAxisSize.min, children: [ @@ -119,10 +113,16 @@ class LemmaMeaningWidgetState extends State { ), const SizedBox(height: 10), Row( - mainAxisAlignment: MainAxisAlignment.spaceEvenly, + mainAxisAlignment: MainAxisAlignment.center, children: [ ElevatedButton( onPressed: () => _toggleEditMode(false), + style: ElevatedButton.styleFrom( + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(10.0), + ), + padding: const EdgeInsets.symmetric(horizontal: 10), + ), child: Text(L10n.of(context).cancel), ), const SizedBox(width: 10), @@ -132,6 +132,12 @@ class LemmaMeaningWidgetState extends State { _controller.text.isNotEmpty ? editLemmaMeaning(_controller.text) : null, + style: ElevatedButton.styleFrom( + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(10.0), + ), + padding: const EdgeInsets.symmetric(horizontal: 10), + ), child: Text(L10n.of(context).saveChanges), ), ], diff --git a/lib/pangea/toolbar/widgets/word_zoom/morphs/morphological_center_widget.dart b/lib/pangea/toolbar/widgets/word_zoom/morphs/morphological_center_widget.dart index 1fe46eb04..1b984156c 100644 --- a/lib/pangea/toolbar/widgets/word_zoom/morphs/morphological_center_widget.dart +++ b/lib/pangea/toolbar/widgets/word_zoom/morphs/morphological_center_widget.dart @@ -164,151 +164,157 @@ class MorphologicalCenterWidgetState extends State { @override Widget build(BuildContext context) { if (!editMode) { - return GestureDetector( - onLongPress: enterEditMode, - onDoubleTap: enterEditMode, - child: Tooltip( - message: L10n.of(context).doubleClickToEdit, - waitDuration: const Duration(milliseconds: 2000), - child: Text( - "$morphCopy: $tagCopy", - textAlign: TextAlign.center, + return Flexible( + child: GestureDetector( + onLongPress: enterEditMode, + onDoubleTap: enterEditMode, + child: Tooltip( + message: L10n.of(context).doubleClickToEdit, + waitDuration: const Duration(milliseconds: 2000), + child: Text( + "$morphCopy: $tagCopy", + textAlign: TextAlign.center, + ), ), ), ); } - return Column( - children: [ - Text( - "${L10n.of(context).pangeaBotIsFallible} ${L10n.of(context).whatIsTheMorphTag( - morphCopy, - widget.token.text.content, - )}", - textAlign: TextAlign.center, - style: const TextStyle(fontStyle: FontStyle.italic), - ), - const SizedBox(height: 10), - Container( - constraints: const BoxConstraints(maxWidth: 400, maxHeight: 120), - child: Scrollbar( - controller: _scrollController, - thumbVisibility: true, - child: SingleChildScrollView( + return Expanded( + child: Column( + children: [ + Text( + "${L10n.of(context).pangeaBotIsFallible} ${L10n.of(context).whatIsTheMorphTag( + morphCopy, + widget.token.text.content, + )}", + textAlign: TextAlign.center, + style: const TextStyle(fontStyle: FontStyle.italic), + ), + const SizedBox(height: 10), + Container( + constraints: const BoxConstraints(maxHeight: 120), + child: Scrollbar( controller: _scrollController, - scrollDirection: Axis.vertical, - child: Padding( - padding: const EdgeInsets.symmetric(horizontal: 16), - child: Wrap( - alignment: WrapAlignment.center, - children: allMorphTagsForEdit.map((tag) { - return Container( - margin: const EdgeInsets.all(2), - padding: EdgeInsets.zero, - decoration: BoxDecoration( - borderRadius: - const BorderRadius.all(Radius.circular(10)), - border: Border.all( - color: selectedMorphTag == tag - ? Theme.of(context).colorScheme.primary - : Colors.transparent, - style: BorderStyle.solid, - width: 2.0, - ), - ), - child: TextButton( - style: ButtonStyle( - padding: WidgetStateProperty.all( - const EdgeInsets.symmetric(horizontal: 7), + thumbVisibility: true, + child: SingleChildScrollView( + controller: _scrollController, + scrollDirection: Axis.vertical, + child: Padding( + padding: const EdgeInsets.symmetric(horizontal: 16), + child: Wrap( + alignment: WrapAlignment.center, + children: allMorphTagsForEdit.map((tag) { + return Container( + margin: const EdgeInsets.all(2), + padding: EdgeInsets.zero, + decoration: BoxDecoration( + borderRadius: + const BorderRadius.all(Radius.circular(10)), + border: Border.all( + color: selectedMorphTag == tag + ? Theme.of(context).colorScheme.primary + : Colors.transparent, + style: BorderStyle.solid, + width: 2.0, ), - backgroundColor: selectedMorphTag == tag - ? WidgetStateProperty.all( - Theme.of(context) - .colorScheme - .primary - .withAlpha(50), - ) - : null, - shape: WidgetStateProperty.all( - RoundedRectangleBorder( - borderRadius: BorderRadius.circular(10), + ), + child: TextButton( + style: ButtonStyle( + padding: WidgetStateProperty.all( + const EdgeInsets.symmetric(horizontal: 7), + ), + backgroundColor: selectedMorphTag == tag + ? WidgetStateProperty.all( + Theme.of(context) + .colorScheme + .primary + .withAlpha(50), + ) + : null, + shape: WidgetStateProperty.all( + RoundedRectangleBorder( + borderRadius: BorderRadius.circular(10), + ), ), ), + onPressed: () { + setState(() => selectedMorphTag = tag); + }, + child: Text( + getGrammarCopy( + category: widget.morphFeature, + lemma: tag, + context: context, + ) ?? + tag, + textAlign: TextAlign.center, + ), ), - onPressed: () { - setState(() => selectedMorphTag = tag); - }, - child: Text( - getGrammarCopy( - category: widget.morphFeature, - lemma: tag, - context: context, - ) ?? - tag, - textAlign: TextAlign.center, - ), - ), - ); - }).toList(), + ); + }).toList(), + ), ), ), ), ), - ), - const SizedBox(height: 10), - Row( - spacing: 10, - children: [ - // this would allow the user to totally remove the morphological feature from the token - // disabled and let's see if someone asks for it - // if (widget.morphFeature.toLowerCase() != "pos") - // TextButton( - // onPressed: () => saveChanges( - // (token) { - // token.morph.remove(widget.morphFeature); - // return token; - // }, - // ), - // child: Text(L10n.of(context).removeFeature(morphCopy)), - // ), - ElevatedButton( - style: ElevatedButton.styleFrom( - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(10.0), + const SizedBox(height: 10), + Row( + mainAxisAlignment: MainAxisAlignment.center, + spacing: 10, + children: [ + // this would allow the user to totally remove the morphological feature from the token + // disabled and let's see if someone asks for it + // if (widget.morphFeature.toLowerCase() != "pos") + // TextButton( + // onPressed: () => saveChanges( + // (token) { + // token.morph.remove(widget.morphFeature); + // return token; + // }, + // ), + // child: Text(L10n.of(context).removeFeature(morphCopy)), + // ), + ElevatedButton( + style: ElevatedButton.styleFrom( + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(10.0), + ), + padding: const EdgeInsets.symmetric(horizontal: 10), ), - padding: const EdgeInsets.symmetric(horizontal: 10), + onPressed: () { + setState(() { + editMode = false; + }); + }, + child: Text(L10n.of(context).cancel), ), - onPressed: () { - setState(() { - editMode = false; - }); - }, - child: Text(L10n.of(context).cancel), - ), - ElevatedButton( - style: ElevatedButton.styleFrom( - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(10.0), + ElevatedButton( + style: ElevatedButton.styleFrom( + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(10.0), + ), + padding: const EdgeInsets.symmetric(horizontal: 10), ), - padding: const EdgeInsets.symmetric(horizontal: 10), + onPressed: + selectedMorphTag == widget.token.morph[widget.morphFeature] + ? null + : () => showFutureLoadingDialog( + context: context, + future: () => saveChanges( + (token) { + token.morph[widget.morphFeature] = + selectedMorphTag; + return token; + }, + ), + ), + child: Text(L10n.of(context).saveChanges), ), - onPressed: selectedMorphTag == - widget.token.morph[widget.morphFeature] - ? null - : () => showFutureLoadingDialog( - context: context, - future: () => saveChanges( - (token) { - token.morph[widget.morphFeature] = selectedMorphTag; - return token; - }, - ), - ), - child: Text(L10n.of(context).saveChanges), - ), - ], - ), - ], + ], + ), + ], + ), ); } }