From 5a8150953e6eaabe40d69d3b0957ff04d5b2cfd8 Mon Sep 17 00:00:00 2001 From: DenserMeerkat Date: Thu, 23 May 2024 23:37:56 +0530 Subject: [PATCH] refactor: MediaQuery as InheritedModel --- lib/app.dart | 2 +- lib/screens/home_page/collection_pane.dart | 6 +- .../home_page/editor_pane/editor_request.dart | 2 +- .../home_page/editor_pane/url_card.dart | 2 +- lib/screens/mobile/dashboard.dart | 150 +++++++++--------- lib/screens/mobile/left_drawer.dart | 9 +- lib/screens/mobile/navbar.dart | 6 +- lib/screens/mobile/page_base.dart | 2 +- .../mobile/requests_page/requests_page.dart | 6 +- .../mobile/requests_page/response_drawer.dart | 2 +- lib/screens/settings_page.dart | 2 +- lib/widgets/dropdowns.dart | 2 +- lib/widgets/intro_message.dart | 2 +- lib/widgets/request_widgets.dart | 2 +- lib/widgets/tabs.dart | 2 +- 15 files changed, 97 insertions(+), 100 deletions(-) diff --git a/lib/app.dart b/lib/app.dart index 61efa48f..32801c9d 100644 --- a/lib/app.dart +++ b/lib/app.dart @@ -106,7 +106,7 @@ class DashApp extends ConsumerWidget { final isDarkMode = ref.watch(settingsProvider.select((value) => value.isDark)); final isLargeMobile = - MediaQuery.of(context).size.width > kMinWindowSize.width; + MediaQuery.sizeOf(context).width > kMinWindowSize.width; return MaterialApp( debugShowCheckedModeBanner: false, theme: ThemeData( diff --git a/lib/screens/home_page/collection_pane.dart b/lib/screens/home_page/collection_pane.dart index 796cb067..baf19849 100644 --- a/lib/screens/home_page/collection_pane.dart +++ b/lib/screens/home_page/collection_pane.dart @@ -143,7 +143,7 @@ class _RequestListState extends ConsumerState { .select((value) => value.alwaysShowCollectionPaneScrollbar)); final filterQuery = ref.watch(searchQueryProvider).trim(); final isMobile = - kIsMobile && MediaQuery.of(context).size.width < kMinWindowSize.width; + kIsMobile && MediaQuery.sizeOf(context).width < kMinWindowSize.width; return Scrollbar( controller: controller, @@ -153,7 +153,7 @@ class _RequestListState extends ConsumerState { ? ReorderableListView.builder( padding: isMobile ? EdgeInsets.only( - bottom: MediaQuery.of(context).padding.bottom, + bottom: MediaQuery.paddingOf(context).bottom, right: 8, ) : kPe8, @@ -201,7 +201,7 @@ class _RequestListState extends ConsumerState { : ListView( padding: kIsMobile ? EdgeInsets.only( - bottom: MediaQuery.of(context).padding.bottom, + bottom: MediaQuery.paddingOf(context).bottom, right: 8, ) : kPe8, diff --git a/lib/screens/home_page/editor_pane/editor_request.dart b/lib/screens/home_page/editor_pane/editor_request.dart index df72b88a..f52262ee 100644 --- a/lib/screens/home_page/editor_pane/editor_request.dart +++ b/lib/screens/home_page/editor_pane/editor_request.dart @@ -12,7 +12,7 @@ class RequestEditor extends StatelessWidget { @override Widget build(BuildContext context) { final isMobile = - kIsMobile && MediaQuery.of(context).size.width < kMinWindowSize.width; + kIsMobile && MediaQuery.sizeOf(context).width < kMinWindowSize.width; return isMobile ? const Padding( padding: kPb10, diff --git a/lib/screens/home_page/editor_pane/url_card.dart b/lib/screens/home_page/editor_pane/url_card.dart index 0e3ef663..910701cc 100644 --- a/lib/screens/home_page/editor_pane/url_card.dart +++ b/lib/screens/home_page/editor_pane/url_card.dart @@ -10,7 +10,7 @@ class EditorPaneRequestURLCard extends StatelessWidget { @override Widget build(BuildContext context) { final isMobile = - kIsMobile && MediaQuery.of(context).size.width < kMinWindowSize.width; + kIsMobile && MediaQuery.sizeOf(context).width < kMinWindowSize.width; return Card( elevation: 0, shape: RoundedRectangleBorder( diff --git a/lib/screens/mobile/dashboard.dart b/lib/screens/mobile/dashboard.dart index e3ea5e3e..b1cd59e5 100644 --- a/lib/screens/mobile/dashboard.dart +++ b/lib/screens/mobile/dashboard.dart @@ -44,92 +44,88 @@ class _MobileDashboardState extends ConsumerState { ) { final GlobalKey innerDrawerKey = ref.watch(mobileDrawerKeyProvider); + final isLargeMobile = MediaQuery.sizeOf(context).width > kLargeMobileWidth; return AnnotatedRegion( value: FlexColorScheme.themedSystemNavigationBar( context, opacity: 0, noAppBar: true, ), - child: LayoutBuilder( - builder: (context, constraints) { - final isLargeMobile = constraints.maxWidth > kLargeMobileWidth; - return Stack( - alignment: AlignmentDirectional.bottomCenter, - children: [ - InnerDrawer( - key: innerDrawerKey, - swipe: true, - swipeChild: true, - onTapClose: true, - offset: isLargeMobile - ? const IDOffset.only(left: 0.1, right: 1) - : const IDOffset.only(left: 0.7, right: 1), - boxShadow: [ - BoxShadow( - offset: const Offset(1, 0), - color: Theme.of(context).colorScheme.onInverseSurface, - blurRadius: 0, - ), - ], - colorTransitionChild: Colors.transparent, - colorTransitionScaffold: Colors.transparent, - rightAnimationType: InnerDrawerAnimation.linear, - backgroundDecoration: - BoxDecoration(color: Theme.of(context).colorScheme.surface), - onDragUpdate: (value, direction) { - drawerDirection.value = direction; - if (value > 0.98 && direction == InnerDrawerDirection.start) { - dragPosition.value = 1; - } else { - dragPosition.value = 0; - } - }, - innerDrawerCallback: (isOpened) { - if (drawerDirection.value == InnerDrawerDirection.start) { - setState(() { - isLeftDrawerOpen = isOpened; - }); - } - }, - leftChild: const LeftDrawer( - drawerContent: CollectionPane(), - ), - rightChild: const ResponseDrawer(), - scaffold: ValueListenableBuilder( - valueListenable: dragPosition, - builder: (context, value, child) { - return Container( - color: calculateBackgroundColor(value), - child: child, - ); - }, - child: ClipRRect( - borderRadius: - const BorderRadius.only(topLeft: Radius.circular(8)), - child: SafeArea( - bottom: false, - child: RequestsPage( - innerDrawerKey: innerDrawerKey, - ), - ), + child: Stack( + alignment: AlignmentDirectional.bottomCenter, + children: [ + InnerDrawer( + key: innerDrawerKey, + swipe: true, + swipeChild: true, + onTapClose: true, + offset: isLargeMobile + ? const IDOffset.only(left: 0.1, right: 1) + : const IDOffset.only(left: 0.7, right: 1), + boxShadow: [ + BoxShadow( + offset: const Offset(1, 0), + color: Theme.of(context).colorScheme.onInverseSurface, + blurRadius: 0, + ), + ], + colorTransitionChild: Colors.transparent, + colorTransitionScaffold: Colors.transparent, + rightAnimationType: InnerDrawerAnimation.linear, + backgroundDecoration: + BoxDecoration(color: Theme.of(context).colorScheme.surface), + onDragUpdate: (value, direction) { + drawerDirection.value = direction; + if (value > 0.98 && direction == InnerDrawerDirection.start) { + dragPosition.value = 1; + } else { + dragPosition.value = 0; + } + }, + innerDrawerCallback: (isOpened) { + if (drawerDirection.value == InnerDrawerDirection.start) { + setState(() { + isLeftDrawerOpen = isOpened; + }); + } + }, + leftChild: const LeftDrawer( + drawerContent: CollectionPane(), + ), + rightChild: const ResponseDrawer(), + scaffold: ValueListenableBuilder( + valueListenable: dragPosition, + builder: (context, value, child) { + return Container( + color: calculateBackgroundColor(value), + child: child, + ); + }, + child: ClipRRect( + borderRadius: + const BorderRadius.only(topLeft: Radius.circular(8)), + child: SafeArea( + bottom: false, + child: RequestsPage( + innerDrawerKey: innerDrawerKey, ), ), ), - if (!isLargeMobile) - AnimatedPositioned( - bottom: isLeftDrawerOpen - ? 0 - : -(72 + MediaQuery.of(context).padding.bottom), - left: 0, - right: 0, - height: 70 + MediaQuery.of(context).padding.bottom, - duration: const Duration(milliseconds: 200), - curve: Curves.easeOut, - child: const BottomNavBar(), - ), - ], - ); - }, + ), + ), + if (!isLargeMobile) + AnimatedPositioned( + bottom: isLeftDrawerOpen + ? 0 + : -(72 + MediaQuery.paddingOf(context).bottom), + left: 0, + right: 0, + height: 70 + MediaQuery.paddingOf(context).bottom, + duration: const Duration(milliseconds: 200), + curve: Curves.easeOut, + child: const BottomNavBar(), + ), + ], ), ); } diff --git a/lib/screens/mobile/left_drawer.dart b/lib/screens/mobile/left_drawer.dart index 8ce3243d..9a0f67c6 100644 --- a/lib/screens/mobile/left_drawer.dart +++ b/lib/screens/mobile/left_drawer.dart @@ -8,9 +8,9 @@ class LeftDrawer extends StatelessWidget { @override Widget build(BuildContext context) { - final isLargeMobile = MediaQuery.of(context).size.width > kLargeMobileWidth; + final isLargeMobile = MediaQuery.sizeOf(context).width > kLargeMobileWidth; return Container( - padding: EdgeInsets.only(top: MediaQuery.of(context).padding.top), + padding: EdgeInsets.only(top: MediaQuery.paddingOf(context).top), color: Theme.of(context).colorScheme.onInverseSurface, child: Drawer( backgroundColor: Colors.transparent, @@ -19,9 +19,10 @@ class LeftDrawer extends StatelessWidget { padding: const EdgeInsets.only(right: 16), child: Container( padding: EdgeInsets.only( + left: MediaQuery.paddingOf(context).left, bottom: isLargeMobile - ? MediaQuery.of(context).padding.bottom - : 70 + MediaQuery.of(context).padding.bottom), + ? MediaQuery.paddingOf(context).bottom + : 70 + MediaQuery.paddingOf(context).bottom), clipBehavior: Clip.hardEdge, decoration: BoxDecoration( color: Theme.of(context).colorScheme.surface, diff --git a/lib/screens/mobile/navbar.dart b/lib/screens/mobile/navbar.dart index a3954465..9c3ee814 100644 --- a/lib/screens/mobile/navbar.dart +++ b/lib/screens/mobile/navbar.dart @@ -15,10 +15,10 @@ class BottomNavBar extends ConsumerWidget { children: [ Container( alignment: Alignment.topCenter, - height: 70 + MediaQuery.of(context).padding.bottom, - width: MediaQuery.of(context).size.width, + height: 70 + MediaQuery.paddingOf(context).bottom, + width: MediaQuery.sizeOf(context).width, padding: - EdgeInsets.only(bottom: MediaQuery.of(context).padding.bottom), + EdgeInsets.only(bottom: MediaQuery.paddingOf(context).bottom), decoration: BoxDecoration( border: Border( top: BorderSide( diff --git a/lib/screens/mobile/page_base.dart b/lib/screens/mobile/page_base.dart index dcaea27a..96efeefe 100644 --- a/lib/screens/mobile/page_base.dart +++ b/lib/screens/mobile/page_base.dart @@ -17,7 +17,7 @@ class PageBase extends StatelessWidget { ), body: Padding( padding: EdgeInsets.only( - bottom: MediaQuery.of(context).padding.bottom, + bottom: MediaQuery.paddingOf(context).bottom, ), child: scaffoldBody, ), diff --git a/lib/screens/mobile/requests_page/requests_page.dart b/lib/screens/mobile/requests_page/requests_page.dart index 19022d3e..11bbb7c6 100644 --- a/lib/screens/mobile/requests_page/requests_page.dart +++ b/lib/screens/mobile/requests_page/requests_page.dart @@ -130,10 +130,10 @@ class RequestPageBottombar extends StatelessWidget { @override Widget build(BuildContext context) { return Container( - height: 60 + MediaQuery.of(context).padding.bottom, - width: MediaQuery.of(context).size.width, + height: 60 + MediaQuery.paddingOf(context).bottom, + width: MediaQuery.sizeOf(context).width, padding: EdgeInsets.only( - bottom: MediaQuery.of(context).padding.bottom, + bottom: MediaQuery.paddingOf(context).bottom, left: 16, right: 16, ), diff --git a/lib/screens/mobile/requests_page/response_drawer.dart b/lib/screens/mobile/requests_page/response_drawer.dart index e25ef0a9..11c57a51 100644 --- a/lib/screens/mobile/requests_page/response_drawer.dart +++ b/lib/screens/mobile/requests_page/response_drawer.dart @@ -24,7 +24,7 @@ class ResponseDrawer extends StatelessWidget { ), body: Padding( padding: EdgeInsets.only( - bottom: MediaQuery.of(context).padding.bottom, + bottom: MediaQuery.paddingOf(context).bottom, ), child: const ResponsePane(), ), diff --git a/lib/screens/settings_page.dart b/lib/screens/settings_page.dart index 1fadcebd..a22e8960 100644 --- a/lib/screens/settings_page.dart +++ b/lib/screens/settings_page.dart @@ -14,7 +14,7 @@ class SettingsPage extends ConsumerWidget { final clearingData = ref.watch(clearDataStateProvider); var sm = ScaffoldMessenger.of(context); final isMobile = - kIsMobile && MediaQuery.of(context).size.width < kMinWindowSize.width; + kIsMobile && MediaQuery.sizeOf(context).width < kMinWindowSize.width; return Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ diff --git a/lib/widgets/dropdowns.dart b/lib/widgets/dropdowns.dart index 10c86a11..95c644d6 100644 --- a/lib/widgets/dropdowns.dart +++ b/lib/widgets/dropdowns.dart @@ -16,7 +16,7 @@ class DropdownButtonHttpMethod extends StatelessWidget { Widget build(BuildContext context) { final surfaceColor = Theme.of(context).colorScheme.surface; final isMobile = - kIsMobile && MediaQuery.of(context).size.width < kMinWindowSize.width; + kIsMobile && MediaQuery.sizeOf(context).width < kMinWindowSize.width; return DropdownButton( focusColor: surfaceColor, value: method, diff --git a/lib/widgets/intro_message.dart b/lib/widgets/intro_message.dart index e7c0e0df..cbb0a18b 100644 --- a/lib/widgets/intro_message.dart +++ b/lib/widgets/intro_message.dart @@ -24,7 +24,7 @@ class IntroMessage extends StatelessWidget { future: introData(), builder: (BuildContext context, AsyncSnapshot snapshot) { final isMobile = kIsMobile && - MediaQuery.of(context).size.width < kMinWindowSize.width; + MediaQuery.sizeOf(context).width < kMinWindowSize.width; if (snapshot.hasError) { return const ErrorMessage(message: "An error occured"); } diff --git a/lib/widgets/request_widgets.dart b/lib/widgets/request_widgets.dart index 28f7ff89..9db5f949 100644 --- a/lib/widgets/request_widgets.dart +++ b/lib/widgets/request_widgets.dart @@ -46,7 +46,7 @@ class _RequestPaneState extends State _controller.index = widget.tabIndex!; } final isMobile = - kIsMobile && MediaQuery.of(context).size.width < kMinWindowSize.width; + kIsMobile && MediaQuery.sizeOf(context).width < kMinWindowSize.width; return Column( children: [ isMobile diff --git a/lib/widgets/tabs.dart b/lib/widgets/tabs.dart index d96e05ea..1789f992 100644 --- a/lib/widgets/tabs.dart +++ b/lib/widgets/tabs.dart @@ -13,7 +13,7 @@ class TabLabel extends StatelessWidget { @override Widget build(BuildContext context) { final isMobile = - kIsMobile && MediaQuery.of(context).size.width < kMinWindowSize.width; + kIsMobile && MediaQuery.sizeOf(context).width < kMinWindowSize.width; return SizedBox( height: isMobile ? kMobileTabHeight : kTabHeight, child: Stack(