Skip to content

Commit

Permalink
📱 Added Smart Speaker UI
Browse files Browse the repository at this point in the history
  • Loading branch information
[email protected] authored and [email protected] committed Jan 22, 2022
1 parent 68442da commit e4f29fa
Show file tree
Hide file tree
Showing 7 changed files with 523 additions and 64 deletions.
Binary file added assets/images/stay.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 2 additions & 0 deletions lib/provider/getit.dart
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import 'package:domus/service/navigation_service.dart';
import 'package:domus/view/home_screen_view_model.dart';
import 'package:domus/view/smart_ac_view_model.dart';
import 'package:domus/view/smart_light_view_model.dart';
import 'package:domus/view/smart_speaker_view_model.dart';
import 'package:get_it/get_it.dart';

GetIt getIt = GetIt.instance;
Expand All @@ -10,4 +11,5 @@ void setupLocator() {
getIt.registerFactory(() => HomeScreenViewModel());
getIt.registerFactory(() => SmartLightViewModel());
getIt.registerFactory(() => SmartACViewModel());
getIt.registerFactory(() => SmartSpeakerViewModel());
}
57 changes: 0 additions & 57 deletions lib/src/screens/smart_light/components/body.dart
Original file line number Diff line number Diff line change
Expand Up @@ -99,63 +99,6 @@ class Body extends StatelessWidget {
SizedBox(
height: getProportionateScreenHeight(40),
),
InkWell(
onTap: () {
Navigator.of(context).pop();
},
child: Icon(Icons.arrow_back_outlined)),
Stack(
children: [
Text(
'Living\nRoom',
style: Theme.of(context).textTheme.headline1!.copyWith(
fontSize: 45,
color: Color(0xFFBDBDBD).withOpacity(0.5),
),
),
Text(
'Living\nRoom',
style: Theme.of(context).textTheme.headline1,
),
],
),
SizedBox(
height: getProportionateScreenHeight(26),
),
Text(
'Power',
style: Theme.of(context).textTheme.headline2,
),
SizedBox(
height: getProportionateScreenHeight(4),
),
Switch.adaptive(
inactiveThumbColor: Color(0xFFE4E4E4),
inactiveTrackColor: Colors.white,
activeColor: Colors.white,
activeTrackColor: Color(0xFF464646),
value: model.isLightOff,
onChanged: (value) {
model.lightSwitch(value);
},
),
SizedBox(
height: getProportionateScreenHeight(20),
),
Text(
'Color',
style: Theme.of(context).textTheme.headline2,
),
SizedBox(
height: getProportionateScreenHeight(7),
),
InkWell(
onTap: model.showColorPanel,
child: Image.asset(
'assets/images/color_wheel.png',
height: getProportionateScreenHeight(22),
),
),
],
),
),
Expand Down
293 changes: 290 additions & 3 deletions lib/src/screens/smart_speaker/components/body.dart
Original file line number Diff line number Diff line change
@@ -1,11 +1,298 @@
import 'package:domus/src/screens/smart_speaker/components/connect_speaker.dart';
import 'package:domus/config/size_config.dart';
import 'package:domus/view/smart_speaker_view_model.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:sleek_circular_slider/sleek_circular_slider.dart';

class Body extends StatelessWidget {
const Body({Key? key}) : super(key: key);
final SmartSpeakerViewModel model;
const Body({Key? key, required this.model}) : super(key: key);

@override
Widget build(BuildContext context) {
return Center(child: ConnectSpeaker());
return Container(
padding: EdgeInsets.symmetric(horizontal: 15, vertical: 10),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: EdgeInsets.only(
left: getProportionateScreenWidth(19),
top: getProportionateScreenHeight(5),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: getProportionateScreenHeight(40),
),
InkWell(
onTap: () {
Navigator.of(context).pop();
},
child: Icon(Icons.arrow_back_outlined)),
Stack(
children: [
Text(
'Smart\nSpeaker',
style: Theme.of(context).textTheme.headline1!.copyWith(
fontSize: 45,
color: Color(0xFFBDBDBD).withOpacity(0.5),
),
),
Text(
'Living\nRoom',
style: Theme.of(context).textTheme.headline1,
),
],
),
SizedBox(
height: getProportionateScreenHeight(10),
),
],
),
),
Align(
alignment: Alignment.center,
child: SleekCircularSlider(
min: 5,
max: 40,
initialValue: 23,
appearance: CircularSliderAppearance(
size: 200,
startAngle: 250,
angleRange: 360,
customColors: CustomSliderColors(
trackColor: Color(0xFFBDBDBD),
progressBarColor: Color(0xFF464646),
// hideShadow: true,
shadowColor: Color(0xFFBDBDBD).withOpacity(0.1),
shadowMaxOpacity: 1,
shadowStep: 25,
),
customWidths: CustomSliderWidths(
progressBarWidth: 10,
handlerSize: 10,
trackWidth: 10,
shadowWidth: 10,
),
),
onChange: (double value) {
// callback providing a value while its being changed (with a pan gesture)
},
onChangeStart: (double startValue) {
// callback providing a starting value (when a pan gesture starts)
},
onChangeEnd: (double endValue) {
// ucallback providing an ending value (when a pan gesture ends)
},
innerWidget: (double value) {
return Padding(
padding: const EdgeInsets.all(16.0),
child: ClipRRect(
borderRadius: BorderRadius.circular(100),
child: Image.asset(
'assets/images/stay.jpg',
//height: getProportionateScreenHeight(50),
fit: BoxFit.cover,
),
),
);
},
),
),
SizedBox(
height: getProportionateScreenHeight(20),
),
Align(
alignment: Alignment.center,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
'3:15 | 4:26',
style: Theme.of(context).textTheme.headline3,
),
SizedBox(
height: getProportionateScreenHeight(10),
),
Text(
'STAY',
style: Theme.of(context).textTheme.headline1,
),
Text(
'Justin Bieber Ft. Kid Laroi',
style: Theme.of(context).textTheme.headline4,
),
SizedBox(
height: 15,
),
Divider(
thickness: 2,
),
SizedBox(
height: 10,
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
ElevatedButton(
onPressed: () {},
child: Icon(
Icons.first_page_rounded,
size: 30,
color: Color(0xFF464646),
),
style: ElevatedButton.styleFrom(
elevation: 0.0,
shape: CircleBorder(),
padding: EdgeInsets.all(10),
),
),
ElevatedButton(
onPressed: () {},
child: Icon(
Icons.play_arrow_rounded,
size: 35,
color: Color(0xFFF2F2F2),
),
style: ElevatedButton.styleFrom(
elevation: 0.0,
primary: Color(0xFF464646),
shape: CircleBorder(),
padding: EdgeInsets.all(8),
),
),
ElevatedButton(
onPressed: () {},
child: Icon(
Icons.last_page_rounded,
size: 30,
color: Color(0xFF464646),
),
style: ElevatedButton.styleFrom(
elevation: 0.0,
shape: CircleBorder(),
padding: EdgeInsets.all(10),
),
)
],
),
],
),
),
SizedBox(
height: getProportionateScreenHeight(15),
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
ElevatedButton(
onPressed: () {},
child: Icon(
Icons.playlist_play_rounded,
size: 30,
color: Color(0xFF464646),
),
style: ElevatedButton.styleFrom(
elevation: 0.0,
shape: CircleBorder(),
padding: EdgeInsets.all(10),
),
),
ElevatedButton(
onPressed: () {},
child: Icon(
Icons.shuffle_rounded,
size: 25,
color: Color(0xFF464646),
),
style: ElevatedButton.styleFrom(
elevation: 0.0,
shape: CircleBorder(),
padding: EdgeInsets.all(10),
),
),
ElevatedButton(
onPressed: () {},
child: Icon(
Icons.repeat_rounded,
size: 25,
color: Color(0xFF464646),
),
style: ElevatedButton.styleFrom(
elevation: 0.0,
shape: CircleBorder(),
padding: EdgeInsets.all(10),
),
),
ElevatedButton(
onPressed: () {},
child: Icon(
Icons.equalizer_rounded,
size: 25,
color: Color(0xFF464646),
),
style: ElevatedButton.styleFrom(
elevation: 0.0,
shape: CircleBorder(),
padding: EdgeInsets.all(10),
),
),
ElevatedButton(
onPressed: () {},
child: Icon(
Icons.favorite_rounded,
size: 25,
color: Color(0xFF464646),
),
style: ElevatedButton.styleFrom(
elevation: 0.0,
shape: CircleBorder(),
padding: EdgeInsets.all(10),
),
)
],
),
SizedBox(
height: getProportionateScreenHeight(15),
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Kakao Mini C',
style: Theme.of(context).textTheme.headline2,
),
SizedBox(
height: 5,
),
Text(
'Connected',
style: Theme.of(context).textTheme.headline5,
)
],
),
Switch.adaptive(
inactiveThumbColor: Color(0xFFE4E4E4),
inactiveTrackColor: Colors.white,
activeColor: Colors.white,
activeTrackColor: Color(0xFF464646),
value: model.isSpeakeron,
onChanged: (value) {
model.speakerSwitch(value);
},
),
],
),
SizedBox(
height: getProportionateScreenHeight(9),
),
],
),
);
}
}
Loading

0 comments on commit e4f29fa

Please sign in to comment.