TF-2427: Update height of body composer when changing screen size

This commit is contained in:
HuyNguyen
2024-01-26 17:35:25 +07:00
committed by Dat Vu
parent a754741218
commit 5ad800a2b0
@@ -55,17 +55,21 @@ class _WebEditorState extends State<WebEditorWidget> {
static const double _offsetHeight = 50; static const double _offsetHeight = 50;
static const double _offsetWidth = 90; static const double _offsetWidth = 90;
static const double _defaultHtmlEditorHeight = 550;
late HtmlEditorController _editorController; late HtmlEditorController _editorController;
double? dropZoneWidth; double? dropZoneWidth;
double? dropZoneHeight; double? dropZoneHeight;
final ValueNotifier<double> _htmlEditorHeight = ValueNotifier(_defaultHtmlEditorHeight);
@override @override
void initState() { void initState() {
super.initState(); super.initState();
_editorController = widget.editorController; _editorController = widget.editorController;
log('_WebEditorState::initState:height: ${widget.height} | width: ${widget.width}');
if (widget.height != null) { if (widget.height != null) {
dropZoneHeight = widget.height! - _offsetHeight; dropZoneHeight = widget.height! - _offsetHeight;
_htmlEditorHeight.value = widget.height ?? _defaultHtmlEditorHeight;
} }
if (widget.width != null) { if (widget.width != null) {
dropZoneWidth = widget.width! - _offsetWidth; dropZoneWidth = widget.width! - _offsetWidth;
@@ -79,44 +83,61 @@ class _WebEditorState extends State<WebEditorWidget> {
if (oldWidget.direction != widget.direction) { if (oldWidget.direction != widget.direction) {
_editorController.updateBodyDirection(widget.direction.name); _editorController.updateBodyDirection(widget.direction.name);
} }
log('_EmailEditorState::didUpdateWidget():Old: ${oldWidget.height} | current: ${widget.height}');
if (oldWidget.height != widget.height) {
_htmlEditorHeight.value = widget.height ?? _defaultHtmlEditorHeight;
}
super.didUpdateWidget(oldWidget); super.didUpdateWidget(oldWidget);
} }
@override
void dispose() {
_htmlEditorHeight.dispose();
super.dispose();
}
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return HtmlEditor( return ValueListenableBuilder(
key: const Key('web_editor'), valueListenable: _htmlEditorHeight,
controller: _editorController, builder: (context, height, _) {
htmlEditorOptions: HtmlEditorOptions( return HtmlEditor(
shouldEnsureVisible: true, key: Key('web_editor_$height'),
hint: '', controller: _editorController,
darkMode: false, htmlEditorOptions: HtmlEditorOptions(
initialText: widget.content, shouldEnsureVisible: true,
customBodyCssStyle: HtmlUtils.customCssStyleHtmlEditor(direction: widget.direction), hint: '',
spellCheck: true, darkMode: false,
), initialText: widget.content,
htmlToolbarOptions: const HtmlToolbarOptions( customBodyCssStyle: HtmlUtils.customCssStyleHtmlEditor(direction: widget.direction),
toolbarType: ToolbarType.hide, spellCheck: true,
defaultToolbarButtons: [], ),
), htmlToolbarOptions: const HtmlToolbarOptions(
otherOptions: OtherOptions( toolbarType: ToolbarType.hide,
height: 550, defaultToolbarButtons: [],
dropZoneWidth: dropZoneWidth, ),
dropZoneHeight: dropZoneHeight, otherOptions: OtherOptions(
), height: height,
callbacks: Callbacks( dropZoneWidth: dropZoneWidth,
onBeforeCommand: widget.onChangeContent, dropZoneHeight: dropZoneHeight,
onChangeContent: widget.onChangeContent, ),
onInit: () => widget.onInitial?.call(widget.content), callbacks: Callbacks(
onFocus: widget.onFocus, onBeforeCommand: widget.onChangeContent,
onBlur: widget.onUnFocus, onChangeContent: widget.onChangeContent,
onMouseDown: () => widget.onMouseDown?.call(context), onInit: () => widget.onInitial?.call(widget.content),
onChangeSelection: widget.onEditorSettings, onFocus: widget.onFocus,
onChangeCodeview: widget.onChangeContent, onBlur: widget.onUnFocus,
onImageUpload: widget.onImageUploadSuccessAction, onMouseDown: () => widget.onMouseDown?.call(context),
onImageUploadError: widget.onImageUploadFailureAction, onChangeSelection: widget.onEditorSettings,
onTextFontSizeChanged: widget.onEditorTextSizeChanged, onChangeCodeview: widget.onChangeContent,
), onImageUpload: widget.onImageUploadSuccessAction,
onImageUploadError: widget.onImageUploadFailureAction,
onTextFontSizeChanged: widget.onEditorTextSizeChanged,
),
);
}
); );
} }
} }