Added page swipe for navigation

This commit is contained in:
Mohammad Salameh
2024-03-10 16:57:12 +03:00
parent c03b2b248d
commit f11b6d8d32
10 changed files with 84 additions and 22 deletions

View File

@ -147,11 +147,13 @@ class NavCubit extends Cubit<NavState> {
const MenuView(),
];
Widget get currentPage => NavCubit().pages[pageIndex];
final PageController pageController = PageController();
void updatePageIndex(int index, BuildContext context) {
emit(NavChangePage());
void updatePageIndex(int index) {
pageIndex = index;
pageController.animateToPage(index,
duration: const Duration(milliseconds: 150), curve: Curves.easeIn);
emit(NavChangePage());
}
}

View File

@ -25,7 +25,14 @@ class AppBody extends StatelessWidget {
opacity: 0.4,
),
),
child: NavCubit.of(context).currentPage,
child: PageView(
onPageChanged: (int index) {
NavCubit.of(context).updatePageIndex(index);
},
controller: NavCubit.of(context).pageController,
children: NavCubit.of(context).pages,
)
// NavCubit.of(context).currentPage,
);
},
);

View File

@ -19,6 +19,7 @@ class DefaultAppBar extends StatelessWidget implements PreferredSizeWidget {
child: AppBar(
backgroundColor: Colors.transparent,
leadingWidth: 150,
toolbarHeight: Constants.appBarHeight,
leading: NavCubit.appBarLeading[
NavCubit().bottomNavItems[NavCubit.pageIndex].label],
actions: NavCubit.appBarActions[

View File

@ -20,7 +20,7 @@ class DefaultNavBar extends StatelessWidget {
child: BottomNavigationBar(
backgroundColor: Colors.transparent,
onTap: (int index) {
cubit.updatePageIndex(index, context);
cubit.updatePageIndex(index);
if (DevicesCubit.get(context).chosenCategoryView != null) {
DevicesCubit().clearCategoriesSelection(context);
}

View File

@ -263,6 +263,15 @@ class DevicesCubit extends Cubit<DevicesState> {
return null;
}
DevicesCategoryModel? get chosenCategory {
for (var category in allCategories) {
if (category.isSelected) {
return category;
}
}
return null;
}
selectDevice(DeviceModel device) {
for (var category in allCategories) {
for (var device in category.devices) {

View File

@ -1,12 +1,12 @@
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_app/features/app_layout/view/widgets/default_app_bar.dart';
import 'package:syncrow_app/features/devices/bloc/AC/ac_cubit.dart';
import 'package:syncrow_app/features/devices/bloc/devices_cubit.dart';
import 'package:syncrow_app/features/devices/model/ac_model.dart';
import 'package:syncrow_app/features/devices/view/widgets/ACs/ac_interface.dart';
import 'package:syncrow_app/features/devices/view/widgets/ACs/acs_list.dart';
import 'package:syncrow_app/features/devices/view/widgets/ACs/category_view_app_bar.dart';
import 'package:syncrow_app/utils/resource_manager/constants.dart';
import '../../../../../generated/assets.dart';
@ -38,7 +38,7 @@ class ACsView extends StatelessWidget {
backgroundColor: ColorsManager.backgroundColor,
extendBodyBehindAppBar: true,
extendBody: true,
appBar: DefaultAppBar(context),
appBar: const CategoryViewAppBar(),
body: Container(
width: MediaQuery.sizeOf(context).width,
height: MediaQuery.sizeOf(context).height,

View File

@ -0,0 +1,43 @@
import 'package:flutter/material.dart';
import 'package:syncrow_app/features/devices/bloc/devices_cubit.dart';
import 'package:syncrow_app/features/shared_widgets/text_widgets/display_medium.dart';
import 'package:syncrow_app/utils/context_extension.dart';
import 'package:syncrow_app/utils/resource_manager/constants.dart';
import '../../../../../utils/resource_manager/color_manager.dart';
class CategoryViewAppBar extends StatelessWidget
implements PreferredSizeWidget {
const CategoryViewAppBar({
super.key,
});
@override
Widget build(BuildContext context) {
return AppBar(
backgroundColor: Colors.transparent,
elevation: 0,
toolbarHeight: Constants.appBarHeight,
centerTitle: true,
title: DisplayMedium(
text: DevicesCubit.get(context).chosenCategory!.name,
style: context.displayMedium.copyWith(
color: ColorsManager.primaryColor,
fontWeight: FontWeight.bold,
),
),
leading: IconButton(
icon: const Icon(
Icons.arrow_back_ios,
color: ColorsManager.textPrimaryColor,
),
onPressed: () {
DevicesCubit.get(context).clearCategoriesSelection(context);
},
),
);
}
@override
Size get preferredSize => Size.fromHeight(Constants.appBarHeight);
}

View File

@ -1,9 +1,9 @@
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_app/features/app_layout/view/widgets/default_app_bar.dart';
import 'package:syncrow_app/features/devices/bloc/curtains/curtains_cubit.dart';
import 'package:syncrow_app/features/devices/bloc/devices_cubit.dart';
import 'package:syncrow_app/features/devices/view/widgets/ACs/category_view_app_bar.dart';
import 'package:syncrow_app/features/devices/view/widgets/curtains/curtain_list.dart';
import 'package:syncrow_app/generated/assets.dart';
import 'package:syncrow_app/utils/resource_manager/color_manager.dart';
@ -30,7 +30,7 @@ class CurtainView extends StatelessWidget {
backgroundColor: ColorsManager.backgroundColor,
extendBodyBehindAppBar: true,
extendBody: true,
appBar: DefaultAppBar(context),
appBar: const CategoryViewAppBar(),
body: Container(
width: MediaQuery.sizeOf(context).width,
height: MediaQuery.sizeOf(context).height,

View File

@ -1,11 +1,11 @@
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_app/features/devices/view/widgets/ACs/category_view_app_bar.dart';
import 'package:syncrow_app/features/devices/view/widgets/lights/lights_view_list.dart';
import '../../../../../generated/assets.dart';
import '../../../../../utils/resource_manager/color_manager.dart';
import '../../../../app_layout/view/widgets/default_app_bar.dart';
import '../../../bloc/devices_cubit.dart';
import '../../../bloc/lights/lights_cubit.dart';
import '../../../model/light_model.dart';
@ -43,7 +43,7 @@ class LightsView extends StatelessWidget {
backgroundColor: ColorsManager.backgroundColor,
extendBodyBehindAppBar: true,
extendBody: true,
appBar: DefaultAppBar(context),
appBar: const CategoryViewAppBar(),
body: Container(
width: MediaQuery.sizeOf(context).width,
height: MediaQuery.sizeOf(context).height,

View File

@ -4,7 +4,7 @@ abstract class Constants {
static const String countryCode = "US";
static const double appBarHeightPercentage = 0.1175;
static const double appBarHeightPercentage = 0.12;
static const double bottomNavBarHeightPercentage = 0.1175;
static late double appBarHeight;
static late double bottomNavBarHeight;