diff --git a/assets/icons/curtainsIcon/closeCurtain.svg b/assets/icons/curtainsIcon/closeCurtain.svg new file mode 100644 index 0000000..8fa548f --- /dev/null +++ b/assets/icons/curtainsIcon/closeCurtain.svg @@ -0,0 +1,56 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/icons/curtainsIcon/curtainHolder.svg b/assets/icons/curtainsIcon/curtainHolder.svg new file mode 100644 index 0000000..8ed2e91 --- /dev/null +++ b/assets/icons/curtainsIcon/curtainHolder.svg @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/icons/curtainsIcon/openCurtain.svg b/assets/icons/curtainsIcon/openCurtain.svg new file mode 100644 index 0000000..67fd13c --- /dev/null +++ b/assets/icons/curtainsIcon/openCurtain.svg @@ -0,0 +1,56 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/icons/curtainsIcon/verticalBlade.svg b/assets/icons/curtainsIcon/verticalBlade.svg new file mode 100644 index 0000000..3089113 --- /dev/null +++ b/assets/icons/curtainsIcon/verticalBlade.svg @@ -0,0 +1,32 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/lib/features/devices/view/widgets/curtains/curtain_buttons.dart b/lib/features/devices/view/widgets/curtains/curtain_buttons.dart new file mode 100644 index 0000000..356023c --- /dev/null +++ b/lib/features/devices/view/widgets/curtains/curtain_buttons.dart @@ -0,0 +1,116 @@ +part of "curtain_view.dart"; + +class CurtainButtons extends StatelessWidget { + const CurtainButtons({super.key, required this.curtain}); + final DeviceModel curtain; + @override + Widget build(BuildContext context) { + return Row( + mainAxisAlignment: MainAxisAlignment.spaceEvenly, + children: [ + Stack( + alignment: Alignment.center, + 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).openCurtain(curtain.productType!); + }, + child: const SizedBox.square( + dimension: 60, + ), + ), + ), + Padding( + padding: const EdgeInsets.only(right: 5, bottom: 5), + child: InkWell( + overlayColor: MaterialStateProperty.all(Colors.transparent), + onTap: () { + DevicesCubit.get(context).openCurtain(curtain.productType!); + }, + child: SvgPicture.asset( + Assets.assetsIconsCurtainsIconOpenCurtain, + width: 110, + height: 110, + ), + ), + ) + ], + ), + 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.assetsImagesPause, + width: 60, + height: 60, + ), + ), + ), + Stack( + alignment: Alignment.center, + 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: const SizedBox.square( + dimension: 60, + ), + // InkWell( + // overlayColor: MaterialStateProperty.all(Colors.transparent), + // onTap: () { + // DevicesCubit.get(context).closeCurtain(curtain.productType!); + // }, + // child: SvgPicture.asset( + // Assets.assetsIconsCurtainsIconCloseCurtain, + // width: 60, + // height: 60, + // ), + // ), + ), + Padding( + padding: const EdgeInsets.only(right: 5, bottom: 5), + child: InkWell( + overlayColor: MaterialStateProperty.all(Colors.transparent), + onTap: () { + DevicesCubit.get(context).closeCurtain(curtain.productType!); + }, + child: SvgPicture.asset( + Assets.assetsIconsCurtainsIconCloseCurtain, + width: 110, + height: 110, + ), + ), + ) + ], + ), + ], + ); + } +} diff --git a/lib/features/devices/view/widgets/curtains/curtain_list_view.dart b/lib/features/devices/view/widgets/curtains/curtain_list_view.dart new file mode 100644 index 0000000..445ad4f --- /dev/null +++ b/lib/features/devices/view/widgets/curtains/curtain_list_view.dart @@ -0,0 +1,22 @@ +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/ACs/category_view_app_bar.dart'; +import 'package:syncrow_app/features/devices/view/widgets/curtains/curtain_list.dart'; +import 'package:syncrow_app/features/shared_widgets/default_scaffold.dart'; + +class CurtainListView extends StatelessWidget { + const CurtainListView({super.key}); + + @override + Widget build(BuildContext context) { + return BlocBuilder( + builder: (context, state) { + return const DefaultScaffold( + appBar: CategoryViewAppBar(), + child: CurtainList(), + ); + }, + ); + } +} diff --git a/lib/features/devices/view/widgets/curtains/curtain_view.dart b/lib/features/devices/view/widgets/curtains/curtain_view.dart index 65dae85..8815cb2 100644 --- a/lib/features/devices/view/widgets/curtains/curtain_view.dart +++ b/lib/features/devices/view/widgets/curtains/curtain_view.dart @@ -1,22 +1,87 @@ import 'package:flutter/material.dart'; +import 'package:flutter/widgets.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/view/widgets/ACs/category_view_app_bar.dart'; -import 'package:syncrow_app/features/devices/view/widgets/curtains/curtain_list.dart'; +import 'package:syncrow_app/features/devices/model/device_model.dart'; import 'package:syncrow_app/features/shared_widgets/default_scaffold.dart'; +import 'package:syncrow_app/generated/assets.dart'; + +part "curtain_buttons.dart"; class CurtainView extends StatelessWidget { - const CurtainView({super.key}); - + const CurtainView({super.key, required this.curtain}); + final DeviceModel curtain; @override Widget build(BuildContext context) { - return BlocBuilder( - builder: (context, state) { - return const DefaultScaffold( - appBar: CategoryViewAppBar(), - child: CurtainList(), - ); - }, + return BlocProvider( + create: (context) => DevicesCubit.getInstance(), + child: BlocBuilder( + builder: (context, state) => DefaultScaffold( + title: curtain.name, + child: Column( + children: [ + Stack( + alignment: Alignment.centerLeft, + children: [ + Container( + height: 340, + width: 365, + decoration: const BoxDecoration( + image: DecorationImage( + image: AssetImage( + Assets.assetsImagesWindow, + ), + ), + ), + ), + Padding( + padding: const EdgeInsets.all(40), + child: AnimatedContainer( + duration: const Duration(milliseconds: 200), + curve: Curves.linear, + height: 310, + width: DevicesCubit.getInstance().curtainWidth, + child: Stack( + children: List.generate( + 10, + (index) { + double spacing = + DevicesCubit.getInstance().curtainWidth / 9; + double leftMostPosition = index * spacing; + return AnimatedPositioned( + duration: const Duration(milliseconds: 200), + curve: Curves.linear, + left: leftMostPosition, + child: SizedBox( + height: 320, + width: 32, + child: SvgPicture.asset( + Assets.assetsIconsCurtainsIconVerticalBlade, + fit: BoxFit.fill, + ), + ), + ); + }, + ), + ), + ), + ), + Positioned( + top: 27, + left: 43, + child: SvgPicture.asset( + Assets.assetsIconsCurtainsIconCurtainHolder)), + ], + ), + const SizedBox(height: 80), + CurtainButtons( + curtain: curtain, + ), + ], + ), + ), + ), ); } } diff --git a/pubspec.yaml b/pubspec.yaml index 6882bba..27c1d9a 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -43,6 +43,11 @@ dev_dependencies: sdk: flutter flutter_lints: ^3.0.1 +flutter_assets: + assets_path: assets/ + output_path: lib/generated2/ + filename: Assets.assetsIconsDart + flutter: uses-material-design: true @@ -61,7 +66,7 @@ flutter: - assets/icons/MenuIcons/LeagalInfoIcons/ - assets/icons/MenuIcons/MessagesCenterIcons/ - assets/icons/MenuIcons/SecurityAndPrivacyIcons/ - + - assets/icons/curtainsIcon/ fonts: - family: Aftika fonts: