diff options
Diffstat (limited to 'lib/presentation/screens/dashboard/widgets/temperature.dart')
| -rw-r--r-- | lib/presentation/screens/dashboard/widgets/temperature.dart | 143 |
1 files changed, 143 insertions, 0 deletions
diff --git a/lib/presentation/screens/dashboard/widgets/temperature.dart b/lib/presentation/screens/dashboard/widgets/temperature.dart new file mode 100644 index 0000000..0817b53 --- /dev/null +++ b/lib/presentation/screens/dashboard/widgets/temperature.dart @@ -0,0 +1,143 @@ +import '../../../../export.dart'; + +class TemperatureWidget extends ConsumerWidget { + const TemperatureWidget({super.key}); + + @override + Widget build(BuildContext context, WidgetRef ref) { + final temperature = ref.watch(vehicleProvider.select((vehicle) => vehicle)); + // final outsideTemperature = ref + // .watch(vehicleProvider.select((vehicle) => vehicle.outsideTemperature)); + final tempUnit = + ref.watch(unitStateProvider.select((unit) => unit.temperatureUnit)); + + TextStyle temperatureTextStyle = const TextStyle( + fontFamily: 'BrunoAce', + color: Colors.white, + fontSize: 44, + ); + + TextStyle unitTextStyle = const TextStyle( + fontFamily: 'BrunoAce', + color: Color(0xFFC1D8FF), + fontSize: 38, + ); + + return Container( + width: + 442, // needs to be adjusted after the celsius and farenheight symbols are fixed + height: 130, // Height of the oval + //padding: const EdgeInsets.all(10), + decoration: ShapeDecoration( + gradient: const RadialGradient( + colors: [ + Color.fromARGB(255, 19, 24, 75), + Color.fromARGB(127, 0, 0, 0) + ], + stops: [0.0, 0.7], + radius: 1, + ), + //color: Colors.grey, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(65), // Half of the height for an oval effect + side: const BorderSide( + color: Color.fromARGB(156, 0, 0, 0), + width: 2, + ), + ), + ), + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + // Inside temperature + buildTemperatureRow( + context, + Icons.thermostat_outlined, + "Inside", + temperature.insideTemperature, + tempUnit, + temperatureTextStyle, + unitTextStyle, + false, + ), + const SizedBox(width: 10), + // Outside temperature + buildTemperatureRow( + context, + Icons.thermostat_outlined, + "Outside", + temperature.outsideTemperature, + tempUnit, + temperatureTextStyle, + unitTextStyle, + true, + ), + ], + ), + ); + } + + Widget buildTemperatureRow( + BuildContext context, + IconData icon, + String label, + double temperatureValue, + TemperatureUnit tempUnit, + TextStyle tempTextStyle, + TextStyle unitTextStyle, + bool isOutside, + + ) { + int temperatureAsInt = temperatureValue.toInt(); + double convertedTemperature = tempUnit == TemperatureUnit.celsius + ? temperatureAsInt.toDouble() + : (temperatureAsInt * 9 / 5) + 32; + + // Format the temperature for display. + String temperatureDisplay = tempUnit == TemperatureUnit.celsius + ? '$temperatureAsInt' + : '${convertedTemperature.toStringAsFixed(0)}'; + + return Padding( + padding: isOutside + ? const EdgeInsets.only(right: 22) // Padding for the outside temperature + : const EdgeInsets.only(left: 12), // Padding for the inside temperature + child: Row( + mainAxisSize: MainAxisSize.min, + children: [ + Icon( + icon, + color: const Color(0xFF2962FF), + size: 48, + ), + const SizedBox(width: 4), // Space between icon and text + Column( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisSize: MainAxisSize.min, + children: [ + Text( + label, + style: const TextStyle( + color: Color(0xFFC1D8FF), + fontSize: 26, + ), + ), + RichText( + text: TextSpan( + text: temperatureDisplay, + style: tempTextStyle, + children: <TextSpan>[ + TextSpan( + text: tempUnit == TemperatureUnit.celsius ? '°C' : '°F', + style: unitTextStyle, + ), + ], + ), + ), + ], + ), + ], + ), + ); + } +}
\ No newline at end of file |