From 0e0323ae346bc74fbc7f18583bfe8fe59f2dd073 Mon Sep 17 00:00:00 2001 From: Mahmoud Date: Thu, 26 Mar 2026 01:13:35 +0200 Subject: [PATCH 1/4] Fix CategoryScreen UI and scrolling issues --- lib/views/screens/category_screen.dart | 100 +++++++++++++------------ 1 file changed, 51 insertions(+), 49 deletions(-) diff --git a/lib/views/screens/category_screen.dart b/lib/views/screens/category_screen.dart index 8a4b652f..b791cb39 100644 --- a/lib/views/screens/category_screen.dart +++ b/lib/views/screens/category_screen.dart @@ -19,66 +19,68 @@ class CategoryScreen extends StatelessWidget { Widget build(BuildContext context) { return Scaffold( appBar: AppBar( - automaticallyImplyLeading: false, + automaticallyImplyLeading: true,//back button for user experience + centerTitle: true, backgroundColor: Theme.of(context).colorScheme.surface, elevation: 0, title: Text(capitalizeFirstLetter(categoryName)), ), body: Obx( - () => exploreStoryController.isLoadingCategoryPage.value + () => exploreStoryController.isLoadingCategoryPage.value ? Center( - child: SizedBox( - height: 200, - width: 200, - child: LoadingIndicator( - indicatorType: Indicator.ballRotate, - colors: [Theme.of(context).colorScheme.primary], - ), - ), - ) + child: SizedBox( + height: 200, + width: 200, + child: LoadingIndicator( + indicatorType: Indicator.ballRotate, + colors: [Theme.of(context).colorScheme.primary], + ), + ), + ) : exploreStoryController.openedCategotyStories.isNotEmpty ? Padding( - padding: const EdgeInsets.only(top: 20.0), - child: ListView.builder( - physics: const NeverScrollableScrollPhysics(), - scrollDirection: Axis.vertical, - padding: EdgeInsets.zero, - shrinkWrap: true, - primary: true, - itemCount: - exploreStoryController.openedCategotyStories.length, - itemBuilder: (context, index) { - final int storyIndex = index; - return StoryListTile( - story: exploreStoryController - .openedCategotyStories[storyIndex], - ); - }, - ), - ) + padding: const EdgeInsets.only(top: 20.0), + child: ListView.builder( + physics: const NeverScrollableScrollPhysics(), + scrollDirection: Axis.vertical, + padding: EdgeInsets.zero, + shrinkWrap: true, + primary: true, + itemCount: + exploreStoryController.openedCategotyStories.length, + itemBuilder: (context, index) { + final int storyIndex = index; + return StoryListTile( + story: exploreStoryController + .openedCategotyStories[storyIndex], + ); + }, + ), + ) : Padding( - padding: const EdgeInsets.only(bottom: 150.0), - child: Column( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Image.asset( - height: 200, - width: 200, - AppImages.emptyBoxImage, - ), - const SizedBox(height: 20), - Padding( - padding: const EdgeInsets.symmetric(horizontal: 30.0), - child: Text( - AppLocalizations.of(context)!.noStoriesInCategory( - capitalizeFirstLetter(categoryName), - ), - textAlign: TextAlign.center, - ), - ), - ], + padding: const EdgeInsets.only(bottom: 150.0), + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + mainAxisSize: MainAxisSize.min,// take the least size needed + children: [ + Image.asset( + height: 200, + width: 200, + AppImages.emptyBoxImage, + ), + const SizedBox(height: 20), + Padding( + padding: const EdgeInsets.symmetric(horizontal: 30.0), + child: Text( + AppLocalizations.of(context)!.noStoriesInCategory( + capitalizeFirstLetter(categoryName), + ), + textAlign: TextAlign.center, ), ), + ], + ), + ), ), ); } From b8523af22062f07f8ae7d84b697302d40a9aca22 Mon Sep 17 00:00:00 2001 From: Mahmoud Date: Thu, 26 Mar 2026 06:04:29 +0200 Subject: [PATCH 2/4] Make Category Screen responsive + fix scrollable error --- lib/views/screens/category_screen.dart | 20 +++++++++----------- pubspec.yaml | 1 + 2 files changed, 10 insertions(+), 11 deletions(-) diff --git a/lib/views/screens/category_screen.dart b/lib/views/screens/category_screen.dart index b791cb39..8dfca487 100644 --- a/lib/views/screens/category_screen.dart +++ b/lib/views/screens/category_screen.dart @@ -6,6 +6,7 @@ import 'package:resonate/controllers/explore_story_controller.dart'; import 'package:resonate/utils/app_images.dart'; import 'package:resonate/views/widgets/category_card.dart'; import 'package:resonate/views/widgets/story_list_tile.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; class CategoryScreen extends StatelessWidget { CategoryScreen({super.key, required this.categoryName}); @@ -29,8 +30,8 @@ class CategoryScreen extends StatelessWidget { () => exploreStoryController.isLoadingCategoryPage.value ? Center( child: SizedBox( - height: 200, - width: 200, + height: 200.h, + width: 200.w, child: LoadingIndicator( indicatorType: Indicator.ballRotate, colors: [Theme.of(context).colorScheme.primary], @@ -39,13 +40,10 @@ class CategoryScreen extends StatelessWidget { ) : exploreStoryController.openedCategotyStories.isNotEmpty ? Padding( - padding: const EdgeInsets.only(top: 20.0), + padding: EdgeInsets.only(top: 20.0.h), child: ListView.builder( - physics: const NeverScrollableScrollPhysics(), scrollDirection: Axis.vertical, padding: EdgeInsets.zero, - shrinkWrap: true, - primary: true, itemCount: exploreStoryController.openedCategotyStories.length, itemBuilder: (context, index) { @@ -58,19 +56,19 @@ class CategoryScreen extends StatelessWidget { ), ) : Padding( - padding: const EdgeInsets.only(bottom: 150.0), + padding: EdgeInsets.only(bottom: 150.0.h), child: Column( mainAxisAlignment: MainAxisAlignment.center, mainAxisSize: MainAxisSize.min,// take the least size needed children: [ Image.asset( - height: 200, - width: 200, + height: 200.h, + width: 200.w, AppImages.emptyBoxImage, ), - const SizedBox(height: 20), + SizedBox(height: 20.h), Padding( - padding: const EdgeInsets.symmetric(horizontal: 30.0), + padding: EdgeInsets.symmetric(horizontal: 30.0.w), child: Text( AppLocalizations.of(context)!.noStoriesInCategory( capitalizeFirstLetter(categoryName), diff --git a/pubspec.yaml b/pubspec.yaml index 978d8920..bab2c655 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -29,6 +29,7 @@ environment: # the latest version available on pub.dev. To see which dependencies have newer # versions available, run flutter pub outdated. dependencies: + flutter_screenutil: ^5.9.3 animated_bottom_navigation_bar: ^1.4.0 animated_splash_screen: ^1.3.0 app_links: ^6.4.1 From b4652bb553a1b5feedc7209dfd390efba7c9439d Mon Sep 17 00:00:00 2001 From: Mahmoud Date: Thu, 26 Mar 2026 06:33:14 +0200 Subject: [PATCH 3/4] Make Category Screen responsive --- lib/main.dart | 57 +++++++++------- lib/views/screens/category_screen.dart | 92 +++++++++++++------------- 2 files changed, 77 insertions(+), 72 deletions(-) diff --git a/lib/main.dart b/lib/main.dart index cdafe0c1..4d77f230 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -77,31 +77,38 @@ class MyApp extends StatelessWidget { Widget build(BuildContext context) { UiSizes.init(context); final themeController = Get.put(ThemeController()); + return ScreenUtilInit( + designSize: const Size(360, 690), + minTextAdapt: true, + splitScreenMode: true, + // Use builder only if you need to use library outside ScreenUtilInit context + builder: (_ , child) { + return Obx( + () => GetMaterialApp( + localizationsDelegates: [ + AppLocalizations.delegate, + GlobalMaterialLocalizations.delegate, + GlobalWidgetsLocalizations.delegate, + GlobalCupertinoLocalizations.delegate, + ], + locale: Locale(languageLocale), + supportedLocales: AppLocalizations.supportedLocales, + debugShowCheckedModeBanner: false, + title: 'Resonate', + theme: ThemeModes.setLightTheme( + ThemeList.getThemeModel(themeController.currentTheme.value), + ), + darkTheme: ThemeModes.setDarkTheme( + ThemeList.getThemeModel(themeController.currentTheme.value), + ), + themeMode: ThemeList.getThemeModel( + themeController.currentTheme.value, + ).themeMode, + initialRoute: AppRoutes.splash, + getPages: AppPages.pages, + ), + ); + }); - return Obx( - () => GetMaterialApp( - localizationsDelegates: [ - AppLocalizations.delegate, - GlobalMaterialLocalizations.delegate, - GlobalWidgetsLocalizations.delegate, - GlobalCupertinoLocalizations.delegate, - ], - locale: Locale(languageLocale), - supportedLocales: AppLocalizations.supportedLocales, - debugShowCheckedModeBanner: false, - title: 'Resonate', - theme: ThemeModes.setLightTheme( - ThemeList.getThemeModel(themeController.currentTheme.value), - ), - darkTheme: ThemeModes.setDarkTheme( - ThemeList.getThemeModel(themeController.currentTheme.value), - ), - themeMode: ThemeList.getThemeModel( - themeController.currentTheme.value, - ).themeMode, - initialRoute: AppRoutes.splash, - getPages: AppPages.pages, - ), - ); } } diff --git a/lib/views/screens/category_screen.dart b/lib/views/screens/category_screen.dart index 8dfca487..827a3f69 100644 --- a/lib/views/screens/category_screen.dart +++ b/lib/views/screens/category_screen.dart @@ -20,65 +20,63 @@ class CategoryScreen extends StatelessWidget { Widget build(BuildContext context) { return Scaffold( appBar: AppBar( - automaticallyImplyLeading: true,//back button for user experience + automaticallyImplyLeading: true, //back button for user experience centerTitle: true, backgroundColor: Theme.of(context).colorScheme.surface, elevation: 0, title: Text(capitalizeFirstLetter(categoryName)), ), body: Obx( - () => exploreStoryController.isLoadingCategoryPage.value + () => exploreStoryController.isLoadingCategoryPage.value ? Center( - child: SizedBox( - height: 200.h, - width: 200.w, - child: LoadingIndicator( - indicatorType: Indicator.ballRotate, - colors: [Theme.of(context).colorScheme.primary], - ), - ), - ) + child: SizedBox( + height: 200.h, + width: 200.w, + child: LoadingIndicator( + indicatorType: Indicator.ballRotate, + colors: [Theme.of(context).colorScheme.primary], + ), + ), + ) : exploreStoryController.openedCategotyStories.isNotEmpty ? Padding( - padding: EdgeInsets.only(top: 20.0.h), - child: ListView.builder( - scrollDirection: Axis.vertical, - padding: EdgeInsets.zero, - itemCount: - exploreStoryController.openedCategotyStories.length, - itemBuilder: (context, index) { - final int storyIndex = index; - return StoryListTile( - story: exploreStoryController - .openedCategotyStories[storyIndex], - ); - }, - ), - ) - : Padding( - padding: EdgeInsets.only(bottom: 150.0.h), - child: Column( - mainAxisAlignment: MainAxisAlignment.center, - mainAxisSize: MainAxisSize.min,// take the least size needed - children: [ - Image.asset( - height: 200.h, - width: 200.w, - AppImages.emptyBoxImage, - ), - SizedBox(height: 20.h), - Padding( - padding: EdgeInsets.symmetric(horizontal: 30.0.w), - child: Text( - AppLocalizations.of(context)!.noStoriesInCategory( - capitalizeFirstLetter(categoryName), + padding: EdgeInsets.only(top: 20.0.h), + child: ListView.builder( + padding: EdgeInsets.zero, + itemCount: + exploreStoryController.openedCategotyStories.length, + itemBuilder: (context, index) { + final int storyIndex = index; + return StoryListTile( + story: exploreStoryController + .openedCategotyStories[storyIndex], + ); + }, + ), + ) + : Center( + child: Padding( + padding: EdgeInsets.symmetric(horizontal: 30.0.w), + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + mainAxisSize: MainAxisSize.min, + children: [ + Image.asset( + height: 200.h, + width: 200.w, + AppImages.emptyBoxImage, + ), + SizedBox(height: 20.h), + Text( + AppLocalizations.of(context)!.noStoriesInCategory( + capitalizeFirstLetter(categoryName), + ), + textAlign: TextAlign.center, + ), + ], ), - textAlign: TextAlign.center, ), ), - ], - ), - ), ), ); } From 210808fdb2de32223b4001630d908d6471173f59 Mon Sep 17 00:00:00 2001 From: Mahmoud Date: Thu, 26 Mar 2026 06:41:23 +0200 Subject: [PATCH 4/4] Make Category Screen responsive --- lib/views/screens/category_screen.dart | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/views/screens/category_screen.dart b/lib/views/screens/category_screen.dart index 827a3f69..4ebed915 100644 --- a/lib/views/screens/category_screen.dart +++ b/lib/views/screens/category_screen.dart @@ -40,7 +40,7 @@ class CategoryScreen extends StatelessWidget { ) : exploreStoryController.openedCategotyStories.isNotEmpty ? Padding( - padding: EdgeInsets.only(top: 20.0.h), + padding: EdgeInsets.only(top: 20.h), child: ListView.builder( padding: EdgeInsets.zero, itemCount: