diff --git a/lib/presentation/atoms/card_atom.dart b/lib/presentation/atoms/card_atom.dart index 5671a49f..c4f7f03d 100644 --- a/lib/presentation/atoms/card_atom.dart +++ b/lib/presentation/atoms/card_atom.dart @@ -9,6 +9,10 @@ class CardAtom extends StatelessWidget { Widget build(BuildContext context) { return Card( margin: EdgeInsets.zero, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(30), + //set border radius more than 50% of height and width to make circle + ), child: child, ); } diff --git a/lib/presentation/atoms/separator_atom.dart b/lib/presentation/atoms/separator_atom.dart index b9866925..9c716862 100644 --- a/lib/presentation/atoms/separator_atom.dart +++ b/lib/presentation/atoms/separator_atom.dart @@ -10,16 +10,13 @@ class SeparatorAtom extends StatelessWidget { Widget build(BuildContext context) { double spacing; switch (variant) { - case SeparatorVariant.extenstionOfElement: - spacing = 2; case SeparatorVariant.reletedElements: - spacing = 5; - case SeparatorVariant.closeWidgets: spacing = 10; + case SeparatorVariant.closeWidgets: case SeparatorVariant.generalSpacing: spacing = AppThemeData.generalSpacing; case SeparatorVariant.farAppart: - spacing = 45; + spacing = 40; } return SizedBox( height: spacing, @@ -29,7 +26,6 @@ class SeparatorAtom extends StatelessWidget { } enum SeparatorVariant { - extenstionOfElement, reletedElements, closeWidgets, generalSpacing, diff --git a/lib/presentation/atoms/switch_atom.dart b/lib/presentation/atoms/switch_atom.dart index f75cd69e..ff531820 100644 --- a/lib/presentation/atoms/switch_atom.dart +++ b/lib/presentation/atoms/switch_atom.dart @@ -1,6 +1,6 @@ import 'package:cbj_integrations_controller/integrations_controller.dart'; +import 'package:cybearjinni/presentation/atoms/atoms.dart'; import 'package:flutter/material.dart'; -import 'package:flutter_switch/flutter_switch.dart'; import 'package:font_awesome_flutter/font_awesome_flutter.dart'; import 'package:material_design_icons_flutter/material_design_icons_flutter.dart'; @@ -10,12 +10,14 @@ class SwitchAtom extends StatefulWidget { required this.onToggle, required this.action, required this.state, + this.color, }); final SwitchVariant variant; final Function(bool) onToggle; final EntityActions action; final EntityStateGRPC state; + final Color? color; // (bool value) @override @@ -31,23 +33,11 @@ class _SwitchAtomState extends State { bool toggleValue = false; - Color getToggleColor() { - if (toggleValue) { - if (widget.state == EntityStateGRPC.ack) { - return const Color(0xFFFFDF5D); - } - } else { - if (widget.state == EntityStateGRPC.ack) { - return Theme.of(context).primaryColorDark; - } - } - return Colors.blueGrey; - } - - void onToggle(bool value) { - widget.onToggle(value); + void onToggle() { + final bool toggleTemp = !toggleValue; + widget.onToggle(toggleTemp); setState(() { - toggleValue = value; + toggleValue = toggleTemp; }); } @@ -57,7 +47,7 @@ class _SwitchAtomState extends State { final ColorScheme colorScheme = themeData.colorScheme; final Size screenSize = MediaQuery.of(context).size; - final double sizeBoxWidth = screenSize.width * 0.25; + final double sizeBoxWidth = screenSize.width * 0.4; IconData activeIcon; IconData inactiveIcon; @@ -79,37 +69,62 @@ class _SwitchAtomState extends State { activeIcon = MdiIcons.airConditioner; inactiveIcon = MdiIcons.airConditioner; } + final Color tempColor = + !toggleValue ? colorScheme.outline : widget.color ?? Colors.yellow; - return SizedBox( - width: sizeBoxWidth + 15, - child: FlutterSwitch( - width: screenSize.width * 0.25, - height: screenSize.height * 0.065, - toggleSize: screenSize.height * 0.065, - value: toggleValue, - borderRadius: 25.0, - padding: 0.0, - activeToggleColor: colorScheme.onPrimary, - inactiveToggleColor: colorScheme.onBackground, - activeSwitchBorder: Border.all( - color: colorScheme.onBackground, + return GestureDetector( + onTap: onToggle, + child: Container( + height: screenSize.height / 2, + width: sizeBoxWidth, + decoration: BoxDecoration( + borderRadius: const BorderRadius.all(Radius.circular(30)), + color: tempColor.withAlpha(150), ), - inactiveSwitchBorder: Border.all( - color: colorScheme.onBackground, + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Icon( + toggleValue ? activeIcon : inactiveIcon, + color: tempColor, + ), + const SeparatorAtom(variant: SeparatorVariant.reletedElements), + TextAtom(toggleValue ? 'On' : 'Off'), + ], ), - activeColor: colorScheme.primary, - inactiveColor: colorScheme.background, - activeIcon: Icon( - activeIcon, - color: colorScheme.primary, - ), - inactiveIcon: Icon( - inactiveIcon, - color: colorScheme.background, - ), - onToggle: onToggle, ), ); + + // return SizedBox( + // width: sizeBoxWidth + 15, + // child: FlutterSwitch( + // width: screenSize.width * 0.25, + // height: screenSize.height * 0.065, + // toggleSize: screenSize.height * 0.065, + // value: toggleValue, + // borderRadius: 25.0, + // padding: 0.0, + // activeToggleColor: colorScheme.onPrimary, + // inactiveToggleColor: colorScheme.surfaceVariant, + // activeSwitchBorder: Border.all( + // color: colorScheme.onBackground, + // ), + // inactiveSwitchBorder: Border.all( + // color: colorScheme.outline, + // ), + // activeColor: colorScheme.secondary, + // inactiveColor: colorScheme.onBackground, + // activeIcon: Icon( + // activeIcon, + // color: colorScheme.secondary, + // ), + // inactiveIcon: Icon( + // inactiveIcon, + // color: colorScheme.onBackground, + // ), + // onToggle: onToggle, + // ), + // ); } } diff --git a/lib/presentation/core/color_schemes.dart b/lib/presentation/core/color_schemes.dart index 6410da10..63db46fc 100644 --- a/lib/presentation/core/color_schemes.dart +++ b/lib/presentation/core/color_schemes.dart @@ -2,68 +2,68 @@ import 'package:flutter/material.dart'; const lightColorScheme = ColorScheme( brightness: Brightness.light, - primary: Color(0xFF8F4280), + primary: Color(0xFF3B54C5), onPrimary: Color(0xFFFFFFFF), - primaryContainer: Color(0xFFFFD7F1), - onPrimaryContainer: Color(0xFF3A0033), - secondary: Color(0xFF894587), + primaryContainer: Color(0xFFDEE1FF), + onPrimaryContainer: Color(0xFF001158), + secondary: Color(0xFF4957AB), onSecondary: Color(0xFFFFFFFF), - secondaryContainer: Color(0xFFFFD6F8), - onSecondaryContainer: Color(0xFF37003A), - tertiary: Color(0xFF8B4483), + secondaryContainer: Color(0xFFDEE0FF), + onSecondaryContainer: Color(0xFF000F5D), + tertiary: Color(0xFF5555A9), onTertiary: Color(0xFFFFFFFF), - tertiaryContainer: Color(0xFFFFD7F4), - onTertiaryContainer: Color(0xFF390036), + tertiaryContainer: Color(0xFFE2DFFF), + onTertiaryContainer: Color(0xFF0D0664), error: Color(0xFFBA1A1A), errorContainer: Color(0xFFFFDAD6), onError: Color(0xFFFFFFFF), onErrorContainer: Color(0xFF410002), - background: Color(0xFFF8FDFF), - onBackground: Color(0xFF001F25), - surface: Color(0xFFF8FDFF), - onSurface: Color(0xFF001F25), - surfaceVariant: Color(0xFFEFDEE6), - onSurfaceVariant: Color(0xFF4F444A), - outline: Color(0xFF80747B), - onInverseSurface: Color(0xFFD6F6FF), - inverseSurface: Color(0xFF00363F), - inversePrimary: Color(0xFFFFACE9), + background: Color(0xFFFAFCFF), + onBackground: Color(0xFF001F2A), + surface: Color(0xFFFAFCFF), + onSurface: Color(0xFF001F2A), + surfaceVariant: Color(0xFFE3E1EC), + onSurfaceVariant: Color(0xFF46464F), + outline: Color(0xFF767680), + onInverseSurface: Color(0xFFE1F4FF), + inverseSurface: Color(0xFF003547), + inversePrimary: Color(0xFFB9C3FF), shadow: Color(0xFF000000), - surfaceTint: Color(0xFF8F4280), - outlineVariant: Color(0xFFD2C2CA), + surfaceTint: Color(0xFF3B54C5), + outlineVariant: Color(0xFFC6C5D0), scrim: Color(0xFF000000), ); const darkColorScheme = ColorScheme( brightness: Brightness.dark, - primary: Color(0xFFFFACE9), - onPrimary: Color(0xFF58104E), - primaryContainer: Color(0xFF732A66), - onPrimaryContainer: Color(0xFFFFD7F1), - secondary: Color(0xFFFCABF6), - onSecondary: Color(0xFF531355), - secondaryContainer: Color(0xFF6E2C6E), - onSecondaryContainer: Color(0xFFFFD6F8), - tertiary: Color(0xFFFFABF0), - onTertiary: Color(0xFF551251), - tertiaryContainer: Color(0xFF702C69), - onTertiaryContainer: Color(0xFFFFD7F4), + primary: Color(0xFFB9C3FF), + onPrimary: Color(0xFF00218C), + primaryContainer: Color(0xFF1E39AC), + onPrimaryContainer: Color(0xFFDEE1FF), + secondary: Color(0xFFBBC3FF), + onSecondary: Color(0xFF17267A), + secondaryContainer: Color(0xFF313F92), + onSecondaryContainer: Color(0xFFDEE0FF), + tertiary: Color(0xFFC1C1FF), + onTertiary: Color(0xFF252477), + tertiaryContainer: Color(0xFF3D3C8F), + onTertiaryContainer: Color(0xFFE2DFFF), error: Color(0xFFFFB4AB), errorContainer: Color(0xFF93000A), onError: Color(0xFF690005), onErrorContainer: Color(0xFFFFDAD6), - background: Color(0xFF001F25), - onBackground: Color(0xFFA6EEFF), - surface: Color(0xFF001F25), - onSurface: Color(0xFFA6EEFF), - surfaceVariant: Color(0xFF4F444A), - onSurfaceVariant: Color(0xFFD2C2CA), - outline: Color(0xFF9B8D94), - onInverseSurface: Color(0xFF001F25), - inverseSurface: Color(0xFFA6EEFF), - inversePrimary: Color(0xFF8F4280), + background: Color(0xFF001F2A), + onBackground: Color(0xFFBFE9FF), + surface: Color(0xFF001F2A), + onSurface: Color(0xFFBFE9FF), + surfaceVariant: Color(0xFF46464F), + onSurfaceVariant: Color(0xFFC6C5D0), + outline: Color(0xFF90909A), + onInverseSurface: Color(0xFF001F2A), + inverseSurface: Color(0xFFBFE9FF), + inversePrimary: Color(0xFF3B54C5), shadow: Color(0xFF000000), - surfaceTint: Color(0xFFFFACE9), - outlineVariant: Color(0xFF4F444A), + surfaceTint: Color(0xFFB9C3FF), + outlineVariant: Color(0xFF46464F), scrim: Color(0xFF000000), ); diff --git a/lib/presentation/molecules/bottom_navigation_bar_molecule.dart b/lib/presentation/molecules/bottom_navigation_bar_molecule.dart index def37ed1..2ba70274 100644 --- a/lib/presentation/molecules/bottom_navigation_bar_molecule.dart +++ b/lib/presentation/molecules/bottom_navigation_bar_molecule.dart @@ -23,10 +23,10 @@ class BottomNavigationBarMolecule extends StatelessWidget { return Column( mainAxisSize: MainAxisSize.min, children: [ - const Align( + Align( alignment: Alignment.bottomLeft, child: Divider( - color: Color(0xFF98A3B9), + color: colorScheme.onBackground, height: 1, thickness: 0.5, ), @@ -34,7 +34,7 @@ class BottomNavigationBarMolecule extends StatelessWidget { BottomNavigationBar( type: BottomNavigationBarType.fixed, showUnselectedLabels: true, - selectedItemColor: colorScheme.primary, + selectedItemColor: colorScheme.tertiary, unselectedItemColor: colorScheme.onSurfaceVariant, backgroundColor: colorScheme.surface, items: bottomNaviList, diff --git a/lib/presentation/molecules/devices/ac_molecule.dart b/lib/presentation/molecules/devices/ac_molecule.dart index 9a2c9268..28c8c6af 100644 --- a/lib/presentation/molecules/devices/ac_molecule.dart +++ b/lib/presentation/molecules/devices/ac_molecule.dart @@ -4,7 +4,6 @@ import 'package:another_flushbar/flushbar_helper.dart'; import 'package:cbj_integrations_controller/integrations_controller.dart'; import 'package:cybearjinni/domain/connections_service.dart'; import 'package:cybearjinni/presentation/atoms/atoms.dart'; -import 'package:cybearjinni/presentation/molecules/molecules.dart'; import 'package:easy_localization/easy_localization.dart'; import 'package:flutter/material.dart'; @@ -60,14 +59,18 @@ class _AcMoleculeState extends State { @override Widget build(BuildContext context) { - return DeviceNameRowMolecule( - widget.entity.cbjEntityName.getOrCrash()!, - SwitchAtom( - variant: SwitchVariant.ac, - onToggle: _onChange, - action: widget.entity.acSwitchState.action!, - state: widget.entity.entityStateGRPC.state, - ), + return Column( + children: [ + TextAtom( + widget.entity.cbjEntityName.getOrCrash()!, + ), + SwitchAtom( + variant: SwitchVariant.ac, + onToggle: _onChange, + action: widget.entity.acSwitchState.action!, + state: widget.entity.entityStateGRPC.state, + ), + ], ); } } diff --git a/lib/presentation/molecules/devices/boiler_molecule.dart b/lib/presentation/molecules/devices/boiler_molecule.dart index ecb3d8dc..54978783 100644 --- a/lib/presentation/molecules/devices/boiler_molecule.dart +++ b/lib/presentation/molecules/devices/boiler_molecule.dart @@ -4,7 +4,6 @@ import 'package:another_flushbar/flushbar_helper.dart'; import 'package:cbj_integrations_controller/integrations_controller.dart'; import 'package:cybearjinni/domain/connections_service.dart'; import 'package:cybearjinni/presentation/atoms/atoms.dart'; -import 'package:cybearjinni/presentation/molecules/molecules.dart'; import 'package:easy_localization/easy_localization.dart'; import 'package:flutter/material.dart'; @@ -60,14 +59,18 @@ class _BoilerMoleculeState extends State { @override Widget build(BuildContext context) { - return DeviceNameRowMolecule( - widget.entity.cbjEntityName.getOrCrash()!, - SwitchAtom( - variant: SwitchVariant.boiler, - onToggle: _onChange, - action: widget.entity.boilerSwitchState.action, - state: widget.entity.entityStateGRPC.state, - ), + return Column( + children: [ + TextAtom( + widget.entity.cbjEntityName.getOrCrash()!, + ), + SwitchAtom( + variant: SwitchVariant.boiler, + onToggle: _onChange, + action: widget.entity.boilerSwitchState.action, + state: widget.entity.entityStateGRPC.state, + ), + ], ); } } diff --git a/lib/presentation/molecules/devices/dimmable_light_molecule.dart b/lib/presentation/molecules/devices/dimmable_light_molecule.dart index 14ff1ad9..a19c0691 100644 --- a/lib/presentation/molecules/devices/dimmable_light_molecule.dart +++ b/lib/presentation/molecules/devices/dimmable_light_molecule.dart @@ -3,7 +3,6 @@ import 'dart:collection'; import 'package:cbj_integrations_controller/integrations_controller.dart'; import 'package:cybearjinni/domain/connections_service.dart'; import 'package:cybearjinni/presentation/atoms/atoms.dart'; -import 'package:cybearjinni/presentation/molecules/molecules.dart'; import 'package:flutter/material.dart'; import 'package:font_awesome_flutter/font_awesome_flutter.dart'; @@ -93,14 +92,14 @@ class _DimmableLightMoleculeState extends State { return Column( children: [ - DeviceNameRowMolecule( + TextAtom( widget.entity.cbjEntityName.getOrCrash()!, - SwitchAtom( - variant: SwitchVariant.light, - action: widget.entity.lightSwitchState.action, - state: widget.entity.entityStateGRPC.state, - onToggle: _onChange, - ), + ), + SwitchAtom( + variant: SwitchVariant.light, + action: widget.entity.lightSwitchState.action, + state: widget.entity.entityStateGRPC.state, + onToggle: _onChange, ), const SizedBox( height: 3, diff --git a/lib/presentation/molecules/devices/light_molecule.dart b/lib/presentation/molecules/devices/light_molecule.dart index d5d75c03..e7ebf882 100644 --- a/lib/presentation/molecules/devices/light_molecule.dart +++ b/lib/presentation/molecules/devices/light_molecule.dart @@ -3,7 +3,6 @@ import 'dart:collection'; import 'package:cbj_integrations_controller/integrations_controller.dart'; import 'package:cybearjinni/domain/connections_service.dart'; import 'package:cybearjinni/presentation/atoms/atoms.dart'; -import 'package:cybearjinni/presentation/molecules/molecules.dart'; import 'package:flutter/material.dart'; /// Show light toggles in a container with the background color from smart area @@ -32,14 +31,11 @@ class LightMolecule extends StatelessWidget { @override Widget build(BuildContext context) { - return DeviceNameRowMolecule( - entity.cbjEntityName.getOrCrash()!, - SwitchAtom( - variant: SwitchVariant.light, - onToggle: _onChange, - action: entity.lightSwitchState.action, - state: entity.entityStateGRPC.state, - ), + return SwitchAtom( + variant: SwitchVariant.light, + onToggle: _onChange, + action: entity.lightSwitchState.action, + state: entity.entityStateGRPC.state, ); } } diff --git a/lib/presentation/molecules/devices/rgb_light_molecule.dart b/lib/presentation/molecules/devices/rgb_light_molecule.dart index 2eae827e..5a9cec31 100644 --- a/lib/presentation/molecules/devices/rgb_light_molecule.dart +++ b/lib/presentation/molecules/devices/rgb_light_molecule.dart @@ -3,7 +3,6 @@ import 'dart:collection'; import 'package:cbj_integrations_controller/integrations_controller.dart'; import 'package:cybearjinni/domain/connections_service.dart'; import 'package:cybearjinni/presentation/atoms/atoms.dart'; -import 'package:cybearjinni/presentation/molecules/molecules.dart'; import 'package:flutter/material.dart'; import 'package:flutter_colorpicker/flutter_colorpicker.dart'; import 'package:font_awesome_flutter/font_awesome_flutter.dart'; @@ -97,14 +96,11 @@ class _RgbwLightMoleculeState extends State { return Column( children: [ - DeviceNameRowMolecule( - widget.entity.cbjEntityName.getOrCrash()!, - SwitchAtom( - variant: SwitchVariant.light, - onToggle: _onChange, - action: widget.entity.lightSwitchState.action, - state: widget.entity.entityStateGRPC.state, - ), + SwitchAtom( + variant: SwitchVariant.light, + onToggle: _onChange, + action: widget.entity.lightSwitchState.action, + state: widget.entity.entityStateGRPC.state, ), const SeparatorAtom(variant: SeparatorVariant.reletedElements), LightColorMods(entity: widget.entity), @@ -303,28 +299,38 @@ class _LightColorMods extends State { mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [ OutlinedButton( + onPressed: () => setColorModeState(ColorMode.white), + style: OutlinedButton.styleFrom( + backgroundColor: (colorMode == ColorMode.white) + ? colorScheme.secondary + : colorScheme.background, + ), child: TextAtom( 'White', style: TextStyle( color: (colorMode == ColorMode.white) - ? colorScheme.primary + ? colorScheme.onSecondary : colorScheme.onBackground, fontSize: 18, ), ), - onPressed: () => setColorModeState(ColorMode.white), ), OutlinedButton( + onPressed: () => setColorModeState(ColorMode.rgb), + style: OutlinedButton.styleFrom( + backgroundColor: (colorMode == ColorMode.rgb) + ? colorScheme.secondary + : colorScheme.background, + ), child: TextAtom( 'Color', style: TextStyle( color: (colorMode == ColorMode.rgb) - ? colorScheme.primary + ? colorScheme.onSecondary : colorScheme.onBackground, fontSize: 18, ), ), - onPressed: () => setColorModeState(ColorMode.rgb), ), ], ), diff --git a/lib/presentation/molecules/devices/smart_plug_molecule.dart b/lib/presentation/molecules/devices/smart_plug_molecule.dart index edc4b976..b8715630 100644 --- a/lib/presentation/molecules/devices/smart_plug_molecule.dart +++ b/lib/presentation/molecules/devices/smart_plug_molecule.dart @@ -4,7 +4,6 @@ import 'dart:collection'; import 'package:cbj_integrations_controller/integrations_controller.dart'; import 'package:cybearjinni/domain/connections_service.dart'; import 'package:cybearjinni/presentation/atoms/atoms.dart'; -import 'package:cybearjinni/presentation/molecules/molecules.dart'; import 'package:flutter/material.dart'; /// Show smartPlug toggles in a container with the background color from smart area @@ -42,14 +41,18 @@ class _SmartPlugsMoleculeState extends State { @override Widget build(BuildContext context) { - return DeviceNameRowMolecule( - widget.entity.cbjEntityName.getOrCrash()!, - SwitchAtom( - variant: SwitchVariant.smartPlug, - onToggle: _changeAction, - action: widget.entity.smartPlugState.action, - state: widget.entity.entityStateGRPC.state, - ), + return Column( + children: [ + TextAtom( + widget.entity.cbjEntityName.getOrCrash()!, + ), + SwitchAtom( + variant: SwitchVariant.smartPlug, + onToggle: _changeAction, + action: widget.entity.smartPlugState.action, + state: widget.entity.entityStateGRPC.state, + ), + ], ); } } diff --git a/lib/presentation/molecules/devices/switch_molecule.dart b/lib/presentation/molecules/devices/switch_molecule.dart index 5eeea1f3..bd139bc5 100644 --- a/lib/presentation/molecules/devices/switch_molecule.dart +++ b/lib/presentation/molecules/devices/switch_molecule.dart @@ -4,7 +4,6 @@ import 'dart:collection'; import 'package:cbj_integrations_controller/integrations_controller.dart'; import 'package:cybearjinni/domain/connections_service.dart'; import 'package:cybearjinni/presentation/atoms/atoms.dart'; -import 'package:cybearjinni/presentation/molecules/molecules.dart'; import 'package:flutter/material.dart'; /// Show switch toggles in a container with the background color from smart area @@ -42,14 +41,18 @@ class _SwitchMoleculeState extends State { @override Widget build(BuildContext context) { - return DeviceNameRowMolecule( - widget.entity.cbjEntityName.getOrCrash()!, - SwitchAtom( - variant: SwitchVariant.switchVariant, - onToggle: _changeAction, - action: widget.entity.switchState.action, - state: widget.entity.entityStateGRPC.state, - ), + return Column( + children: [ + TextAtom( + widget.entity.cbjEntityName.getOrCrash()!, + ), + SwitchAtom( + variant: SwitchVariant.switchVariant, + onToggle: _changeAction, + action: widget.entity.switchState.action, + state: widget.entity.entityStateGRPC.state, + ), + ], ); } } diff --git a/lib/presentation/molecules/list_tile_molecule.dart b/lib/presentation/molecules/list_tile_molecule.dart index deac5878..529e9faf 100644 --- a/lib/presentation/molecules/list_tile_molecule.dart +++ b/lib/presentation/molecules/list_tile_molecule.dart @@ -6,13 +6,11 @@ class ListTileAtom extends StatelessWidget { this.headline, this.supportingText, this.leadingIcon, - this.onTap, }); final String? headline; final String? supportingText; final IconData? leadingIcon; - final VoidCallback? onTap; @override Widget build(BuildContext context) { @@ -20,7 +18,6 @@ class ListTileAtom extends StatelessWidget { title: headline != null ? TextAtom(headline!) : null, subtitle: supportingText != null ? TextAtom(supportingText!) : null, leading: leadingIcon != null ? IconAtom(leadingIcon!) : null, - onTap: onTap, ); } } diff --git a/lib/presentation/organisms/devices_list_view.dart b/lib/presentation/organisms/devices_list_view.dart deleted file mode 100644 index 600f4891..00000000 --- a/lib/presentation/organisms/devices_list_view.dart +++ /dev/null @@ -1,87 +0,0 @@ -import 'dart:collection'; - -import 'package:cbj_integrations_controller/integrations_controller.dart'; -import 'package:cybearjinni/presentation/atoms/atoms.dart'; -import 'package:cybearjinni/presentation/core/entities_utils.dart'; -import 'package:cybearjinni/presentation/molecules/molecules.dart'; -import 'package:flutter/material.dart'; - -class DevicesListView extends StatelessWidget { - const DevicesListView(this.entities, this.onTap); - - final HashSet entities; - final Function(HashSet) onTap; - - HashSet getReleatedTypes(EntityTypes type) { - if (type == EntityTypes.light || - type == EntityTypes.rgbwLights || - type == EntityTypes.dimmableLight) { - return HashSet.from({ - EntityTypes.light, - EntityTypes.rgbwLights, - EntityTypes.dimmableLight, - }); - } - - return HashSet.from({type}); - } - - HashMap> geEntitiesByType() { - final HashMap> entitiesByType = - HashMap(); - - for (final DeviceEntityBase entity in entities) { - final EntityTypes type = getReleatedTypes(entity.entityTypes.type).first; - HashSet? entitiesForType = entitiesByType[type]; - entitiesForType ??= HashSet(); - entitiesForType.add(entity); - entitiesByType[type] = entitiesForType; - } - - return entitiesByType; - } - - @override - Widget build(BuildContext context) { - final HashMap> entitiesByType = - geEntitiesByType(); - - return ListViewMolecule( - ListViewVeriant.separated, - shrinkWrap: true, - itemBuilder: (context, index) { - final EntityTypes type = entitiesByType.keys.elementAt(index); - final HashSet? entitiesForType = entitiesByType[type]; - - if (entitiesForType == null) { - return const SizedBox(); - } - final int numberOfType = entitiesForType.length; - final DeviceEntityBase firstEntityOfType = entitiesForType.first; - - String? headline; - String? supportingText; - - if (numberOfType == 1) { - headline = firstEntityOfType.cbjEntityName.getOrCrash(); - supportingText = firstEntityOfType.entityStateGRPC.state.name; - } else { - headline = '$numberOfType ${type.name}s'; - supportingText = ''; - } - - return CardAtom( - ListTileAtom( - headline: headline, - supportingText: supportingText, - leadingIcon: EntitiesUtils.iconOfDeviceType(type), - onTap: () { - onTap(getReleatedTypes(type)); - }, - ), - ); - }, - itemCount: entitiesByType.length, - ); - } -} diff --git a/lib/presentation/organisms/devices_list_view_organism.dart b/lib/presentation/organisms/devices_list_view_organism.dart new file mode 100644 index 00000000..8a09e4f6 --- /dev/null +++ b/lib/presentation/organisms/devices_list_view_organism.dart @@ -0,0 +1,134 @@ +import 'dart:collection'; + +import 'package:cbj_integrations_controller/integrations_controller.dart'; +import 'package:cybearjinni/presentation/atoms/atoms.dart'; +import 'package:cybearjinni/presentation/core/entities_utils.dart'; +import 'package:cybearjinni/presentation/core/theme_data.dart'; +import 'package:cybearjinni/presentation/molecules/molecules.dart'; +import 'package:flutter/material.dart'; + +class DevicesListViewOrganism extends StatelessWidget { + const DevicesListViewOrganism( + this.entities, + this.onTap, { + this.varient = DevicesListViewOrganismVarient.list, + this.foldByType = true, + }); + + final HashSet entities; + final Function(HashSet) onTap; + final DevicesListViewOrganismVarient varient; + final bool foldByType; + + HashSet getReleatedTypes(EntityTypes type) { + if (type == EntityTypes.light || + type == EntityTypes.rgbwLights || + type == EntityTypes.dimmableLight) { + return HashSet.from({ + EntityTypes.light, + EntityTypes.rgbwLights, + EntityTypes.dimmableLight, + }); + } + + return HashSet.from({type}); + } + + HashMap> geEntitiesByType() { + final HashMap> entitiesByType = + HashMap(); + + for (final DeviceEntityBase entity in entities) { + final EntityTypes type = getReleatedTypes(entity.entityTypes.type).first; + HashSet? entitiesForType = entitiesByType[type]; + entitiesForType ??= HashSet(); + entitiesForType.add(entity); + entitiesByType[type] = entitiesForType; + } + + return entitiesByType; + } + + Widget cardWidget( + EntityTypes type, + HashSet? entitiesForType, + ) { + if (entitiesForType == null) { + return const SizedBox(); + } + final int numberOfType = entitiesForType.length; + final DeviceEntityBase firstEntityOfType = entitiesForType.first; + + String? headline; + String? supportingText; + + if (numberOfType == 1) { + headline = firstEntityOfType.cbjEntityName.getOrCrash(); + supportingText = firstEntityOfType.entityStateGRPC.state.name; + } else { + headline = '$numberOfType ${type.name}s'; + supportingText = firstEntityOfType.entityStateGRPC.state.name; + } + + return GestureDetector( + child: CardAtom( + Padding( + padding: const EdgeInsets.all(15), + child: ListTileAtom( + headline: headline, + supportingText: supportingText, + leadingIcon: EntitiesUtils.iconOfDeviceType(type), + ), + ), + ), + onTap: () => onTap(getReleatedTypes(type)), + ); + } + + @override + Widget build(BuildContext context) { + final HashMap> entitiesByType = + geEntitiesByType(); + + switch (varient) { + case DevicesListViewOrganismVarient.list: + return ListViewMolecule( + ListViewVeriant.separated, + shrinkWrap: true, + itemBuilder: (context, index) { + final EntityTypes type = entitiesByType.keys.elementAt(index); + final HashSet? entitiesForType = + entitiesByType[type]; + + return cardWidget(type, entitiesForType); + }, + itemCount: entitiesByType.length, + ); + case DevicesListViewOrganismVarient.grid: + return GridView.builder( + shrinkWrap: true, + itemCount: entitiesByType.length, + gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount( + crossAxisCount: 2, + crossAxisSpacing: 8, + mainAxisSpacing: 4, + childAspectRatio: 1.5, + ), + padding: const EdgeInsets.all(AppThemeData.generalSpacing), + itemBuilder: (context, index) { + final EntityTypes type = entitiesByType.keys.elementAt(index); + final HashSet? entitiesForType = + entitiesByType[type]; + + return cardWidget(type, entitiesForType); + }, + ); + } + } +} + +enum DevicesListViewOrganismVarient { + list, + grid, + ; +} diff --git a/lib/presentation/organisms/open_area_organism.dart b/lib/presentation/organisms/open_area_organism.dart index cc3a0919..336000de 100644 --- a/lib/presentation/organisms/open_area_organism.dart +++ b/lib/presentation/organisms/open_area_organism.dart @@ -1,18 +1,22 @@ +import 'dart:collection'; + +import 'package:auto_route/auto_route.dart'; import 'package:cbj_integrations_controller/integrations_controller.dart'; import 'package:cybearjinni/presentation/atoms/atoms.dart'; +import 'package:cybearjinni/presentation/core/routes/app_router.gr.dart'; import 'package:cybearjinni/presentation/molecules/molecules.dart'; import 'package:cybearjinni/presentation/organisms/organisms.dart'; import 'package:flutter/material.dart'; class OpenAreaOrganism extends StatefulWidget { const OpenAreaOrganism({ - required this.areaEntity, + required this.area, required this.entityTypes, required this.entities, }); /// If it have value will only show Printers in this area - final AreaEntity areaEntity; + final AreaEntity area; final Set entityTypes; final Set entities; @@ -27,19 +31,39 @@ class _OpenAreaOrganismState extends State { return EmptyOpenAreaOrganism(); } - return Container( - margin: const EdgeInsets.symmetric(horizontal: 5, vertical: 15), - child: ListView.separated( - reverse: true, - padding: EdgeInsets.zero, - itemBuilder: (context, index) { - final DeviceEntityBase device = widget.entities.elementAt(index); + final ThemeData themeData = Theme.of(context); + final ColorScheme colorScheme = themeData.colorScheme; - return DeviceByTypeMolecule(device); - }, - itemCount: widget.entities.length, - separatorBuilder: (BuildContext context, int index) => - const SeparatorAtom(variant: SeparatorVariant.farAppart), + return SingleChildScrollView( + child: Column( + mainAxisAlignment: MainAxisAlignment.end, + children: [ + ColoredBox( + color: colorScheme.onPrimary, + child: ExpansionTile( + backgroundColor: colorScheme.background, + title: Text( + '${widget.entities.length} ${widget.entities.first.entityTypes.type.name}', + ), + children: [ + DevicesListViewOrganism( + HashSet.from(widget.entities), + (entity) { + context.router.push( + EntitiesInAreaRoute( + entityTypes: entity, + areaEntity: widget.area, + ), + ); + }, + varient: DevicesListViewOrganismVarient.grid, + ), + ], + ), + ), + const SeparatorAtom(), + DeviceByTypeMolecule(widget.entities.first), + ], ), ); } diff --git a/lib/presentation/organisms/organisms.dart b/lib/presentation/organisms/organisms.dart index 7c48f135..8d7b8cda 100644 --- a/lib/presentation/organisms/organisms.dart +++ b/lib/presentation/organisms/organisms.dart @@ -1,4 +1,4 @@ -export 'devices_list_view.dart'; +export 'devices_list_view_organism.dart'; export 'empty_open_area_organism.dart'; export 'open_area_organism.dart'; export 'page_organism.dart'; diff --git a/lib/presentation/pages/entities_in_area_page.dart b/lib/presentation/pages/entities_in_area_page.dart index a101c8c3..ddb297c5 100644 --- a/lib/presentation/pages/entities_in_area_page.dart +++ b/lib/presentation/pages/entities_in_area_page.dart @@ -72,10 +72,17 @@ class _EntitiesInAreaPageState extends State { return PageOrganism( pageName: pageName, child: entities != null - ? OpenAreaOrganism( - areaEntity: widget.areaEntity, - entityTypes: widget.entityTypes, - entities: entities!, + ? Column( + children: [ + Expanded( + child: OpenAreaOrganism( + area: widget.areaEntity, + entityTypes: widget.entityTypes, + entities: entities!, + ), + ), + const SizedBox(height: 50), + ], ) : const CircularProgressIndicatorAtom(), ); diff --git a/lib/presentation/pages/home_page/home_page.dart b/lib/presentation/pages/home_page/home_page.dart index efbca16e..2fdca438 100644 --- a/lib/presentation/pages/home_page/home_page.dart +++ b/lib/presentation/pages/home_page/home_page.dart @@ -185,6 +185,9 @@ class _HomePageState extends State { ); } + final ThemeData themeData = Theme.of(context); + final ColorScheme colorScheme = themeData.colorScheme; + return Scaffold( body: Stack( children: [ @@ -229,10 +232,10 @@ class _HomePageState extends State { initializedScenes(); }, child: CircleAvatar( - backgroundColor: Colors.blue.withOpacity(0.9), - child: const FaIcon( + backgroundColor: colorScheme.tertiaryContainer, + child: FaIcon( FontAwesomeIcons.plus, - color: Colors.white, + color: colorScheme.onTertiaryContainer, ), ), ), diff --git a/lib/presentation/pages/home_page/tabs/scenes_in_folders_tab.dart b/lib/presentation/pages/home_page/tabs/scenes_in_folders_tab.dart index 8f55ca37..c4db6287 100644 --- a/lib/presentation/pages/home_page/tabs/scenes_in_folders_tab.dart +++ b/lib/presentation/pages/home_page/tabs/scenes_in_folders_tab.dart @@ -18,6 +18,9 @@ class ScenesInFoldersTab extends StatelessWidget { BuildContext context, AreaEntity folderOfScenes, ) { + final ThemeData themeData = Theme.of(context); + final ColorScheme colorScheme = themeData.colorScheme; + const double borderRadius = 5; return Container( decoration: BoxDecoration( @@ -56,7 +59,7 @@ class ScenesInFoldersTab extends StatelessWidget { Container( width: double.infinity, decoration: BoxDecoration( - color: Colors.black.withOpacity(0.7), + color: colorScheme.primaryContainer.withOpacity(0.7), borderRadius: const BorderRadius.only( bottomRight: Radius.circular(borderRadius), bottomLeft: Radius.circular(borderRadius), @@ -65,7 +68,7 @@ class ScenesInFoldersTab extends StatelessWidget { child: TextAtom( folderOfScenes.cbjEntityName.getOrCrash(), style: TextStyle( - color: Theme.of(context).textTheme.bodyLarge!.color, + color: colorScheme.onPrimaryContainer, fontSize: 30, ), textAlign: TextAlign.center, diff --git a/lib/presentation/pages/home_page/tabs/smart_devices_tab/areas_widgets/area_widget.dart b/lib/presentation/pages/home_page/tabs/smart_devices_tab/areas_widgets/area_widget.dart index 88f9e1e3..f03b911c 100644 --- a/lib/presentation/pages/home_page/tabs/smart_devices_tab/areas_widgets/area_widget.dart +++ b/lib/presentation/pages/home_page/tabs/smart_devices_tab/areas_widgets/area_widget.dart @@ -64,14 +64,15 @@ class _AreaWidgetState extends State { numberOfDevicesInTheArea >= 2 ? numberOfDevicesInTheArea.toString() : '', - style: textTheme.bodyLarge, + style: textTheme.bodyLarge! + .copyWith(color: colorScheme.secondary), ), ], ), ), ), - const SeparatorAtom(variant: SeparatorVariant.extenstionOfElement), - DevicesListView( + const SeparatorAtom(variant: SeparatorVariant.closeWidgets), + DevicesListViewOrganism( HashSet.from(widget.entities.values), (entity) { context.router.push( diff --git a/lib/presentation/pages/home_page/tabs/smart_devices_tab/entities_by_area_tab.dart b/lib/presentation/pages/home_page/tabs/smart_devices_tab/entities_by_area_tab.dart index 557509dc..318efca6 100644 --- a/lib/presentation/pages/home_page/tabs/smart_devices_tab/entities_by_area_tab.dart +++ b/lib/presentation/pages/home_page/tabs/smart_devices_tab/entities_by_area_tab.dart @@ -20,7 +20,6 @@ class EntitiesByAreaTab extends StatelessWidget { Widget build(BuildContext context) { final ThemeData themeData = Theme.of(context); final TextTheme textTheme = themeData.textTheme; - final ColorScheme colorScheme = themeData.colorScheme; return Column( children: [ @@ -36,8 +35,7 @@ class EntitiesByAreaTab extends StatelessWidget { children: [ TextAtom( 'Areas', - style: textTheme.headlineLarge! - .copyWith(color: colorScheme.primary), + style: textTheme.headlineLarge, ), const SeparatorAtom(variant: SeparatorVariant.farAppart), MarginedExpandedAtom(