Implemented the page view functionality

-synced page controllers
This commit is contained in:
Mohammad Salameh
2024-03-07 12:57:35 +03:00
parent c5f88caec3
commit bf275d5adf
7 changed files with 185 additions and 71 deletions
@@ -26,8 +26,9 @@ class DevicesViewBody extends StatelessWidget {
? const Center(child: CircularProgressIndicator())
: Padding(
padding: EdgeInsets.only(
top: Constants.appBarHeight,
bottom: Constants.bottomNavBarHeight),
top: Constants.appBarHeight,
bottom: Constants.bottomNavBarHeight,
),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
@@ -40,6 +41,9 @@ class DevicesViewBody extends StatelessWidget {
child: PageView(
controller:
SpacesCubit.get(context).devicesPageController,
onPageChanged: (index) {
SpacesCubit.get(context).devicesPageChanged(index);
},
children: [
const WizardPage(),
...SpacesCubit.get(context).selectedSpace.rooms.map(
@@ -57,22 +61,17 @@ class DevicesViewBody extends StatelessWidget {
vertical: 7,
),
child: SmoothPageIndicator(
controller:
SpacesCubit.get(context).devicesPageController,
count: 3,
effect: const WormEffect(
dotHeight: 8,
dotWidth: 8,
),
onDotClicked: (index) {
SpacesCubit.get(context)
.devicesPageController
.animateToPage(
index,
duration: const Duration(milliseconds: 300),
curve: Curves.ease,
);
}),
controller:
SpacesCubit.get(context).devicesPageController,
count: 3,
effect: const WormEffect(
dotHeight: 8,
dotWidth: 8,
),
onDotClicked: (index) {
SpacesCubit.get(context).unselectRoom();
},
),
),
],
),
@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
import 'package:syncrow_app/features/devices/view/widgets/devices_mode_tab.dart';
import 'package:syncrow_app/features/shared_widgets/text_widgets/title_medium.dart';
import 'package:syncrow_app/utils/context_extension.dart';
import 'package:syncrow_app/utils/resource_manager/constants.dart';
import 'package:syncrow_app/utils/resource_manager/strings_manager.dart';
class DevicesViewHeader extends StatelessWidget {
@@ -11,17 +12,25 @@ class DevicesViewHeader extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
TitleMedium(
text: StringsManager.devices,
style: context.titleMedium.copyWith(
fontSize: 25,
return Padding(
padding: const EdgeInsets.symmetric(
horizontal: Constants.defaultPadding,
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
TitleMedium(
text: StringsManager.devices,
style: context.titleMedium.copyWith(
fontSize: 25,
),
),
),
const DevicesModeTab(),
],
const DevicesModeTab(),
const SizedBox(
height: 20,
),
],
),
);
}
}
@@ -15,11 +15,13 @@ class RoomsSlider extends StatelessWidget {
Widget build(BuildContext context) {
return BlocBuilder<SpacesCubit, SpacesState>(
builder: (context, state) {
return SingleChildScrollView(
controller: SpacesCubit.get(context).roomsScrollController,
scrollDirection: Axis.horizontal,
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
return SizedBox(
height: 40,
child: PageView(
controller: SpacesCubit.get(context).roomsPageController,
onPageChanged: (index) {
SpacesCubit.get(context).roomSliderPageChanged(index);
},
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 15),
@@ -43,18 +45,17 @@ class RoomsSlider extends StatelessWidget {
padding: const EdgeInsets.symmetric(horizontal: 15),
child: InkWell(
onTap: () {
SpacesCubit.get(context).selectRoom(room);
SpacesCubit.get(context).roomSliderPageChanged(
SpacesCubit.get(context)
.selectedSpace
.rooms
.indexOf(room));
},
child: TitleMedium(
text: room.name,
style: context.titleMedium.copyWith(
fontSize: 25,
color: SpacesCubit.get(context).selectedRoomIndex ==
SpacesCubit.get(context)
.selectedSpace
.rooms
.indexOf(room) +
1
color: SpacesCubit.get(context).selectedRoom == room
? ColorsManager.textPrimaryColor
: ColorsManager.textPrimaryColor
.withOpacity(.2),
@@ -66,6 +67,58 @@ class RoomsSlider extends StatelessWidget {
],
),
);
// SingleChildScrollView(
// controller: SpacesCubit.get(context).roomsScrollController,
// scrollDirection: Axis.horizontal,
// child: Row(
// mainAxisAlignment: MainAxisAlignment.start,
// children: [
// Padding(
// padding: const EdgeInsets.symmetric(horizontal: 15),
// child: InkWell(
// onTap: () {
// SpacesCubit.get(context).unselectRoom();
// },
// child: TitleMedium(
// text: StringsManager.wizard,
// style: context.titleMedium.copyWith(
// fontSize: 25,
// color: SpacesCubit.get(context).selectedRoom == null
// ? ColorsManager.textPrimaryColor
// : ColorsManager.textPrimaryColor.withOpacity(.2),
// ),
// ),
// ),
// ),
// ...SpacesCubit.get(context).selectedSpace.rooms.map(
// (room) => Padding(
// padding: const EdgeInsets.symmetric(horizontal: 15),
// child: InkWell(
// onTap: () {
// SpacesCubit.get(context).selectRoom(room);
// },
// child: TitleMedium(
// text: room.name,
// style: context.titleMedium.copyWith(
// fontSize: 25,
// color: SpacesCubit.get(context).selectedRoomIndex ==
// SpacesCubit.get(context)
// .selectedSpace
// .rooms
// .indexOf(room) +
// 1
// ? ColorsManager.textPrimaryColor
// : ColorsManager.textPrimaryColor
// .withOpacity(.2),
// ),
// ),
// ),
// ),
// )
// ],
// ),
// );
},
);
}