Partially implemented the page view functionality

-page controller on change need to be figured correctly
This commit is contained in:
Mohammad Salameh
2024-03-06 23:11:09 +03:00
parent b3fcca639a
commit c5f88caec3
12 changed files with 503 additions and 276 deletions

View File

@ -1,3 +1,4 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_app/features/app_layout/model/space_model.dart';
import 'package:syncrow_app/features/devices/model/ac_model.dart';
@ -23,7 +24,172 @@ class SpacesCubit extends Cubit<SpacesState> {
SpaceModel(
id: '0',
name: 'Home',
rooms: [],
rooms: [
RoomModel(id: '0', name: 'Living Room', categories: [
DevicesCategoryModel(
devices: [
ACModel(
name: "Living Room AC",
id: '0',
status: false,
temperature: 20,
fanSpeed: 0,
tempMode: 0,
coolTo: 20,
type: '',
image: '',
timer: null,
bounds: Bounds(
min: 20,
max: 30,
),
),
],
icon: Assets.iconsAC,
name: 'ACs',
type: DeviceType.AC,
page: const ACsView(),
),
DevicesCategoryModel(
devices: [
LightModel(
name: "Living Room Light",
id: '0',
status: false,
color: 0,
brightness: 20,
lightingMode: 1,
timer: null,
type: '',
image: '',
recentColors: [
0xFF83D9FF,
0xFFFC3E81,
0xFFC0FF66,
0xFFFDC242,
],
),
],
icon: Assets.iconsLight,
name: 'Lights',
type: DeviceType.Lights,
page: const LightsView(),
),
DevicesCategoryModel(
devices: [],
icon: Assets.iconsDoorLock,
name: 'Doors',
type: DeviceType.Door,
page: const DoorView(),
),
DevicesCategoryModel(
devices: [
CurtainModel(
openPercentage: 10,
id: "1",
name: "Living Room Curtain",
status: false,
type: '',
image: '',
timer: null,
),
],
icon: Assets.iconsCurtain,
name: 'Curtains',
type: DeviceType.Curtain,
page: const CurtainView(),
),
DevicesCategoryModel(
devices: [],
icon: Assets.iconsGateway,
name: 'Gateway',
type: DeviceType.Gateway,
page: const GateWayView(),
),
]),
RoomModel(id: '1', name: 'Bedroom', categories: [
DevicesCategoryModel(
devices: [
ACModel(
name: "Living Room AC",
id: '0',
status: false,
temperature: 20,
fanSpeed: 0,
tempMode: 0,
coolTo: 20,
type: '',
image: '',
timer: null,
bounds: Bounds(
min: 20,
max: 30,
),
),
],
icon: Assets.iconsAC,
name: 'ACs',
type: DeviceType.AC,
page: const ACsView(),
),
DevicesCategoryModel(
devices: [
LightModel(
name: "Living Room Light",
id: '0',
status: false,
color: 0,
brightness: 20,
lightingMode: 1,
timer: null,
type: '',
image: '',
recentColors: [
0xFF83D9FF,
0xFFFC3E81,
0xFFC0FF66,
0xFFFDC242,
],
),
],
icon: Assets.iconsLight,
name: 'Lights',
type: DeviceType.Lights,
page: const LightsView(),
),
DevicesCategoryModel(
devices: [],
icon: Assets.iconsDoorLock,
name: 'Doors',
type: DeviceType.Door,
page: const DoorView(),
),
DevicesCategoryModel(
devices: [
CurtainModel(
openPercentage: 10,
id: "1",
name: "Living Room Curtain",
status: false,
type: '',
image: '',
timer: null,
),
],
icon: Assets.iconsCurtain,
name: 'Curtains',
type: DeviceType.Curtain,
page: const CurtainView(),
),
DevicesCategoryModel(
devices: [],
icon: Assets.iconsGateway,
name: 'Gateway',
type: DeviceType.Gateway,
page: const GateWayView(),
),
]),
],
),
SpaceModel(
id: '1',
@ -36,98 +202,55 @@ class SpacesCubit extends Cubit<SpacesState> {
rooms: [],
),
];
List<RoomModel> rooms = [
RoomModel(id: '0', name: 'Living Room', categories: [
DevicesCategoryModel(
devices: [
ACModel(
name: "Living Room AC",
id: '0',
status: false,
temperature: 20,
fanSpeed: 0,
tempMode: 0,
coolTo: 20,
type: '',
image: '',
timer: null,
bounds: Bounds(
min: 20,
max: 30,
),
),
],
icon: Assets.iconsAC,
name: 'ACs',
type: DeviceType.AC,
page: const ACsView(),
),
DevicesCategoryModel(
devices: [
LightModel(
name: "Living Room Light",
id: '0',
status: false,
color: 0,
brightness: 20,
lightingMode: 1,
timer: null,
type: '',
image: '',
recentColors: [
0xFF83D9FF,
0xFFFC3E81,
0xFFC0FF66,
0xFFFDC242,
],
),
],
icon: Assets.iconsLight,
name: 'Lights',
type: DeviceType.Lights,
page: const LightsView(),
),
DevicesCategoryModel(
devices: [],
icon: Assets.iconsDoorLock,
name: 'Doors',
type: DeviceType.Door,
page: const DoorView(),
),
DevicesCategoryModel(
devices: [
CurtainModel(
openPercentage: 10,
id: "1",
name: "Living Room Curtain",
status: false,
type: '',
image: '',
timer: null,
),
],
icon: Assets.iconsCurtain,
name: 'Curtains',
type: DeviceType.Curtain,
page: const CurtainView(),
),
DevicesCategoryModel(
devices: [],
icon: Assets.iconsScreen,
name: 'Gateway',
type: DeviceType.Gateway,
page: const GateWayView(),
),
]),
RoomModel(id: '1', name: 'Bedroom', categories: []),
];
SpaceModel selectedSpace = spaces.first;
RoomModel? selectedRoom;
PageController devicesPageController = PageController();
ScrollController roomsScrollController = ScrollController();
int selectedRoomIndex = 0;
selectSpace(SpaceModel space) {
selectedSpace = space;
emit(SpacesSelected(space));
}
updateSelectedRoomIndex(int index) {
selectedRoomIndex = index;
emit(RoomSelected(selectedSpace.rooms.elementAt(index)));
}
selectRoom(RoomModel room) {
selectedRoom = room;
selectedRoomIndex = selectedSpace.rooms.indexOf(room) + 1;
print(selectedRoomIndex);
devicesPageController.animateToPage(
selectedRoomIndex,
duration: const Duration(milliseconds: 300),
curve: Curves.easeInOut,
);
// roomsScrollController.animateTo(
// roomsScrollController.positions.elementAt(selectedRoomIndex).pixels,
// duration: const Duration(milliseconds: 300),
// curve: Curves.easeInOut,
// );
emit(RoomSelected(room));
}
unselectRoom() {
selectedRoom = null;
selectedRoomIndex = 0;
devicesPageController.animateToPage(
selectedRoomIndex,
duration: const Duration(milliseconds: 300),
curve: Curves.easeInOut,
);
emit(RoomUnSelected());
}
//TODO implement the methods to fetch the spaces from the API
}

View File

@ -17,3 +17,11 @@ class SpacesSelected extends SpacesState {
SpacesSelected(this.space);
}
class RoomSelected extends SpacesState {
final RoomModel room;
RoomSelected(this.room);
}
class RoomUnSelected extends SpacesState {}

View File

@ -17,53 +17,56 @@ class AppBarHomeDropdown extends StatelessWidget {
Widget build(BuildContext context) {
return BlocBuilder<SpacesCubit, SpacesState>(
builder: (context, state) {
return DropdownButton(
icon: const Icon(
Icons.expand_more,
color: Colors.black,
size: 25,
),
underline: const SizedBox.shrink(),
padding: const EdgeInsets.all(0),
borderRadius: BorderRadius.circular(20),
value: SpacesCubit.get(context).selectedSpace,
items: SpacesCubit.spaces.map((space) {
return DropdownMenuItem(
value: space,
child: SizedBox(
width: 100,
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
SvgPicture.asset(
Assets.iconsHome,
width: 25,
height: 25,
colorFilter: const ColorFilter.mode(
ColorsManager.textPrimaryColor,
BlendMode.srcIn,
),
),
const SizedBox(width: 5),
Expanded(
child: BodyMedium(
text: space.name,
style: context.bodyMedium.copyWith(
fontSize: 15,
color: ColorsManager.textPrimaryColor,
overflow: TextOverflow.ellipsis,
return Padding(
padding: const EdgeInsets.only(left: 10, right: 10),
child: DropdownButton(
icon: const Icon(
Icons.expand_more,
color: Colors.black,
size: 25,
),
underline: const SizedBox.shrink(),
padding: const EdgeInsets.all(0),
borderRadius: BorderRadius.circular(20),
value: SpacesCubit.get(context).selectedSpace,
items: SpacesCubit.spaces.map((space) {
return DropdownMenuItem(
value: space,
child: SizedBox(
width: 100,
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
SvgPicture.asset(
Assets.iconsHome,
width: 25,
height: 25,
colorFilter: const ColorFilter.mode(
ColorsManager.textPrimaryColor,
BlendMode.srcIn,
),
),
),
],
const SizedBox(width: 5),
Expanded(
child: BodyMedium(
text: space.name,
style: context.bodyMedium.copyWith(
fontSize: 15,
color: ColorsManager.textPrimaryColor,
overflow: TextOverflow.ellipsis,
),
),
),
],
),
),
),
);
}).toList(),
onChanged: (value) {
SpacesCubit.get(context).selectSpace(value!);
},
);
}).toList(),
onChanged: (value) {
SpacesCubit.get(context).selectSpace(value!);
},
),
);
},
);