eduvia/workavia-mail-front
11
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

TF-1486 Update size, padding for identity creator view

Browse Source 
(cherry picked from commit 028bbcbdd8e433ac5221bb4c9bf135d0f53518e3)
This commit is contained in:
dab246
2023-07-12 16:10:49 +07:00
committed by Dat Vu
parent cbf64b32eb
commit 2f4f8beec4
2 changed files with 145 additions and 185 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/features/identity_creator/presentation/identity_creator_view.dart
+143 -183
View File
@@ -43,133 +43,120 @@ class IdentityCreatorView extends GetWidget<IdentityCreatorController> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return ResponsiveWidget( return ResponsiveWidget(
responsiveUtils: _responsiveUtils, responsiveUtils: _responsiveUtils,
mobile: Card( mobile: Card(
margin: EdgeInsets.zero, margin: EdgeInsets.zero,
borderOnForeground: false, borderOnForeground: false,
color: Colors.transparent, color: Colors.transparent,
child: SafeArea( child: SafeArea(
top: PlatformInfo.isMobile, top: PlatformInfo.isMobile,
bottom: false, bottom: false,
left: false, left: false,
right: false, right: false,
child: ClipRRect( child: ClipRRect(
borderRadius: const BorderRadius.only( borderRadius: const BorderRadius.only(
topRight: Radius.circular(16), topRight: Radius.circular(16),
topLeft: Radius.circular(16)), topLeft: Radius.circular(16)),
child: GestureDetector( child: GestureDetector(
onTap: () => controller.clearFocusEditor(context), onTap: () => controller.clearFocusEditor(context),
child: Scaffold( child: Scaffold(
backgroundColor: Colors.white, backgroundColor: Colors.white,
body: Container( body: Container(
decoration: const BoxDecoration( decoration: const BoxDecoration(
color: Colors.white, color: Colors.white,
borderRadius: BorderRadius.only( borderRadius: BorderRadius.only(
topRight: Radius.circular(16), topRight: Radius.circular(16),
topLeft: Radius.circular(16)), topLeft: Radius.circular(16)),
boxShadow: [ boxShadow: [
BoxShadow( BoxShadow(
color: AppColor.colorShadowLayerBottom, color: AppColor.colorShadowLayerBottom,
blurRadius: 96, blurRadius: 96,
spreadRadius: 96, spreadRadius: 96,
offset: Offset.zero), offset: Offset.zero),
BoxShadow( BoxShadow(
color: AppColor.colorShadowLayerTop, color: AppColor.colorShadowLayerTop,
blurRadius: 2, blurRadius: 2,
spreadRadius: 2, spreadRadius: 2,
offset: Offset.zero), offset: Offset.zero),
]), ]),
child: _buildBodyMobile(context), child: _buildBodyView(context),
),
), ),
), ),
), ),
), ),
), ),
landscapeMobile: Scaffold( ),
backgroundColor: Colors.white, landscapeMobile: Scaffold(
body: GestureDetector( backgroundColor: Colors.white,
onTap: () => controller.clearFocusEditor(context), body: GestureDetector(
child: SafeArea( onTap: () => controller.clearFocusEditor(context),
child: ClipRRect( child: SafeArea(
borderRadius: const BorderRadius.all(Radius.zero), child: _buildBodyView(context),
child: _buildBodyMobile(context) ),
)
),
tablet: Scaffold(
backgroundColor: Colors.black38,
body: GestureDetector(
onTap: () => controller.clearFocusEditor(context),
child: Center(
child: Padding(
padding: const EdgeInsetsDirectional.symmetric(horizontal: 24),
child: Card(
color: Colors.transparent,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(16))
), ),
child: Container(
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.all(Radius.circular(16))
),
width: math.max(_responsiveUtils.getSizeScreenWidth(context) * 0.4, 700),
height: _responsiveUtils.getSizeScreenHeight(context) * 0.8,
child: ClipRRect(
borderRadius: const BorderRadius.all(Radius.circular(16)),
child: _buildBodyView(context)
)
)
), ),
) )
)
), ),
tablet: Scaffold( ),
backgroundColor: Colors.black38, desktop: Scaffold(
body: GestureDetector( backgroundColor: Colors.black38,
onTap: () => controller.clearFocusEditor(context), body: GestureDetector(
child: Center(child: Card( onTap: () => controller.clearFocusEditor(context),
color: Colors.transparent, child: Center(child: Card(
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(16))), color: Colors.transparent,
child: Container( shape: const RoundedRectangleBorder(
decoration: const BoxDecoration( borderRadius: BorderRadius.all(Radius.circular(16))
color: Colors.white,
borderRadius: BorderRadius.all(Radius.circular(16))),
width: _responsiveUtils.getSizeScreenWidth(context) * 0.85,
height: _responsiveUtils.getSizeScreenHeight(context) * 0.6,
child: ClipRRect(
borderRadius: const BorderRadius.all(Radius.circular(16)),
child: _buildBodyMobile(context)
)
)
))
), ),
), child: Container(
landscapeTablet: Scaffold( decoration: const BoxDecoration(
backgroundColor: Colors.black38, color: Colors.white,
body: GestureDetector( borderRadius: BorderRadius.all(Radius.circular(16))
onTap: () => controller.clearFocusEditor(context), ),
child: Center(child: Card( width: math.max(_responsiveUtils.getSizeScreenWidth(context) * 0.4, 800),
color: Colors.transparent, height: _responsiveUtils.getSizeScreenHeight(context) * 0.8,
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(16))), child: ClipRRect(
child: Container( borderRadius: const BorderRadius.all(Radius.circular(16)),
decoration: const BoxDecoration( child: _buildBodyView(context)
color: Colors.white, )
borderRadius: BorderRadius.all(Radius.circular(16))),
width: _responsiveUtils.getSizeScreenWidth(context) * 0.65,
height: _responsiveUtils.getSizeScreenHeight(context) * 0.8,
child: ClipRRect(
borderRadius: const BorderRadius.all(Radius.circular(16)),
child: _buildBodyMobile(context)
)
)
))
)
),
desktop: Scaffold(
backgroundColor: Colors.black38,
body: GestureDetector(
onTap: () => controller.clearFocusEditor(context),
child: Center(child: Card(
color: Colors.transparent,
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(16))),
child: Container(
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.all(Radius.circular(16))),
width: math.max(_responsiveUtils.getSizeScreenWidth(context) * 0.4, 650),
height: _responsiveUtils.getSizeScreenHeight(context) * 0.75,
child: ClipRRect(
borderRadius: const BorderRadius.all(Radius.circular(16)),
child: _buildBodyMobile(context)
)
)
)),
) )
)),
) )
)
); );
} }
Widget _buildBodyMobile(BuildContext context) { Widget _buildBodyView(BuildContext context) {
final bodyCreatorView = SingleChildScrollView( final bodyCreatorView = SingleChildScrollView(
controller: controller.scrollController, controller: controller.scrollController,
physics: const ClampingScrollPhysics(), physics: const ClampingScrollPhysics(),
child: Padding( child: Padding(
padding: const EdgeInsets.all(24.0), padding: const EdgeInsetsDirectional.symmetric(vertical: 12, horizontal: 24),
child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [ child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
Obx(() => IdentityInputFieldBuilder( Obx(() => IdentityInputFieldBuilder(
AppLocalizations.of(context).name, AppLocalizations.of(context).name,
@@ -237,8 +224,10 @@ class IdentityCreatorView extends GetWidget<IdentityCreatorController> {
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(12),
border: Border.all(color: AppColor.colorInputBorderCreateMailbox), border: Border.all(color: AppColor.colorInputBorderCreateMailbox),
), ),
padding: const EdgeInsetsDirectional.all(16),
child: _buildSignatureHtmlTemplate(context), child: _buildSignatureHtmlTemplate(context),
), ),
const SizedBox(height: 12),
if (_isMobile(context)) if (_isMobile(context))
_buildActionButtonMobile(context) _buildActionButtonMobile(context)
else else
@@ -309,15 +298,16 @@ class IdentityCreatorView extends GetWidget<IdentityCreatorController> {
Widget _buildSignatureHtmlTemplate(BuildContext context) { Widget _buildSignatureHtmlTemplate(BuildContext context) {
final htmlEditor = PlatformInfo.isWeb final htmlEditor = PlatformInfo.isWeb
? _buildHtmlEditorWeb(context, controller.contentHtmlEditor ?? '') ? _buildHtmlEditorWeb(context, controller.contentHtmlEditor ?? '')
: _buildHtmlEditor(context, initialContent: controller.contentHtmlEditor ?? ''); : _buildHtmlEditor(context, initialContent: controller.contentHtmlEditor ?? '');
return Column( return Column(
children: [ children: [
if(PlatformInfo.isWeb) if (PlatformInfo.isWeb)
ToolbarRichTextWebBuilder( ToolbarRichTextWebBuilder(
richTextWebController: controller.richTextWebController, richTextWebController: controller.richTextWebController,
padding: const EdgeInsets.only(top: 22, bottom: 8.0, left: 24, right: 12)), padding: const EdgeInsets.only(bottom: 12)
),
htmlEditor, htmlEditor,
], ],
); );
@@ -325,102 +315,72 @@ class IdentityCreatorView extends GetWidget<IdentityCreatorController> {
Widget _buildHtmlEditorWeb(BuildContext context, String initContent) { Widget _buildHtmlEditorWeb(BuildContext context, String initContent) {
log('IdentityCreatorView::_buildHtmlEditorWeb(): initContent: $initContent'); log('IdentityCreatorView::_buildHtmlEditorWeb(): initContent: $initContent');
return Padding( return html_editor_browser.HtmlEditor(
padding: const EdgeInsets.only(left: 14.0, right: 2.0), key: const Key('identity_create_editor_web'),
child: html_editor_browser.HtmlEditor( controller: controller.richTextWebController.editorController,
key: const Key('identity_create_editor_web'), htmlEditorOptions: html_editor_browser.HtmlEditorOptions(
controller: controller.richTextWebController.editorController, shouldEnsureVisible: true,
htmlEditorOptions: html_editor_browser.HtmlEditorOptions( hint: '',
hint: '', darkMode: false,
darkMode: false, customBodyCssStyle: HtmlUtils.customCssStyleHtmlEditor(direction: AppUtils.getCurrentDirection(context)),
customBodyCssStyle: HtmlUtils.customCssStyleHtmlEditor(direction: AppUtils.getCurrentDirection(context)), ),
), blockQuotedContent: initContent,
blockQuotedContent: initContent, htmlToolbarOptions: const html_editor_browser.HtmlToolbarOptions(
htmlToolbarOptions: const html_editor_browser.HtmlToolbarOptions( toolbarType: html_editor_browser.ToolbarType.hide,
toolbarType: html_editor_browser.ToolbarType.hide, defaultToolbarButtons: []
defaultToolbarButtons: []), ),
otherOptions: const html_editor_browser.OtherOptions(height: 150), otherOptions: const html_editor_browser.OtherOptions(height: 200),
callbacks: html_editor_browser.Callbacks(onBeforeCommand: (currentHtml) { callbacks: html_editor_browser.Callbacks(
log('IdentityCreatorView::_buildHtmlEditorWeb(): onBeforeCommand : $currentHtml'); onBeforeCommand: controller.updateContentHtmlEditor,
controller.updateContentHtmlEditor(currentHtml); onChangeContent: controller.updateContentHtmlEditor,
}, onChangeContent: (changed) { onInit: () {
log('IdentityCreatorView::_buildHtmlEditorWeb(): onChangeContent : $changed');
controller.updateContentHtmlEditor(changed);
}, onInit: () {
log('IdentityCreatorView::_buildHtmlEditorWeb(): onInit');
controller.richTextWebController.editorController.setFullScreen(); controller.richTextWebController.editorController.setFullScreen();
controller.updateContentHtmlEditor(initContent); controller.updateContentHtmlEditor(initContent);
}, onFocus: () { }, onFocus: () {
log('IdentityCreatorView::_buildHtmlEditorWeb(): onFocus');
FocusManager.instance.primaryFocus?.unfocus(); FocusManager.instance.primaryFocus?.unfocus();
Future.delayed(const Duration(milliseconds: 500), () { Future.delayed(const Duration(milliseconds: 500), () {
controller.richTextWebController.editorController.setFocus(); controller.richTextWebController.editorController.setFocus();
}); });
controller.richTextWebController.closeAllMenuPopup(); controller.richTextWebController.closeAllMenuPopup();
}, onChangeSelection: (settings) { },
controller.richTextWebController.onEditorSettingsChange(settings); onChangeSelection: controller.richTextWebController.onEditorSettingsChange,
}, onChangeCodeview: (contentChanged) { onChangeCodeview: controller.updateContentHtmlEditor
log('IdentityCreatorView::_buildHtmlEditorWeb(): onChangeCodeView : $contentChanged');
controller.updateContentHtmlEditor(contentChanged);
}),
), ),
); );
} }
Widget _buildHtmlEditor(BuildContext context, {String? initialContent}) { Widget _buildHtmlEditor(BuildContext context, {String? initialContent}) {
return Padding( return HtmlEditor(
padding: const EdgeInsets.all(16), key: controller.htmlKey,
child: HtmlEditor( minHeight: controller.htmlEditorMinHeight,
key: controller.htmlKey, addDefaultSelectionMenuItems: false,
minHeight: controller.htmlEditorMinHeight, initialContent: initialContent ?? '',
addDefaultSelectionMenuItems: false, customStyleCss: HtmlUtils.customCssStyleHtmlEditor(direction: AppUtils.getCurrentDirection(context)),
initialContent: initialContent ?? '', onCreated: (editorApi) => controller.initRichTextForMobile(context, editorApi),
customStyleCss: HtmlUtils.customCssStyleHtmlEditor(direction: AppUtils.getCurrentDirection(context)),
onCreated: (editorApi) => controller.initRichTextForMobile(context, editorApi),
),
); );
} }
Widget _buildActionButtonDesktop(BuildContext context) { Widget _buildActionButtonDesktop(BuildContext context) {
return Row( return Row(
children: [ children: [
_buildCheckboxIdentityDefault(context), Expanded(child: _buildCheckboxIdentityDefault(context)),
Expanded( const SizedBox(width: 12),
child: Padding( _buildCancelButton(context, width: 156),
padding: const EdgeInsetsDirectional.only( const SizedBox(width: 12),
top: 24.0, _buildSaveButton(context, width: 156)
bottom: 40.0,
start: 12,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
_buildCancelButton(context, width: 156),
const SizedBox(width: 12),
_buildSaveButton(context, width: 156),
],
),
),
)
], ],
); );
} }
Widget _buildActionButtonMobile(BuildContext context) { Widget _buildActionButtonMobile(BuildContext context) {
return Column(children: [ return Column(children: [
Padding( _buildCheckboxIdentityDefault(context),
padding: const EdgeInsets.only(top: 24), const SizedBox(height: 24),
child: _buildCheckboxIdentityDefault(context)), Row(children: [
Container( Expanded(child: _buildCancelButton(context)),
alignment: Alignment.center, const SizedBox(width: 12),
color: Colors.white, Expanded(child: _buildSaveButton(context))
padding: const EdgeInsets.only(top: 24, bottom: 64), ])
child: Row(children: [
Expanded(child: _buildCancelButton(context)),
const SizedBox(width: 12),
Expanded(child: _buildSaveButton(context))
]),
)
]); ]);
} }
lib/features/identity_creator/presentation/widgets/set_default_identity_checkbox_builder.dart
+2 -2
View File
@@ -42,8 +42,8 @@ class SetDefaultIdentityCheckboxBuilder extends StatelessWidget {
)), )),
), ),
), ),
Padding( const SizedBox(width: 8),
padding: const EdgeInsetsDirectional.only(start: 8), Flexible(
child: Text( child: Text(
AppLocalizations.of(context).setDefaultIdentity, AppLocalizations.of(context).setDefaultIdentity,
style: const TextStyle( style: const TextStyle(