mirror of
https://github.com/SyncrowIOT/syncrow-app.git
synced 2025-07-15 17:47:28 +00:00
Initilized the Blinds View and its animations
This commit is contained in:
BIN
assets/images/Down.png
Normal file
BIN
assets/images/Down.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 29 KiB |
BIN
assets/images/HorizintalBlade.png
Normal file
BIN
assets/images/HorizintalBlade.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 409 B |
BIN
assets/images/Pause.png
Normal file
BIN
assets/images/Pause.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 24 KiB |
BIN
assets/images/Up.png
Normal file
BIN
assets/images/Up.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 29 KiB |
BIN
assets/images/Window.png
Normal file
BIN
assets/images/Window.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 3.2 KiB |
@ -387,6 +387,51 @@ class DevicesCubit extends Cubit<DevicesState> {
|
||||
// emitSafe(LightBrightnessChanged(value));
|
||||
// }
|
||||
// }
|
||||
|
||||
//////////////////////////////////CURTAINS//////////////////////////////////////
|
||||
double height = 310;
|
||||
double _openPercentage = 0;
|
||||
|
||||
openCurtain() async {
|
||||
for (var i = 0; i < 10; i++) {
|
||||
if (state is! CurtainsIsMoving) {
|
||||
break;
|
||||
}
|
||||
|
||||
emit(CurtainsIsMoving());
|
||||
|
||||
await Future.delayed(const Duration(milliseconds: 200), () {
|
||||
if (_openPercentage < 100.0) {
|
||||
_openPercentage += 10.0;
|
||||
height -= 24.5;
|
||||
} else {
|
||||
emit(CurtainsStopped());
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
closeCurtain() async {
|
||||
for (var i = 0; i < 10; i++) {
|
||||
if (state is! CurtainsIsMoving) {
|
||||
break;
|
||||
}
|
||||
|
||||
await Future.delayed(const Duration(milliseconds: 200), () {
|
||||
if (_openPercentage > 0.0) {
|
||||
_openPercentage -= 10.0;
|
||||
height += 24.5;
|
||||
emit(CurtainsIsMoving());
|
||||
} else {
|
||||
emit(CurtainsStopped());
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
pauseCurtain() {
|
||||
emit(CurtainsStopped());
|
||||
}
|
||||
}
|
||||
|
||||
enum LightMode {
|
||||
|
@ -80,3 +80,8 @@ class DevicesCategoriesError extends DevicesState {
|
||||
|
||||
DevicesCategoriesError(this.errorMsg);
|
||||
}
|
||||
|
||||
// Curtains
|
||||
class CurtainsIsMoving extends DevicesState {}
|
||||
|
||||
class CurtainsStopped extends DevicesState {}
|
||||
|
29
lib/features/devices/view/widgets/curtains/blind_view.dart
Normal file
29
lib/features/devices/view/widgets/curtains/blind_view.dart
Normal file
@ -0,0 +1,29 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||
import 'package:syncrow_app/features/devices/bloc/devices_cubit.dart';
|
||||
import 'package:syncrow_app/features/devices/view/widgets/curtains/blinds_blades.dart';
|
||||
import 'package:syncrow_app/features/shared_widgets/default_scaffold.dart';
|
||||
|
||||
class BlindsView extends StatelessWidget {
|
||||
const BlindsView({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return BlocBuilder<DevicesCubit, DevicesState>(
|
||||
builder: (context, state) {
|
||||
return const DefaultScaffold(
|
||||
title: 'Blinds',
|
||||
child: Column(
|
||||
children: [
|
||||
Spacer(),
|
||||
BlindsBlades(),
|
||||
// SizedBox(height: 80),
|
||||
// BlindsBottons(),
|
||||
Spacer(),
|
||||
],
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
144
lib/features/devices/view/widgets/curtains/blinds_blades.dart
Normal file
144
lib/features/devices/view/widgets/curtains/blinds_blades.dart
Normal file
@ -0,0 +1,144 @@
|
||||
// ignore_for_file: avoid_print
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||
import 'package:syncrow_app/features/devices/bloc/devices_cubit.dart';
|
||||
import 'package:syncrow_app/generated/assets.dart';
|
||||
|
||||
class BlindsBlades extends StatelessWidget {
|
||||
const BlindsBlades({
|
||||
super.key,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return BlocBuilder<DevicesCubit, DevicesState>(
|
||||
builder: (context, state) {
|
||||
return Column(
|
||||
children: [
|
||||
Stack(
|
||||
alignment: Alignment.topCenter,
|
||||
children: [
|
||||
Container(
|
||||
height: 340,
|
||||
width: 365,
|
||||
decoration: const BoxDecoration(
|
||||
image: DecorationImage(
|
||||
image: AssetImage(
|
||||
Assets.imagesWindow,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(top: 15, bottom: 10),
|
||||
child: AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 200),
|
||||
curve: Curves.linear,
|
||||
height: DevicesCubit.get(context).height,
|
||||
width: 270,
|
||||
child: Stack(
|
||||
children: List.generate(
|
||||
25,
|
||||
(index) {
|
||||
double spacing =
|
||||
DevicesCubit.get(context).height / 24;
|
||||
double topPosition = index * spacing;
|
||||
return AnimatedPositioned(
|
||||
duration: const Duration(milliseconds: 200),
|
||||
curve: Curves.linear,
|
||||
top: topPosition,
|
||||
child: SizedBox(
|
||||
height: 10,
|
||||
width: 270,
|
||||
child: Image.asset(
|
||||
Assets.imagesHorizintalBlade,
|
||||
fit: BoxFit.fill,
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 80),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
||||
children: [
|
||||
DecoratedBox(
|
||||
decoration: BoxDecoration(shape: BoxShape.circle, boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.grey.withOpacity(0.5),
|
||||
spreadRadius: 1,
|
||||
blurRadius: 5,
|
||||
offset: const Offset(3, 3),
|
||||
),
|
||||
]),
|
||||
child: InkWell(
|
||||
overlayColor: MaterialStateProperty.all(Colors.transparent),
|
||||
onTap: () {
|
||||
// DevicesCubit.get(context).setHight(false);
|
||||
DevicesCubit.get(context).openCurtain();
|
||||
},
|
||||
child: Image.asset(
|
||||
Assets.imagesUp,
|
||||
width: 60,
|
||||
height: 60,
|
||||
),
|
||||
),
|
||||
),
|
||||
DecoratedBox(
|
||||
decoration: BoxDecoration(shape: BoxShape.circle, boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.grey.withOpacity(0.5),
|
||||
spreadRadius: 1,
|
||||
blurRadius: 5,
|
||||
offset: const Offset(3, 3),
|
||||
),
|
||||
]),
|
||||
child: InkWell(
|
||||
overlayColor: MaterialStateProperty.all(Colors.transparent),
|
||||
onTap: () {
|
||||
DevicesCubit.get(context).pauseCurtain();
|
||||
},
|
||||
child: Image.asset(
|
||||
Assets.imagesPause,
|
||||
width: 60,
|
||||
height: 60,
|
||||
),
|
||||
),
|
||||
),
|
||||
DecoratedBox(
|
||||
decoration: BoxDecoration(shape: BoxShape.circle, boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.grey.withOpacity(0.5),
|
||||
spreadRadius: 1,
|
||||
blurRadius: 5,
|
||||
offset: const Offset(3, 3),
|
||||
),
|
||||
]),
|
||||
child: InkWell(
|
||||
overlayColor: MaterialStateProperty.all(Colors.transparent),
|
||||
onTap: () {
|
||||
// DevicesCubit.get(context).setHight(true);
|
||||
// DevicesCubit.get(context).openCurtain();
|
||||
DevicesCubit.get(context).closeCurtain();
|
||||
},
|
||||
child: Image.asset(
|
||||
Assets.imagesDown,
|
||||
width: 60,
|
||||
height: 60,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
@ -0,0 +1,83 @@
|
||||
// import 'package:flutter/material.dart';
|
||||
// import 'package:syncrow_app/features/devices/bloc/devices_cubit.dart';
|
||||
// import 'package:syncrow_app/generated/assets.dart';
|
||||
|
||||
// class BlindsBottons extends StatelessWidget {
|
||||
// const BlindsBottons({
|
||||
// super.key,
|
||||
// });
|
||||
|
||||
// @override
|
||||
// Widget build(BuildContext context) {
|
||||
// return Row(
|
||||
// mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
||||
// children: [
|
||||
// DecoratedBox(
|
||||
// decoration: BoxDecoration(shape: BoxShape.circle, boxShadow: [
|
||||
// BoxShadow(
|
||||
// color: Colors.grey.withOpacity(0.5),
|
||||
// spreadRadius: 1,
|
||||
// blurRadius: 5,
|
||||
// offset: const Offset(3, 3),
|
||||
// ),
|
||||
// ]),
|
||||
// child: InkWell(
|
||||
// overlayColor: MaterialStateProperty.all(Colors.transparent),
|
||||
// onTap: () {
|
||||
// // DevicesCubit.get(context).setHight(false);
|
||||
// DevicesCubit.get(context).closeCurtain();
|
||||
// },
|
||||
// child: Image.asset(
|
||||
// Assets.imagesUp,
|
||||
// width: 60,
|
||||
// height: 60,
|
||||
// ),
|
||||
// ),
|
||||
// ),
|
||||
// DecoratedBox(
|
||||
// decoration: BoxDecoration(shape: BoxShape.circle, boxShadow: [
|
||||
// BoxShadow(
|
||||
// color: Colors.grey.withOpacity(0.5),
|
||||
// spreadRadius: 1,
|
||||
// blurRadius: 5,
|
||||
// offset: const Offset(3, 3),
|
||||
// ),
|
||||
// ]),
|
||||
// child: InkWell(
|
||||
// overlayColor: MaterialStateProperty.all(Colors.transparent),
|
||||
// onTap: () {
|
||||
// // DevicesCubit.get(context).setHight(false);
|
||||
// },
|
||||
// child: Image.asset(
|
||||
// Assets.imagesPause,
|
||||
// width: 60,
|
||||
// height: 60,
|
||||
// ),
|
||||
// ),
|
||||
// ),
|
||||
// DecoratedBox(
|
||||
// decoration: BoxDecoration(shape: BoxShape.circle, boxShadow: [
|
||||
// BoxShadow(
|
||||
// color: Colors.grey.withOpacity(0.5),
|
||||
// spreadRadius: 1,
|
||||
// blurRadius: 5,
|
||||
// offset: const Offset(3, 3),
|
||||
// ),
|
||||
// ]),
|
||||
// child: InkWell(
|
||||
// overlayColor: MaterialStateProperty.all(Colors.transparent),
|
||||
// onTap: () {
|
||||
// // DevicesCubit.get(context).setHight(true);
|
||||
// DevicesCubit.get(context).openCurtain();
|
||||
// },
|
||||
// child: Image.asset(
|
||||
// Assets.imagesDown,
|
||||
// width: 60,
|
||||
// height: 60,
|
||||
// ),
|
||||
// ),
|
||||
// ),
|
||||
// ],
|
||||
// );
|
||||
// }
|
||||
// }
|
@ -25,7 +25,7 @@ class CurtainList extends StatelessWidget {
|
||||
const BodySmall(text: "All Curtains"),
|
||||
const SizedBox(height: 5),
|
||||
UniversalSwitch(
|
||||
category: DevicesCubit.getInstance().chosenCategory!,
|
||||
category: DevicesCubit.get(context).chosenCategory!,
|
||||
),
|
||||
|
||||
// other ACs controls
|
||||
@ -34,17 +34,16 @@ class CurtainList extends StatelessWidget {
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
padding: const EdgeInsets.all(0),
|
||||
itemCount:
|
||||
DevicesCubit.getInstance().chosenCategory!.devices!.length,
|
||||
DevicesCubit.get(context).chosenCategory!.devices!.length,
|
||||
itemBuilder: (context, index) {
|
||||
DeviceModel curtain = DevicesCubit.getInstance()
|
||||
.chosenCategory!
|
||||
.devices![index];
|
||||
DeviceModel curtain =
|
||||
DevicesCubit.get(context).chosenCategory!.devices![index];
|
||||
return Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
const SizedBox(height: 20),
|
||||
BodySmall(
|
||||
text: DevicesCubit.getInstance()
|
||||
text: DevicesCubit.get(context)
|
||||
.chosenCategory!
|
||||
.devices![index]
|
||||
.name ??
|
||||
|
@ -1,12 +1,9 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:flutter_bloc/flutter_bloc.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';
|
||||
import 'package:syncrow_app/utils/resource_manager/constants.dart';
|
||||
import 'package:syncrow_app/features/shared_widgets/default_scaffold.dart';
|
||||
|
||||
class CurtainView extends StatelessWidget {
|
||||
const CurtainView({super.key});
|
||||
@ -15,40 +12,9 @@ class CurtainView extends StatelessWidget {
|
||||
Widget build(BuildContext context) {
|
||||
return BlocBuilder<DevicesCubit, DevicesState>(
|
||||
builder: (context, state) {
|
||||
return AnnotatedRegion(
|
||||
value: SystemUiOverlayStyle(
|
||||
statusBarColor: ColorsManager.primaryColor.withOpacity(0.5),
|
||||
statusBarIconBrightness: Brightness.light,
|
||||
),
|
||||
child: Scaffold(
|
||||
backgroundColor: ColorsManager.backgroundColor,
|
||||
extendBodyBehindAppBar: true,
|
||||
extendBody: true,
|
||||
appBar: const CategoryViewAppBar(),
|
||||
body: SafeArea(
|
||||
child: Container(
|
||||
width: MediaQuery.sizeOf(context).width,
|
||||
height: MediaQuery.sizeOf(context).height,
|
||||
decoration: const BoxDecoration(
|
||||
image: DecorationImage(
|
||||
image: AssetImage(
|
||||
Assets.imagesBackground,
|
||||
),
|
||||
fit: BoxFit.cover,
|
||||
opacity: 0.4,
|
||||
),
|
||||
),
|
||||
child: Padding(
|
||||
padding: EdgeInsets.only(
|
||||
top: Constants.appBarHeight,
|
||||
left: Constants.defaultPadding,
|
||||
right: Constants.defaultPadding,
|
||||
),
|
||||
child: const CurtainList(),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
return const DefaultScaffold(
|
||||
appBar: CategoryViewAppBar(),
|
||||
child: CurtainList(),
|
||||
);
|
||||
},
|
||||
);
|
||||
|
@ -84,7 +84,7 @@ class Assets {
|
||||
static const String doorlockAssetsUnlockingRecords =
|
||||
'assets/icons/doorlock-assets/unlocking-records.svg';
|
||||
static const String fontsAftikaRegular = 'assets/fonts/AftikaRegular.ttf';
|
||||
static const String generalSettingsIconsClearCache =
|
||||
static const String generalSettingsIconsClearCach =
|
||||
'assets/icons/MenuIcons/GeneralSettingsIcons/clearCach.svg';
|
||||
static const String generalSettingsIconsLanguage =
|
||||
'assets/icons/MenuIcons/GeneralSettingsIcons/language.svg';
|
||||
@ -169,28 +169,34 @@ class Assets {
|
||||
static const String imagesBlind = 'assets/images/blind.png';
|
||||
static const String imagesBoxEmpty = 'assets/images/box-empty.jpg';
|
||||
static const String imagesCurtain = 'assets/images/curtain.png';
|
||||
static const String imagesDown = 'assets/images/Down.png';
|
||||
static const String imagesHorizintalBlade =
|
||||
'assets/images/HorizintalBlade.png';
|
||||
static const String imagesLogo = 'assets/images/Logo.svg';
|
||||
static const String imagesLogoHorizontal =
|
||||
'assets/images/logo_horizontal.png';
|
||||
static const String imagesPause = 'assets/images/Pause.png';
|
||||
static const String imagesTestDash = 'assets/images/test_dash.png';
|
||||
static const String imagesTestDash2 = 'assets/images/test_dash2.png';
|
||||
static const String imagesUp = 'assets/images/Up.png';
|
||||
static const String imagesVector = 'assets/images/Vector.png';
|
||||
static const String imagesWhiteLogo = 'assets/images/white-logo.png';
|
||||
static const String linkageIconsDoorLockAlarm =
|
||||
'assets/icons/linkageIcons/doorLockAlarm.svg';
|
||||
static const String linkageIconsFamilyHome =
|
||||
'assets/icons/linkageIcons/familyHome.svg';
|
||||
static const String imagesWindow = 'assets/images/Window.png';
|
||||
static const String leagalInfoIconsAbout =
|
||||
'assets/icons/MenuIcons/LeagalInfoIcons/About.svg';
|
||||
static const String leagalInfoIconsPrivacyPolicy =
|
||||
'assets/icons/MenuIcons/LeagalInfoIcons/PrivacyPolicy.svg';
|
||||
static const String leagalInfoIconsUserAgreement =
|
||||
'assets/icons/MenuIcons/LeagalInfoIcons/UserAgreement.svg';
|
||||
static const String linkageIconsDoorLockAlarm =
|
||||
'assets/icons/linkageIcons/doorLockAlarm.svg';
|
||||
static const String linkageIconsFamilyHome =
|
||||
'assets/icons/linkageIcons/familyHome.svg';
|
||||
static const String messagesCenterIconsAlerts =
|
||||
'assets/icons/MenuIcons/MessagesCenterIcons/Alerts.svg';
|
||||
static const String messagesCenterIconsFAQs =
|
||||
'assets/icons/MenuIcons/MessagesCenterIcons/FAQs.svg';
|
||||
static const String messagesCenterIconsHelpAndFeedbacks =
|
||||
static const String messagesCenterIconsHelpAndFeedback =
|
||||
'assets/icons/MenuIcons/MessagesCenterIcons/HelpAndFeedback.svg';
|
||||
static const String messagesCenterIconsMessages =
|
||||
'assets/icons/MenuIcons/MessagesCenterIcons/Messages.svg';
|
||||
@ -218,14 +224,14 @@ class Assets {
|
||||
'assets/icons/presence-sensor-assets/Record.svg';
|
||||
static const String presenceSensorAssetsTime =
|
||||
'assets/icons/presence-sensor-assets/Time.svg';
|
||||
static const String securityAndPrivacyIconsPrivacy =
|
||||
'assets/icons/MenuIcons/SecurityAndPrivacyIcons/Privacy.svg';
|
||||
static const String securityAndPrivacyIconsSecurty =
|
||||
'assets/icons/MenuIcons/SecurityAndPrivacyIcons/Securty.svg';
|
||||
static const String unlockingMethodsIconsFace =
|
||||
'assets/icons/unlockingMethodsIcons/face.svg';
|
||||
static const String unlockingMethodsIconsFingerprint =
|
||||
'assets/icons/unlockingMethodsIcons/fingerprint.svg';
|
||||
static const String unlockingMethodsIconsRemote =
|
||||
'assets/icons/unlockingMethodsIcons/remote.svg';
|
||||
static const String securityAndPrivacyIconsPrivacy =
|
||||
'assets/icons/MenuIcons/SecurityAndPrivacyIcons/Privacy.svg';
|
||||
static const String securityAndPrivacyIconsSecurty =
|
||||
'assets/icons/MenuIcons/SecurityAndPrivacyIcons/Securty.svg';
|
||||
}
|
||||
|
@ -322,7 +322,7 @@ List<Map<String, Object>> menuSections = [
|
||||
},
|
||||
{
|
||||
'title': 'Clear Cache',
|
||||
'Icon': Assets.generalSettingsIconsClearCache,
|
||||
'Icon': Assets.generalSettingsIconsClearCach,
|
||||
'page': null
|
||||
},
|
||||
],
|
||||
@ -345,7 +345,7 @@ List<Map<String, Object>> menuSections = [
|
||||
{'title': 'FAQs', 'Icon': Assets.messagesCenterIconsFAQs, 'page': null},
|
||||
{
|
||||
'title': 'Help & Feedback',
|
||||
'Icon': Assets.messagesCenterIconsHelpAndFeedbacks,
|
||||
'Icon': Assets.messagesCenterIconsHelpAndFeedback,
|
||||
'page': null
|
||||
},
|
||||
],
|
||||
|
Reference in New Issue
Block a user