TF-161 Rotate the display in mobile view
This commit is contained in:
@@ -14,6 +14,8 @@ class ResponsiveUtils {
|
||||
static const double _desktopVerticalMargin = 144.0;
|
||||
static const double _desktopHorizontalMargin = 234.0;
|
||||
|
||||
bool isMobileDevice(BuildContext context) => MediaQuery.of(context).size.shortestSide < 600;
|
||||
|
||||
double getSizeWidthScreen(BuildContext context) => MediaQuery.of(context).size.width;
|
||||
|
||||
double getSizeHeightScreen(BuildContext context) => MediaQuery.of(context).size.height;
|
||||
@@ -24,6 +26,10 @@ class ResponsiveUtils {
|
||||
|
||||
bool isDesktop(BuildContext context) => getSizeWidthScreen(context) >= minDesktopWidth;
|
||||
|
||||
bool isPortrait(BuildContext context) => MediaQuery.of(context).orientation == Orientation.portrait;
|
||||
|
||||
bool isLandscape(BuildContext context) => MediaQuery.of(context).orientation == Orientation.landscape;
|
||||
|
||||
double getWidthLoginTextField(BuildContext context) => isMobile(context) ? _loginTextFieldWidthSmallScreen : _loginTextFieldWidthLargeScreen;
|
||||
|
||||
double getWidthLoginButton() => _loginButtonWidth;
|
||||
|
||||
@@ -19,7 +19,9 @@ class ResponsiveWidget extends StatelessWidget {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return LayoutBuilder(builder: (context, constraints) {
|
||||
if (responsiveUtils.isDesktop(context)) {
|
||||
if (responsiveUtils.isMobileDevice(context)) {
|
||||
return mobile;
|
||||
} else if (responsiveUtils.isDesktop(context)) {
|
||||
return desktop ?? tablet;
|
||||
} else if (responsiveUtils.isTablet(context)) {
|
||||
return tablet;
|
||||
|
||||
@@ -29,8 +29,8 @@ class ComposerView extends GetWidget<ComposerController> {
|
||||
child: Scaffold(
|
||||
backgroundColor: AppColor.primaryLightColor,
|
||||
body: SafeArea(
|
||||
right: false,
|
||||
left: false,
|
||||
right: responsiveUtils.isMobileDevice(context) && responsiveUtils.isLandscape(context),
|
||||
left: responsiveUtils.isMobileDevice(context) && responsiveUtils.isLandscape(context),
|
||||
child: Container(
|
||||
margin: EdgeInsets.zero,
|
||||
alignment: Alignment.topCenter,
|
||||
|
||||
@@ -29,8 +29,8 @@ class EmailView extends GetView {
|
||||
return Scaffold(
|
||||
backgroundColor: AppColor.primaryLightColor,
|
||||
body: SafeArea(
|
||||
right: false,
|
||||
left: false,
|
||||
right: responsiveUtils.isMobileDevice(context) && responsiveUtils.isLandscape(context),
|
||||
left: responsiveUtils.isMobileDevice(context) && responsiveUtils.isLandscape(context),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
@@ -154,7 +154,7 @@ class EmailView extends GetView {
|
||||
}
|
||||
|
||||
int _getAttachmentLimitDisplayed(BuildContext context) {
|
||||
if (responsiveUtils.isMobile(context)) {
|
||||
if (responsiveUtils.isMobileDevice(context)) {
|
||||
return 2;
|
||||
} else if (responsiveUtils.isTablet(context)) {
|
||||
return 4;
|
||||
|
||||
+5
-5
@@ -77,13 +77,13 @@ class _AttachmentsPlaceHolderLoadingState extends State<AttachmentsPlaceHolderLo
|
||||
_placeHolderAttachment(context),
|
||||
SizedBox(width: 16),
|
||||
_placeHolderAttachment(context),
|
||||
if (!widget.responsiveUtils.isMobile(context))
|
||||
if (!widget.responsiveUtils.isMobileDevice(context))
|
||||
SizedBox(width: 16),
|
||||
if (!widget.responsiveUtils.isMobile(context))
|
||||
if (!widget.responsiveUtils.isMobileDevice(context))
|
||||
_placeHolderAttachment(context),
|
||||
if (widget.responsiveUtils.isTablet(context))
|
||||
if (!widget.responsiveUtils.isMobileDevice(context) && widget.responsiveUtils.isTablet(context))
|
||||
SizedBox(width: 16),
|
||||
if (widget.responsiveUtils.isTablet(context))
|
||||
if (!widget.responsiveUtils.isMobileDevice(context) && widget.responsiveUtils.isTablet(context))
|
||||
_placeHolderAttachment(context),
|
||||
]),
|
||||
],
|
||||
@@ -95,7 +95,7 @@ class _AttachmentsPlaceHolderLoadingState extends State<AttachmentsPlaceHolderLo
|
||||
|
||||
Widget _placeHolderAttachment(BuildContext context) {
|
||||
double width = MediaQuery.of(context).size.width;
|
||||
final percentAttachment = widget.responsiveUtils.isMobile(context)
|
||||
final percentAttachment = widget.responsiveUtils.isMobileDevice(context)
|
||||
? 0.4
|
||||
: widget.responsiveUtils.isTablet(context) ? 0.22 : 0.14;
|
||||
return Container(
|
||||
|
||||
@@ -186,7 +186,7 @@ class MailboxController extends BaseController {
|
||||
mailboxDashBoardController.setSelectedMailbox(presentationMailboxSelected);
|
||||
mailboxDashBoardController.clearSelectedEmail();
|
||||
|
||||
if (responsiveUtils.isMobile(context)) {
|
||||
if (responsiveUtils.isMobileDevice(context)) {
|
||||
mailboxDashBoardController.closeDrawer();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -24,9 +24,10 @@ class MailboxView extends GetWidget<MailboxController> {
|
||||
child: Scaffold(
|
||||
backgroundColor: AppColor.primaryLightColor,
|
||||
body: SafeArea(
|
||||
right: false,
|
||||
left: false,
|
||||
child: Container(
|
||||
alignment: Alignment.center,
|
||||
margin: EdgeInsets.symmetric(vertical: 24),
|
||||
child: Column(
|
||||
children: [
|
||||
_buildHeaderMailbox(context),
|
||||
@@ -110,6 +111,7 @@ class MailboxView extends GetWidget<MailboxController> {
|
||||
key: PageStorageKey('mailbox_list'),
|
||||
primary: false,
|
||||
shrinkWrap: true,
|
||||
padding: EdgeInsets.zero,
|
||||
children: [
|
||||
Obx(() => controller.defaultMailboxList.isNotEmpty
|
||||
? _buildDefaultMailbox(context, controller.defaultMailboxList)
|
||||
|
||||
@@ -14,17 +14,23 @@ class MailboxDashBoardView extends GetWidget<MailboxDashBoardController> {
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
key: controller.scaffoldKey,
|
||||
drawer: responsiveUtils.isMobile(context)
|
||||
drawer: responsiveUtils.isMobileDevice(context)
|
||||
? Container(
|
||||
child: MailboxView(),
|
||||
width: responsiveUtils.getSizeWidthScreen(context))
|
||||
width: responsiveUtils.isPortrait(context)
|
||||
? responsiveUtils.getSizeWidthScreen(context)
|
||||
: responsiveUtils.getSizeWidthScreen(context) / 2)
|
||||
: null,
|
||||
drawerEnableOpenDragGesture: responsiveUtils.isMobile(context),
|
||||
body: SafeArea(
|
||||
drawerEnableOpenDragGesture: responsiveUtils.isMobileDevice(context),
|
||||
body: Container(
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: [
|
||||
if (!responsiveUtils.isMobile(context)) Expanded(child: MailboxView()),
|
||||
if (!responsiveUtils.isMobileDevice(context))
|
||||
Expanded(
|
||||
flex: responsiveUtils.isDesktop(context) ? 1 : 2,
|
||||
child: MailboxView()),
|
||||
Expanded(
|
||||
flex: responsiveUtils.isDesktop(context) ? 1 : 3,
|
||||
child: ThreadView(),
|
||||
|
||||
@@ -23,8 +23,8 @@ class ThreadView extends GetWidget<ThreadController> {
|
||||
resizeToAvoidBottomInset: false,
|
||||
backgroundColor: AppColor.primaryLightColor,
|
||||
body: SafeArea(
|
||||
right: false,
|
||||
left: false,
|
||||
right: responsiveUtils.isMobileDevice(context) && responsiveUtils.isLandscape(context),
|
||||
left: responsiveUtils.isMobileDevice(context) && responsiveUtils.isLandscape(context),
|
||||
child: Container(
|
||||
alignment: Alignment.center,
|
||||
padding: EdgeInsets.zero,
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
import 'package:core/core.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:flutter_localizations/flutter_localizations.dart';
|
||||
import 'package:get/get.dart';
|
||||
import 'package:tmail_ui_user/features/caching/config/hive_cache_config.dart';
|
||||
@@ -13,13 +12,6 @@ void main() async {
|
||||
WidgetsFlutterBinding.ensureInitialized();
|
||||
await MainBindings().dependencies();
|
||||
await HiveCacheConfig().setUp();
|
||||
// Disable landscape on device mobile
|
||||
if (Get.size.shortestSide < ResponsiveUtils.minTabletWidth) {
|
||||
SystemChrome.setPreferredOrientations([
|
||||
DeviceOrientation.portraitUp,
|
||||
DeviceOrientation.portraitDown,
|
||||
]);
|
||||
}
|
||||
runApp(TMailApp());
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user