mirror of
https://github.com/SyncrowIOT/syncrow-app.git
synced 2025-07-15 17:47:28 +00:00
Partially implemented the page view functionality
-page controller on change need to be figured correctly
This commit is contained in:
@ -1,3 +1,4 @@
|
|||||||
|
import 'package:flutter/material.dart';
|
||||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||||
import 'package:syncrow_app/features/app_layout/model/space_model.dart';
|
import 'package:syncrow_app/features/app_layout/model/space_model.dart';
|
||||||
import 'package:syncrow_app/features/devices/model/ac_model.dart';
|
import 'package:syncrow_app/features/devices/model/ac_model.dart';
|
||||||
@ -23,7 +24,172 @@ class SpacesCubit extends Cubit<SpacesState> {
|
|||||||
SpaceModel(
|
SpaceModel(
|
||||||
id: '0',
|
id: '0',
|
||||||
name: 'Home',
|
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(
|
SpaceModel(
|
||||||
id: '1',
|
id: '1',
|
||||||
@ -36,98 +202,55 @@ class SpacesCubit extends Cubit<SpacesState> {
|
|||||||
rooms: [],
|
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;
|
SpaceModel selectedSpace = spaces.first;
|
||||||
|
|
||||||
|
RoomModel? selectedRoom;
|
||||||
|
|
||||||
|
PageController devicesPageController = PageController();
|
||||||
|
|
||||||
|
ScrollController roomsScrollController = ScrollController();
|
||||||
|
|
||||||
|
int selectedRoomIndex = 0;
|
||||||
|
|
||||||
selectSpace(SpaceModel space) {
|
selectSpace(SpaceModel space) {
|
||||||
selectedSpace = space;
|
selectedSpace = space;
|
||||||
emit(SpacesSelected(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
|
//TODO implement the methods to fetch the spaces from the API
|
||||||
}
|
}
|
||||||
|
@ -17,3 +17,11 @@ class SpacesSelected extends SpacesState {
|
|||||||
|
|
||||||
SpacesSelected(this.space);
|
SpacesSelected(this.space);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
class RoomSelected extends SpacesState {
|
||||||
|
final RoomModel room;
|
||||||
|
|
||||||
|
RoomSelected(this.room);
|
||||||
|
}
|
||||||
|
|
||||||
|
class RoomUnSelected extends SpacesState {}
|
||||||
|
@ -17,53 +17,56 @@ class AppBarHomeDropdown extends StatelessWidget {
|
|||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return BlocBuilder<SpacesCubit, SpacesState>(
|
return BlocBuilder<SpacesCubit, SpacesState>(
|
||||||
builder: (context, state) {
|
builder: (context, state) {
|
||||||
return DropdownButton(
|
return Padding(
|
||||||
icon: const Icon(
|
padding: const EdgeInsets.only(left: 10, right: 10),
|
||||||
Icons.expand_more,
|
child: DropdownButton(
|
||||||
color: Colors.black,
|
icon: const Icon(
|
||||||
size: 25,
|
Icons.expand_more,
|
||||||
),
|
color: Colors.black,
|
||||||
underline: const SizedBox.shrink(),
|
size: 25,
|
||||||
padding: const EdgeInsets.all(0),
|
),
|
||||||
borderRadius: BorderRadius.circular(20),
|
underline: const SizedBox.shrink(),
|
||||||
value: SpacesCubit.get(context).selectedSpace,
|
padding: const EdgeInsets.all(0),
|
||||||
items: SpacesCubit.spaces.map((space) {
|
borderRadius: BorderRadius.circular(20),
|
||||||
return DropdownMenuItem(
|
value: SpacesCubit.get(context).selectedSpace,
|
||||||
value: space,
|
items: SpacesCubit.spaces.map((space) {
|
||||||
child: SizedBox(
|
return DropdownMenuItem(
|
||||||
width: 100,
|
value: space,
|
||||||
child: Row(
|
child: SizedBox(
|
||||||
mainAxisAlignment: MainAxisAlignment.start,
|
width: 100,
|
||||||
mainAxisSize: MainAxisSize.min,
|
child: Row(
|
||||||
children: <Widget>[
|
mainAxisAlignment: MainAxisAlignment.start,
|
||||||
SvgPicture.asset(
|
mainAxisSize: MainAxisSize.min,
|
||||||
Assets.iconsHome,
|
children: <Widget>[
|
||||||
width: 25,
|
SvgPicture.asset(
|
||||||
height: 25,
|
Assets.iconsHome,
|
||||||
colorFilter: const ColorFilter.mode(
|
width: 25,
|
||||||
ColorsManager.textPrimaryColor,
|
height: 25,
|
||||||
BlendMode.srcIn,
|
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,
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
const SizedBox(width: 5),
|
||||||
],
|
Expanded(
|
||||||
|
child: BodyMedium(
|
||||||
|
text: space.name,
|
||||||
|
style: context.bodyMedium.copyWith(
|
||||||
|
fontSize: 15,
|
||||||
|
color: ColorsManager.textPrimaryColor,
|
||||||
|
overflow: TextOverflow.ellipsis,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
);
|
||||||
);
|
}).toList(),
|
||||||
}).toList(),
|
onChanged: (value) {
|
||||||
onChanged: (value) {
|
SpacesCubit.get(context).selectSpace(value!);
|
||||||
SpacesCubit.get(context).selectSpace(value!);
|
},
|
||||||
},
|
),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
|
@ -1,13 +1,14 @@
|
|||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||||
import 'package:smooth_page_indicator/smooth_page_indicator.dart';
|
import 'package:smooth_page_indicator/smooth_page_indicator.dart';
|
||||||
|
import 'package:syncrow_app/features/app_layout/bloc/spaces_cubit.dart';
|
||||||
|
import 'package:syncrow_app/features/devices/view/widgets/devices_view_header.dart';
|
||||||
|
import 'package:syncrow_app/features/devices/view/widgets/room_page.dart';
|
||||||
|
import 'package:syncrow_app/features/devices/view/widgets/rooms_slider.dart';
|
||||||
import 'package:syncrow_app/features/devices/view/widgets/wizard_page.dart';
|
import 'package:syncrow_app/features/devices/view/widgets/wizard_page.dart';
|
||||||
import 'package:syncrow_app/features/shared_widgets/text_widgets/title_medium.dart';
|
|
||||||
import 'package:syncrow_app/utils/resource_manager/constants.dart';
|
import 'package:syncrow_app/utils/resource_manager/constants.dart';
|
||||||
|
|
||||||
import '../../../../utils/resource_manager/strings_manager.dart';
|
|
||||||
import '../../bloc/devices_cubit.dart';
|
import '../../bloc/devices_cubit.dart';
|
||||||
import 'switches.dart';
|
|
||||||
|
|
||||||
class DevicesViewBody extends StatelessWidget {
|
class DevicesViewBody extends StatelessWidget {
|
||||||
const DevicesViewBody({
|
const DevicesViewBody({
|
||||||
@ -21,7 +22,6 @@ class DevicesViewBody extends StatelessWidget {
|
|||||||
child: BlocBuilder<DevicesCubit, DevicesState>(
|
child: BlocBuilder<DevicesCubit, DevicesState>(
|
||||||
builder: (context, state) {
|
builder: (context, state) {
|
||||||
//TODO : move to NavigationCubit
|
//TODO : move to NavigationCubit
|
||||||
PageController pageController = PageController();
|
|
||||||
return state is DevicesLoading
|
return state is DevicesLoading
|
||||||
? const Center(child: CircularProgressIndicator())
|
? const Center(child: CircularProgressIndicator())
|
||||||
: Padding(
|
: Padding(
|
||||||
@ -31,95 +31,24 @@ class DevicesViewBody extends StatelessWidget {
|
|||||||
child: Column(
|
child: Column(
|
||||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||||
children: [
|
children: [
|
||||||
|
const DevicesViewHeader(),
|
||||||
|
const RoomsSlider(),
|
||||||
|
const SizedBox(
|
||||||
|
height: 10,
|
||||||
|
),
|
||||||
Expanded(
|
Expanded(
|
||||||
child: PageView(
|
child: PageView(
|
||||||
controller: pageController,
|
controller:
|
||||||
children: const [
|
SpacesCubit.get(context).devicesPageController,
|
||||||
WizardPage(),
|
children: [
|
||||||
Padding(
|
const WizardPage(),
|
||||||
padding: EdgeInsets.symmetric(
|
...SpacesCubit.get(context).selectedSpace.rooms.map(
|
||||||
horizontal: Constants.defaultPadding),
|
(room) {
|
||||||
child: Column(
|
return RoomPage(
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
room: room,
|
||||||
children: [
|
);
|
||||||
Expanded(
|
},
|
||||||
child: Column(
|
)
|
||||||
crossAxisAlignment:
|
|
||||||
CrossAxisAlignment.start,
|
|
||||||
children: [
|
|
||||||
TitleMedium(
|
|
||||||
text: "Home",
|
|
||||||
style: TextStyle(
|
|
||||||
fontSize: 32,
|
|
||||||
fontWeight: FontWeight.bold,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Expanded(
|
|
||||||
flex: 3,
|
|
||||||
child: SingleChildScrollView(
|
|
||||||
child: Column(
|
|
||||||
crossAxisAlignment:
|
|
||||||
CrossAxisAlignment.start,
|
|
||||||
children: [
|
|
||||||
TitleMedium(
|
|
||||||
text: StringsManager.wizard,
|
|
||||||
style: TextStyle(
|
|
||||||
fontSize: 28,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Switches(),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
)
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Padding(
|
|
||||||
padding: EdgeInsets.symmetric(
|
|
||||||
horizontal: Constants.defaultPadding),
|
|
||||||
child: Column(
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
|
||||||
children: [
|
|
||||||
Expanded(
|
|
||||||
child: Column(
|
|
||||||
crossAxisAlignment:
|
|
||||||
CrossAxisAlignment.start,
|
|
||||||
children: [
|
|
||||||
TitleMedium(
|
|
||||||
text: "Office",
|
|
||||||
style: TextStyle(
|
|
||||||
fontSize: 32,
|
|
||||||
fontWeight: FontWeight.bold,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Expanded(
|
|
||||||
flex: 3,
|
|
||||||
child: SingleChildScrollView(
|
|
||||||
child: Column(
|
|
||||||
crossAxisAlignment:
|
|
||||||
CrossAxisAlignment.start,
|
|
||||||
children: [
|
|
||||||
TitleMedium(
|
|
||||||
text: StringsManager.wizard,
|
|
||||||
style: TextStyle(
|
|
||||||
fontSize: 28,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Switches(),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
)
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
@ -128,18 +57,21 @@ class DevicesViewBody extends StatelessWidget {
|
|||||||
vertical: 7,
|
vertical: 7,
|
||||||
),
|
),
|
||||||
child: SmoothPageIndicator(
|
child: SmoothPageIndicator(
|
||||||
controller: pageController,
|
controller:
|
||||||
|
SpacesCubit.get(context).devicesPageController,
|
||||||
count: 3,
|
count: 3,
|
||||||
effect: const WormEffect(
|
effect: const WormEffect(
|
||||||
dotHeight: 8,
|
dotHeight: 8,
|
||||||
dotWidth: 8,
|
dotWidth: 8,
|
||||||
),
|
),
|
||||||
onDotClicked: (index) {
|
onDotClicked: (index) {
|
||||||
pageController.animateToPage(
|
SpacesCubit.get(context)
|
||||||
index,
|
.devicesPageController
|
||||||
duration: const Duration(milliseconds: 300),
|
.animateToPage(
|
||||||
curve: Curves.ease,
|
index,
|
||||||
);
|
duration: const Duration(milliseconds: 300),
|
||||||
|
curve: Curves.ease,
|
||||||
|
);
|
||||||
}),
|
}),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
|
27
lib/features/devices/view/widgets/devices_view_header.dart
Normal file
27
lib/features/devices/view/widgets/devices_view_header.dart
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
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/strings_manager.dart';
|
||||||
|
|
||||||
|
class DevicesViewHeader extends StatelessWidget {
|
||||||
|
const DevicesViewHeader({
|
||||||
|
super.key,
|
||||||
|
});
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
TitleMedium(
|
||||||
|
text: StringsManager.devices,
|
||||||
|
style: context.titleMedium.copyWith(
|
||||||
|
fontSize: 25,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
const DevicesModeTab(),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@ -39,7 +39,7 @@ class LightInterfaceSwitch extends StatelessWidget {
|
|||||||
width: 35,
|
width: 35,
|
||||||
decoration: ShapeDecoration(
|
decoration: ShapeDecoration(
|
||||||
color: light.status ?? false
|
color: light.status ?? false
|
||||||
? ColorsManager.primaryWithOpacity
|
? ColorsManager.primaryColorWithOpacity
|
||||||
: Colors.grey,
|
: Colors.grey,
|
||||||
shape: const CircleBorder(),
|
shape: const CircleBorder(),
|
||||||
),
|
),
|
||||||
|
98
lib/features/devices/view/widgets/room_page.dart
Normal file
98
lib/features/devices/view/widgets/room_page.dart
Normal file
@ -0,0 +1,98 @@
|
|||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||||
|
import 'package:flutter_svg/flutter_svg.dart';
|
||||||
|
import 'package:syncrow_app/features/devices/bloc/devices_cubit.dart';
|
||||||
|
import 'package:syncrow_app/features/devices/model/room_model.dart';
|
||||||
|
import 'package:syncrow_app/features/shared_widgets/custom_switch.dart';
|
||||||
|
import 'package:syncrow_app/features/shared_widgets/default_container.dart';
|
||||||
|
import 'package:syncrow_app/features/shared_widgets/text_widgets/body_large.dart';
|
||||||
|
import 'package:syncrow_app/utils/context_extension.dart';
|
||||||
|
import 'package:syncrow_app/utils/resource_manager/constants.dart';
|
||||||
|
|
||||||
|
class RoomPage extends StatelessWidget {
|
||||||
|
const RoomPage({super.key, required this.room});
|
||||||
|
|
||||||
|
final RoomModel room;
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return Padding(
|
||||||
|
padding: const EdgeInsets.symmetric(horizontal: Constants.defaultPadding),
|
||||||
|
child: SingleChildScrollView(
|
||||||
|
child: BlocBuilder<DevicesCubit, DevicesState>(
|
||||||
|
builder: (context, state) {
|
||||||
|
return GridView.builder(
|
||||||
|
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
||||||
|
crossAxisCount: 2,
|
||||||
|
crossAxisSpacing: 10,
|
||||||
|
mainAxisSpacing: 10,
|
||||||
|
childAspectRatio: 1.5,
|
||||||
|
),
|
||||||
|
padding: const EdgeInsets.only(top: 10),
|
||||||
|
physics: const NeverScrollableScrollPhysics(),
|
||||||
|
shrinkWrap: true,
|
||||||
|
itemCount: room.categories.length,
|
||||||
|
itemBuilder: (_, index) {
|
||||||
|
return InkWell(
|
||||||
|
onTap: () {
|
||||||
|
DevicesCubit.get(context).selectCategory(index);
|
||||||
|
//Navigate to the chosen category view without animation
|
||||||
|
|
||||||
|
// Navigator.push(
|
||||||
|
// context,
|
||||||
|
// CustomPageRoute(
|
||||||
|
// builder: (context) {
|
||||||
|
// return DevicesCubit.get(context)
|
||||||
|
// .chosenCategoryView!;
|
||||||
|
// },
|
||||||
|
// ),
|
||||||
|
// );
|
||||||
|
},
|
||||||
|
child: DefaultContainer(
|
||||||
|
child: Padding(
|
||||||
|
padding:
|
||||||
|
const EdgeInsets.only(top: 10, right: 10, left: 10),
|
||||||
|
child: Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||||
|
children: [
|
||||||
|
Row(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||||
|
children: [
|
||||||
|
SvgPicture.asset(
|
||||||
|
room.categories[index].icon,
|
||||||
|
fit: BoxFit.contain,
|
||||||
|
),
|
||||||
|
CustomSwitch(
|
||||||
|
category: room.categories[index],
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
Expanded(
|
||||||
|
child: FittedBox(
|
||||||
|
fit: BoxFit.scaleDown,
|
||||||
|
child: BodyLarge(
|
||||||
|
text: room.categories[index].name,
|
||||||
|
style: context.bodyLarge.copyWith(
|
||||||
|
fontWeight: FontWeight.bold,
|
||||||
|
height: 0,
|
||||||
|
fontSize: 24,
|
||||||
|
color: Colors.grey,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
);
|
||||||
|
},
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
72
lib/features/devices/view/widgets/rooms_slider.dart
Normal file
72
lib/features/devices/view/widgets/rooms_slider.dart
Normal file
@ -0,0 +1,72 @@
|
|||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||||
|
import 'package:syncrow_app/features/app_layout/bloc/spaces_cubit.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/color_manager.dart';
|
||||||
|
import 'package:syncrow_app/utils/resource_manager/strings_manager.dart';
|
||||||
|
|
||||||
|
class RoomsSlider extends StatelessWidget {
|
||||||
|
const RoomsSlider({
|
||||||
|
super.key,
|
||||||
|
});
|
||||||
|
|
||||||
|
@override
|
||||||
|
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,
|
||||||
|
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),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
)
|
||||||
|
],
|
||||||
|
),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@ -1,11 +1,8 @@
|
|||||||
import 'package:flutter/cupertino.dart';
|
import 'package:flutter/cupertino.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:flutter/widgets.dart';
|
import 'package:flutter/widgets.dart';
|
||||||
import 'package:syncrow_app/features/devices/view/widgets/devices_mode_tab.dart';
|
import 'package:syncrow_app/features/devices/view/widgets/wizard_switches.dart';
|
||||||
import 'package:syncrow_app/features/devices/view/widgets/switches.dart';
|
|
||||||
import 'package:syncrow_app/features/shared_widgets/text_widgets/title_medium.dart';
|
|
||||||
import 'package:syncrow_app/utils/resource_manager/constants.dart';
|
import 'package:syncrow_app/utils/resource_manager/constants.dart';
|
||||||
import 'package:syncrow_app/utils/resource_manager/strings_manager.dart';
|
|
||||||
|
|
||||||
class WizardPage extends StatelessWidget {
|
class WizardPage extends StatelessWidget {
|
||||||
const WizardPage({
|
const WizardPage({
|
||||||
@ -16,43 +13,8 @@ class WizardPage extends StatelessWidget {
|
|||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return const Padding(
|
return const Padding(
|
||||||
padding: EdgeInsets.symmetric(horizontal: Constants.defaultPadding),
|
padding: EdgeInsets.symmetric(horizontal: Constants.defaultPadding),
|
||||||
child: Column(
|
child: SingleChildScrollView(
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
child: WizartSwitches(),
|
||||||
children: [
|
|
||||||
Expanded(
|
|
||||||
flex: 3,
|
|
||||||
child: Column(
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
|
||||||
children: [
|
|
||||||
TitleMedium(
|
|
||||||
text: StringsManager.devices,
|
|
||||||
style: TextStyle(
|
|
||||||
fontSize: 32,
|
|
||||||
fontWeight: FontWeight.bold,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
DevicesModeTab(),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Expanded(
|
|
||||||
flex: 11,
|
|
||||||
child: SingleChildScrollView(
|
|
||||||
child: Column(
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
|
||||||
children: [
|
|
||||||
TitleMedium(
|
|
||||||
text: StringsManager.wizard,
|
|
||||||
style: TextStyle(
|
|
||||||
fontSize: 28,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Switches(),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
)
|
|
||||||
],
|
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -9,8 +9,8 @@ import 'package:syncrow_app/utils/helpers/custom_page_route.dart';
|
|||||||
|
|
||||||
import '../../bloc/devices_cubit.dart';
|
import '../../bloc/devices_cubit.dart';
|
||||||
|
|
||||||
class Switches extends StatelessWidget {
|
class WizartSwitches extends StatelessWidget {
|
||||||
const Switches({
|
const WizartSwitches({
|
||||||
super.key,
|
super.key,
|
||||||
});
|
});
|
||||||
|
|
@ -28,12 +28,13 @@ class CustomText extends StatelessWidget {
|
|||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return SelectableText(
|
//was SelectableText
|
||||||
|
return Text(
|
||||||
text,
|
text,
|
||||||
style: style,
|
style: style,
|
||||||
textAlign: textAlign,
|
textAlign: textAlign,
|
||||||
onTap: onTap,
|
// onTap: onTap,
|
||||||
minLines: minLines,
|
// minLines: minLines,
|
||||||
maxLines: maxLines,
|
maxLines: maxLines,
|
||||||
textDirection: textDirection,
|
textDirection: textDirection,
|
||||||
);
|
);
|
||||||
|
@ -3,14 +3,15 @@ import 'package:flutter/material.dart';
|
|||||||
abstract class ColorsManager {
|
abstract class ColorsManager {
|
||||||
static const Color textPrimaryColor = Color(0xFF5D5D5D);
|
static const Color textPrimaryColor = Color(0xFF5D5D5D);
|
||||||
static const Color primaryColor = Color(0xFF0030CB);
|
static const Color primaryColor = Color(0xFF0030CB);
|
||||||
static Color primaryWithOpacity = const Color(0xFF023DFE).withOpacity(0.6);
|
static Color primaryColorWithOpacity =
|
||||||
|
const Color(0xFF023DFE).withOpacity(0.6);
|
||||||
static const Color onPrimaryColor = Colors.white;
|
static const Color onPrimaryColor = Colors.white;
|
||||||
static const Color secondaryColor = Color(0xFF023DFE);
|
static const Color secondaryColor = Color(0xFF023DFE);
|
||||||
static const Color onSecondaryColor = Color(0xFF023DFE);
|
static const Color onSecondaryColor = Color(0xFF023DFE);
|
||||||
static const Color primaryTextColor = Colors.black;
|
static const Color primaryTextColor = Colors.black;
|
||||||
|
|
||||||
static const Color greyColor = Color(0xFFd5d5d5);
|
static const Color greyColor = Color(0xFFd5d5d5);
|
||||||
|
|
||||||
static const Color backgroundColor = Color(0xFFececec);
|
static const Color backgroundColor = Color(0xFFececec);
|
||||||
static const Color dozeColor = Color(0xFFFEC258);
|
static const Color dozeColor = Color(0xFFFEC258);
|
||||||
static const Color relaxColor = Color(0xFFFBD288);
|
static const Color relaxColor = Color(0xFFFBD288);
|
||||||
|
Reference in New Issue
Block a user