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

TF-2116 Create Mobile/Tablet container view

Browse Source 
(cherry picked from commit a8f9993913b1c4a42eb58506c4b350ec8dc4252f)
This commit is contained in:
dab246
2023-09-07 09:47:11 +07:00
committed by Dat H. Pham
parent f7772e0ba7
commit cbba97279a
4 changed files with 214 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/features/composer/presentation/styles/mobile/mobile_container_view_style.dart
+13
View File
@@ -0,0 +1,13 @@
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/utils/platform_info.dart';
import 'package:flutter/material.dart';
class MobileContainerViewStyle {
static const Color outSideBackgroundColor = Colors.white;
static const Color backgroundColor = Colors.white;
static final Color keyboardToolbarBackgroundColor = PlatformInfo.isIOS
? AppColor.colorBackgroundKeyboard
: AppColor.colorBackgroundKeyboardAndroid;
static const EdgeInsets keyboardToolbarPadding = EdgeInsets.only(bottom: 64);
}
lib/features/composer/presentation/styles/mobile/tablet_container_view_style.dart
+41
View File
@@ -0,0 +1,41 @@
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/utils/responsive_utils.dart';
import 'package:core/utils/platform_info.dart';
import 'package:flutter/material.dart';
class TabletContainerViewStyle {
static const double radius = 28;
static const double elevation = 16;
static const Color backgroundColor = Colors.white;
static const Color outSideBackgroundColor = Colors.black38;
static final Color keyboardToolbarBackgroundColor = PlatformInfo.isIOS
? AppColor.colorBackgroundKeyboard
: AppColor.colorBackgroundKeyboardAndroid;
static const EdgeInsets keyboardToolbarPadding = EdgeInsets.only(bottom: 64);
static EdgeInsetsGeometry getMargin(
BuildContext context,
ResponsiveUtils responsiveUtils
) {
if (responsiveUtils.isTablet(context)) {
return const EdgeInsetsDirectional.all(24);
} else {
return const EdgeInsetsDirectional.symmetric(vertical: 24);
}
}
static double getWidth(
BuildContext context,
ResponsiveUtils responsiveUtils
) {
final currentWidth = responsiveUtils.getSizeScreenWidth(context);
if (responsiveUtils.isTablet(context)) {
return currentWidth;
} else {
return currentWidth * 0.7;
}
}
}
lib/features/composer/presentation/view/mobile/mobile_container_view.dart
+74
View File
@@ -0,0 +1,74 @@
import 'package:core/presentation/utils/responsive_utils.dart';
import 'package:flutter/material.dart';
import 'package:flutter_keyboard_visibility/flutter_keyboard_visibility.dart';
import 'package:get/get.dart';
import 'package:rich_text_composer/rich_text_composer.dart';
import 'package:rich_text_composer/views/widgets/rich_text_keyboard_toolbar.dart';
import 'package:tmail_ui_user/features/composer/presentation/styles/mobile/mobile_container_view_style.dart';
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
typedef OnInsertImageAction = Function(BoxConstraints constraints);
class MobileContainerView extends StatelessWidget {
final Widget Function(BuildContext context) childBuilder;
final RichTextController keyboardRichTextController;
final VoidCallback onCloseViewAction;
final VoidCallback? onAttachFileAction;
final OnInsertImageAction? onInsertImageAction;
final VoidCallback? onClearFocusAction;
final _responsiveUtils = Get.find<ResponsiveUtils>();
MobileContainerView({
super.key,
required this.childBuilder,
required this.keyboardRichTextController,
required this.onCloseViewAction,
this.onAttachFileAction,
this.onInsertImageAction,
this.onClearFocusAction,
});
@override
Widget build(BuildContext context) {
return WillPopScope(
onWillPop: () async {
onCloseViewAction.call();
return true;
},
child: GestureDetector(
onTap: onClearFocusAction,
child: Scaffold(
backgroundColor: MobileContainerViewStyle.outSideBackgroundColor,
resizeToAvoidBottomInset: false,
body: LayoutBuilder(builder: (context, constraints) {
return KeyboardVisibilityBuilder(builder: (context, isKeyboardVisible) {
return KeyboardRichText(
richTextController: keyboardRichTextController,
keyBroadToolbar: RichTextKeyboardToolBar(
backgroundKeyboardToolBarColor: MobileContainerViewStyle.keyboardToolbarBackgroundColor,
isLandScapeMode: _responsiveUtils.isLandscapeMobile(context),
insertAttachment: onAttachFileAction,
insertImage: () => onInsertImageAction != null
? onInsertImageAction!(constraints)
: null,
richTextController: keyboardRichTextController,
titleQuickStyleBottomSheet: AppLocalizations.of(context).titleQuickStyles,
titleBackgroundBottomSheet: AppLocalizations.of(context).titleBackground,
titleForegroundBottomSheet: AppLocalizations.of(context).titleForeground,
titleFormatBottomSheet: AppLocalizations.of(context).titleFormat,
titleBack: AppLocalizations.of(context).format,
),
paddingChild: isKeyboardVisible
? MobileContainerViewStyle.keyboardToolbarPadding
: EdgeInsets.zero,
child: childBuilder(context),
);
});
})
),
)
);
}
}
lib/features/composer/presentation/view/mobile/tablet_container_view.dart
+86
View File
@@ -0,0 +1,86 @@
import 'package:core/presentation/utils/responsive_utils.dart';
import 'package:flutter/material.dart';
import 'package:flutter_keyboard_visibility/flutter_keyboard_visibility.dart';
import 'package:get/get.dart';
import 'package:rich_text_composer/rich_text_composer.dart';
import 'package:rich_text_composer/views/widgets/rich_text_keyboard_toolbar.dart';
import 'package:tmail_ui_user/features/composer/presentation/styles/mobile/tablet_container_view_style.dart';
import 'package:tmail_ui_user/features/composer/presentation/view/mobile/mobile_container_view.dart';
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
class TabletContainerView extends StatelessWidget {
final Widget Function(BuildContext context, BoxConstraints constraints) childBuilder;
final RichTextController keyboardRichTextController;
final VoidCallback onCloseViewAction;
final VoidCallback? onAttachFileAction;
final OnInsertImageAction? onInsertImageAction;
final VoidCallback? onClearFocusAction;
final _responsiveUtils = Get.find<ResponsiveUtils>();
TabletContainerView({
super.key,
required this.childBuilder,
required this.keyboardRichTextController,
required this.onCloseViewAction,
this.onAttachFileAction,
this.onInsertImageAction,
this.onClearFocusAction,
});
@override
Widget build(BuildContext context) {
return WillPopScope(
onWillPop: () async {
onCloseViewAction.call();
return true;
},
child: GestureDetector(
onTap: onClearFocusAction,
child: Scaffold(
backgroundColor: TabletContainerViewStyle.outSideBackgroundColor,
body: LayoutBuilder(builder: (context, constraints) {
return KeyboardVisibilityBuilder(builder: (context, isKeyboardVisible) {
return KeyboardRichText(
richTextController: keyboardRichTextController,
keyBroadToolbar: RichTextKeyboardToolBar(
backgroundKeyboardToolBarColor: TabletContainerViewStyle.keyboardToolbarBackgroundColor,
isLandScapeMode: _responsiveUtils.isLandscapeMobile(context),
insertAttachment: onAttachFileAction,
insertImage: () => onInsertImageAction != null
? onInsertImageAction!(constraints)
: null,
richTextController: keyboardRichTextController,
titleQuickStyleBottomSheet: AppLocalizations.of(context).titleQuickStyles,
titleBackgroundBottomSheet: AppLocalizations.of(context).titleBackground,
titleForegroundBottomSheet: AppLocalizations.of(context).titleForeground,
titleFormatBottomSheet: AppLocalizations.of(context).titleFormat,
titleBack: AppLocalizations.of(context).format,
),
paddingChild: isKeyboardVisible
? TabletContainerViewStyle.keyboardToolbarPadding
: EdgeInsets.zero,
child: Center(
child: Card(
elevation: TabletContainerViewStyle.elevation,
margin: TabletContainerViewStyle.getMargin(context, _responsiveUtils),
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(TabletContainerViewStyle.radius))
),
clipBehavior: Clip.antiAlias,
child: Container(
color: TabletContainerViewStyle.backgroundColor,
width: TabletContainerViewStyle.getWidth(context, _responsiveUtils),
child: childBuilder.call(context, constraints)
),
),
),
);
});
})
),
)
);
}
}