handle view with large screen

Author: AhmedAbdoElhawary

lib/core/helpers/current_device.dart

@@ -5,4 +5,9 @@ extension CurrentDevice on BuildContext {
     final ThemeData theme = Theme.of(this);
     return theme.platform == TargetPlatform.android;
   }
+
+  bool get isIOS {
+    final ThemeData theme = Theme.of(this);
+    return theme.platform == TargetPlatform.iOS;
+  }
 }

lib/features/searching/view/grid_page.dart

@@ -46,11 +46,18 @@ class SearchingPage extends StatelessWidget {
   }
 }
 
-class _ControlButtons extends StatelessWidget {
+class _ControlButtons extends StatefulWidget {
   const _ControlButtons();
 
+  @override
+  State<_ControlButtons> createState() => _ControlButtonsState();
+}
+
+class _ControlButtonsState extends State<_ControlButtons> {
   PopupMenuItem<String> buildPopupMenuItem(String value, [ThemeEnum? color]) {
-    return PopupMenuItem(value: value, child: RegularText(value, fontSize: 12, color: color));
+    final isLargeScreen = MediaQuery.sizeOf(context).width > 500;
+    return PopupMenuItem(
+        value: value, child: RegularText(value, fontSize: isLargeScreen ? 16 : 14, color: color));
   }
 
   @override

lib/features/sorting/base/view/sorting_list_page.dart

@@ -19,7 +19,7 @@ class SortingListPage extends StatelessWidget {
       body: const SafeArea(
         child: Center(
           child: Column(
-            mainAxisAlignment: MainAxisAlignment.center,
+            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
             children: [
               _CustomButton(text: StringsManager.bubbleSort, route: Routes.bubbleSort),
               _CustomButton(text: StringsManager.insertionSort, route: Routes.insertionSort),

lib/features/sorting/base/view/sorting_page.dart

@@ -58,28 +58,32 @@ class _BuildBody extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return SafeArea(
-      child: Stack(
-        alignment: AlignmentDirectional.bottomCenter,
+      child: Column(
+        mainAxisAlignment: MainAxisAlignment.spaceBetween,
         children: [
           Align(alignment: AlignmentDirectional.topCenter, child: ShowUpSortingList(instance)),
-          Align(
-            alignment: AlignmentDirectional.bottomCenter,
-            child: Column(
-              mainAxisAlignment: MainAxisAlignment.end,
-              spacing: 10,
-              children: [
-                _SortingControlButtons(instance),
-                SymmetricPadding(
-                  horizontal: 15,
-                  child: Row(
-                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                    children: [
-                      _SpeedDraggable(instance: instance),
-                      _SizeDraggable(instance: instance),
-                    ],
+          Flexible(
+            child: Align(
+              alignment: AlignmentDirectional.bottomCenter,
+              child: Column(
+                mainAxisAlignment: MainAxisAlignment.end,
+                spacing: 10,
+                children: [
+                  Flexible(child: _SortingControlButtons(instance)),
+                  Flexible(
+                    child: SymmetricPadding(
+                      horizontal: 15,
+                      child: Row(
+                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                        children: [
+                          _SpeedDraggable(instance: instance),
+                          _SizeDraggable(instance: instance),
+                        ],
+                      ),
+                    ),
                   ),
-                ),
-              ],
+                ],
+              ),
             ),
           ),
         ],
@@ -96,11 +100,12 @@ class ShowUpSortingList extends ConsumerWidget {
   Widget build(BuildContext context, ref) {
     final items = ref.watch(instance.select((state) => state.list));
     final speedDuration = ref.watch(instance.select((state) => state.swipeDuration));
+    final maxHeight = SortingNotifier.calculateMaxListItemHeight(context);
 
     return Padding(
       padding: const EdgeInsets.only(top: 5),
       child: RSizedBox(
-        height: selectedAlgorithmLength == 1 ? SortingNotifier.maxListItemHeight * 1.05 : null,
+        height: selectedAlgorithmLength == 1 ? maxHeight*1.01  : null,
         width: double.infinity,
         child: Stack(
           alignment: AlignmentDirectional.bottomCenter,
@@ -156,7 +161,7 @@ class _BuildItem extends ConsumerWidget {
       padding: EdgeInsets.symmetric(horizontal: SortingNotifier.itemsPadding / 2),
       child: AnimatedContainer(
         duration: speedDuration,
-        height: SortingNotifier.calculateItemHeight(item.value, size) / selectedAlgorithmLength,
+        height: SortingNotifier.calculateItemHeight(context, item.value, size) / selectedAlgorithmLength,
         width: itemWidth,
         decoration: BoxDecoration(
           color: context.getColor(currentItem?.getColor ?? SortingNotifier.itemColor),

lib/features/sorting/base/view_model/sorting_notifier.dart

@@ -15,7 +15,7 @@ abstract class SortingNotifier extends StateNotifier<SortingNotifierState> {
     _initializePositions();
   }
 
-  static double maxListItemHeight = 250.r;
+  // static double maxListItemHeight = 250.r;
   static double itemsPadding = 1.w;
   static const ThemeEnum swappingColor = ThemeEnum.redColor;
   static const ThemeEnum comparedColor = ThemeEnum.lightBlueColor;
@@ -44,8 +44,15 @@ abstract class SortingNotifier extends StateNotifier<SortingNotifierState> {
     return availableWidth / size > 0 ? availableWidth / size : 1.0;
   }
 
-  static double calculateItemHeight(int itemIndex, int size) {
-    final value = (maxListItemHeight / size) * (itemIndex + 1);
+  static double calculateMaxListItemHeight(BuildContext context) {
+    final screenHeight = MediaQuery.of(context).size.height * 0.65;
+
+    // Ensure a positive width
+    return screenHeight > 0 ? screenHeight : 1.0;
+  }
+
+  static double calculateItemHeight(BuildContext context, int itemIndex, int size) {
+    final value = (calculateMaxListItemHeight(context) / size) * (itemIndex + 1);
     return value.h;
   }