Skip to content
Snippets Groups Projects
Commit ca407ff6 authored by MagicalSpyto's avatar MagicalSpyto
Browse files

Hud und coloränderung fast fertig

parent d4f29893
Branches
No related tags found
No related merge requests found
import 'dart:io';
import 'package:ambient/searchpage.dart';
import 'package:ambient/widgets/MusicPlayerState.dart';
import 'package:ambient/widgets/navbars.dart';
......@@ -33,11 +34,18 @@ class MyApp extends StatelessWidget {
);
}
}
//colorpalete
Color primaryColor = Color(0xFFFFa74a);
Color onPrimary = Color(0xFFFFFFFF);
Color primaryContainer = Color(0xFFFFDFBD);
Color onPrimaryContainer = Color(0xFF312B25);
Color backGroundColor = Color(0x05FFDFBD);
//variablen für den MoodpageGebrauch
late File currentMoodsImage;
bool usesPicture = false;
late Color selectedMood = Moods.sad.color;
bool musicCangable = true;
const Color primaryColor = Color(0xFFFFa74a);
const Color onPrimary = Color(0xFFFFFFFF);
const Color primaryContainer = Color(0xFFFFDFBD);
const Color onPrimaryContainer = Color(0xFF312B25);
class HUD extends StatefulWidget {
const HUD({super.key});
......@@ -83,7 +91,7 @@ class _HUDState extends State<HUD> {
_currentIndex != 0 ? MusicBar() : const Center(child: Text('Moin')),
BottomNavigationBar(
currentIndex: _currentIndex,
backgroundColor: ligten(primaryContainer),
backgroundColor: primaryContainer,
selectedItemColor: primaryColor,
unselectedItemColor: Colors.black,
items: const [
......
import 'dart:ffi';
import 'dart:io';
import 'main.dart';
import 'package:vector_math/vector_math.dart';
import 'package:image_picker/image_picker.dart';
import 'package:flutter/material.dart';
import 'package:palette_generator/palette_generator.dart';
import 'package:flutter_color_models/flutter_color_models.dart';
class StateMoodPage extends StatefulWidget {
const StateMoodPage({super.key});
......@@ -11,7 +14,7 @@ class StateMoodPage extends StatefulWidget {
State<StateMoodPage> createState() => MoodPage();
}
enum Moods { none, happy, sad }
enum Moods { none, happy, sad ,angry, noble, clean, courageous, fresh, compassionn, simple, dramatic}
extension MoodsExtention on Moods {
Color get color {
......@@ -19,15 +22,30 @@ extension MoodsExtention on Moods {
case Moods.none:
return Color.fromARGB(255, 75, 75, 75);
case Moods.happy:
return Color.fromARGB(255, 237, 219, 18);
return Color.fromARGB(255, 255, 255, 0);
case Moods.sad:
return Color.fromARGB(255, 64, 71, 167);
return Color.fromARGB(255, 0, 0, 255);
case Moods.angry:
return Color.fromARGB(255, 255, 0, 0);
case Moods.noble:
return Color.fromARGB(255, 127, 69, 216);
case Moods.clean:
return Color.fromARGB(255, 255, 255, 255);
case Moods.courageous:
return Color.fromARGB(255, 255, 165, 0);
case Moods.fresh:
return Color.fromARGB(255, 0, 255, 0);
case Moods.compassionn:
return Color.fromARGB(255, 255, 70, 253);
case Moods.simple:
return Color.fromARGB(255, 103, 64, 45);
case Moods.dramatic:
return Color.fromARGB(255, 0, 0, 0);
}
}
}
class MoodPage extends State<StateMoodPage> {
late File _image;
final ImagePicker _picker = ImagePicker();
late PaletteGenerator paletteGenerator;
Moods? currentMood = Moods.happy;
......@@ -39,9 +57,11 @@ class MoodPage extends State<StateMoodPage> {
source: ImageSource.gallery,
);
if (pickedFile != null) {
musicCangable = true;
imagePath = pickedFile.path;
setState(() {
_image = File(imagePath);
usesPicture = true;
currentMoodsImage = File(imagePath);
});
}
} catch (e) {
......@@ -50,47 +70,272 @@ class MoodPage extends State<StateMoodPage> {
}
}
_changeMusic(){
//code zum musik ändern
}
_getColorDistance(Color c1, Color c2) {
LabColor labC1 = LabColor.fromColor(c1);
LabColor labC2 = LabColor.fromColor(c2);
double distance = 0;
Vector3 v1 =
Vector3(c1.red.toDouble(), c1.green.toDouble(), c1.blue.toDouble());
Vector3 v2 =
Vector3(c2.red.toDouble(), c2.green.toDouble(), c2.blue.toDouble());
distance = v1.distanceTo(v2).toInt().toDouble();
print("Lightness bild: " + labC1.lightness.toDouble().toString());
print("Lightness referenz: " + labC2.lightness.toDouble().toString());
Vector3 v1 = Vector3(labC1.lightness.toDouble(), labC1.a.toDouble(), labC1.b.toDouble());
Vector3 v2 = Vector3(labC2.lightness.toDouble(), labC2.a.toDouble(), labC2.b.toDouble());
distance = v1.distanceTo(v2).toDouble();
return distance;
}
_determineMoodToMatch(Color col) {
double distance = 1000.0;
double distance = 1000000.0;
Moods newMood = Moods.none;
if(musicCangable){
for (var value in Moods.values) {
double colorDistance = _getColorDistance(col, value.color);
if (colorDistance < distance &&
value != Moods.none) {
distance = colorDistance;
newMood = value;
}
}
_updateColorPalete(col);
selectedMood = newMood.color;
_changeMusic();
musicCangable = false;
return newMood;
}else{
for (var value in Moods.values) {
if (_getColorDistance(col, value.color) < distance &&
double colorDistance = _getColorDistance(selectedMood, value.color);
if (colorDistance < distance &&
value != Moods.none) {
distance = _getColorDistance(col, value.color);
distance = colorDistance;
newMood = value;
}
}
musicCangable = false;
return newMood;
}
}
_updateColorPalete(Color col){
if(!usesPicture){
col = Color.fromARGB(col.alpha - 100, col.red, col.green, col.blue);
//col = darken(col, 0.05);
primaryColor = col;
backGroundColor = Color.fromARGB(col.alpha - 140, col.red, col.green, col.blue);
}else{
backGroundColor = Color.fromARGB(col.alpha - 240, col.red, col.green, col.blue);
}
primaryColor = col;
onPrimary = darken(col, 0.2);
Color shiftedColor = Color.fromARGB(col.alpha - 100, col.red, col.green, col.blue);
primaryContainer = shiftedColor;
onPrimaryContainer = darken(shiftedColor, 0.2);
}
_getMoodList(){
return Column(children: <Widget>[
RadioListTile<Moods>(
title: const Text(
"Sad",
style: TextStyle(
color: Color.fromARGB(255, 0, 0, 0),
),
),
tileColor: backGroundColor,
activeColor: primaryColor,
value: Moods.sad,
groupValue: currentMood,
onChanged: (Moods? value) {
setState(() {
usesPicture = false;
primaryColor = Moods.sad.color;
_updateColorPalete(primaryColor);
currentMood = value;
});
},
),
RadioListTile<Moods>(
title: const Text('Happy'),
title: const Text(
"Angry",
style: TextStyle(
color: Color.fromARGB(255, 0, 0, 0),
),
),
tileColor: backGroundColor,
activeColor: primaryColor,
value: Moods.angry,
groupValue: currentMood,
onChanged: (Moods? value) {
setState(() {
usesPicture = false;
primaryColor = Moods.angry.color;
_updateColorPalete(primaryColor);
currentMood = value;
});
},
),
RadioListTile<Moods>(
title: const Text(
"Noble",
style: TextStyle(
color: Color.fromARGB(255, 0, 0, 0),
),
),
tileColor: backGroundColor,
activeColor: primaryColor,
value: Moods.noble,
groupValue: currentMood,
onChanged: (Moods? value) {
setState(() {
usesPicture = false;
primaryColor = Moods.noble.color;
_updateColorPalete(primaryColor);
currentMood = value;
});
},
),
RadioListTile<Moods>(
title: const Text(
"Clean",
style: TextStyle(
color: Color.fromARGB(255, 0, 0, 0),
),
),
tileColor: backGroundColor,
activeColor: primaryColor,
value: Moods.clean,
groupValue: currentMood,
onChanged: (Moods? value) {
setState(() {
usesPicture = false;
primaryColor = Moods.clean.color;
_updateColorPalete(primaryColor);
currentMood = value;
});
},
),
RadioListTile<Moods>(
title: const Text(
"Happy",
style: TextStyle(
color: Color.fromARGB(255, 0, 0, 0),
),
),
tileColor: backGroundColor,
activeColor: primaryColor,
value: Moods.happy,
groupValue: currentMood,
onChanged: (Moods? value) {
setState(() {
usesPicture = false;
primaryColor = Moods.happy.color;
_updateColorPalete(primaryColor);
currentMood = value;
});
},
),
RadioListTile<Moods>(
title: const Text('Sad'),
value: Moods.sad,
title: const Text(
"Courageous",
style: TextStyle(
color: Color.fromARGB(255, 0, 0, 0),
),
),
tileColor: backGroundColor,
activeColor: primaryColor,
value: Moods.courageous,
groupValue: currentMood,
onChanged: (Moods? value) {
setState(() {
usesPicture = false;
primaryColor = Moods.courageous.color;
_updateColorPalete(primaryColor);
currentMood = value;
});
},
),
RadioListTile<Moods>(
title: const Text(
"Fresh",
style: TextStyle(
color: Color.fromARGB(255, 0, 0, 0),
),
),
tileColor: backGroundColor,
activeColor: primaryColor,
value: Moods.fresh,
groupValue: currentMood,
onChanged: (Moods? value) {
setState(() {
usesPicture = false;
primaryColor = Moods.fresh.color;
_updateColorPalete(primaryColor);
currentMood = value;
});
},
),
RadioListTile<Moods>(
title: const Text(
"Compassionn",
style: TextStyle(
color: Color.fromARGB(255, 0, 0, 0),
),
),
tileColor: backGroundColor,
activeColor: primaryColor,
value: Moods.compassionn,
groupValue: currentMood,
onChanged: (Moods? value) {
setState(() {
usesPicture = false;
primaryColor = Moods.compassionn.color;
_updateColorPalete(primaryColor);
currentMood = value;
});
},
),
RadioListTile<Moods>(
title: const Text(
"Simple",
style: TextStyle(
color: Color.fromARGB(255, 0, 0, 0),
),
),
tileColor: backGroundColor,
activeColor: primaryColor,
value: Moods.simple,
groupValue: currentMood,
onChanged: (Moods? value) {
setState(() {
usesPicture = false;
primaryColor = Moods.simple.color;
_updateColorPalete(primaryColor);
currentMood = value;
});
},
),
RadioListTile<Moods>(
title: const Text(
"Dramatic",
style: TextStyle(
color: Color.fromARGB(255, 0, 0, 0),
),
),
tileColor: backGroundColor,
activeColor: primaryColor,
value: Moods.dramatic,
groupValue: currentMood,
onChanged: (Moods? value) {
setState(() {
usesPicture = false;
primaryColor = Moods.dramatic.color;
_updateColorPalete(primaryColor);
currentMood = value;
});
},
......@@ -102,7 +347,7 @@ class MoodPage extends State<StateMoodPage> {
BoxDecoration deco = new BoxDecoration();
var image;
image = _getImageTodisplay();
if (image != null) {
if (usesPicture) {
deco = BoxDecoration(
image: DecorationImage(
fit: BoxFit.fitWidth,
......@@ -110,21 +355,26 @@ class MoodPage extends State<StateMoodPage> {
),
);
} else {
deco = const BoxDecoration(
color: Color.fromARGB(255, 64, 71, 167),
deco = BoxDecoration(
color: primaryColor,
);
}
return Container(
return GestureDetector(
onDoubleTap: (){
_getFromGallery();
},
child: Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.width * (9.0 / 16.0),
decoration: deco,
),
);
}
_getImageTodisplay() {
var imageToShow;
try {
imageToShow = FileImage(_image);
imageToShow = FileImage(currentMoodsImage);
return imageToShow;
} catch (e) {
return null;
......@@ -149,18 +399,33 @@ class MoodPage extends State<StateMoodPage> {
case ConnectionState.waiting:
return const Center(child: CircularProgressIndicator());
default:
if (snapshot.hasError) {
return const PaletteSquare(
color: Color.fromARGB(255, 173, 188, 236));
if (snapshot.hasError && usesPicture) {
currentMood = _determineMoodToMatch(primaryColor);
return Column(
children: <Widget>[
PaletteSquare( color: primaryColor),
_getMoodList(),
]);
} else if(snapshot.hasError) {
return Column(
children: <Widget>[
PaletteSquare( color: primaryColor),
_getMoodList(),
]);
} else if (usesPicture){
Color? colorToUse = snapshot.data!.vibrantColor?.color;
colorToUse ??= snapshot.data!.dominantColor?.color;
currentMood = _determineMoodToMatch(colorToUse!);
return Column(
children: <Widget>[
PaletteSquare(color: colorToUse),
_getMoodList(),
]);
}else{
currentMood =
_determineMoodToMatch(snapshot.data!.dominantColor!.color);
return Row(children: <Widget>[
PaletteSquare(color: snapshot.data!.mutedColor!.color),
PaletteSquare(color: snapshot.data!.vibrantColor!.color),
PaletteSquare(color: snapshot.data!.dominantColor!.color),
PaletteSquare(color: snapshot.data!.darkMutedColor!.color),
PaletteSquare(color: snapshot.data!.darkVibrantColor!.color),
return Column(
children: <Widget>[
PaletteSquare(color: primaryColor),
_getMoodList(),
]);
}
}
......@@ -171,24 +436,16 @@ class MoodPage extends State<StateMoodPage> {
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: SingleChildScrollView(
child: Column(
children: <Widget>[
_getContainerTodisplay(),
_getCollorIndicator(),
_getMoodList(),
TextButton(
style: ButtonStyle(
foregroundColor: MaterialStateProperty.all(
Theme.of(context).primaryColorLight),
backgroundColor: MaterialStateProperty.all(
Theme.of(context).backgroundColor),
),
onPressed: _getFromGallery,
child: const Text('AddImage'),
),
//_getMoodList(),
],
),
),
),
);
}
}
......@@ -207,9 +464,10 @@ class PaletteSquare extends StatelessWidget {
Widget square = Container(
decoration: BoxDecoration(
color: color, border: Border.all(width: 1.0, color: color)),
width: MediaQuery.of(context).size.width / 5,
width: MediaQuery.of(context).size.width,
height: 40,
);
return square;
}
}
......@@ -10,7 +10,7 @@ class SettingsDrawer extends StatelessWidget {
@override
Widget build(BuildContext context) {
return const Drawer(
return Drawer(
backgroundColor: onPrimary,
width: 200,
child: Center(
......
......@@ -71,6 +71,13 @@ packages:
url: "https://pub.dartlang.org"
source: hosted
version: "1.16.0"
color_models:
dependency: transitive
description:
name: color_models
url: "https://pub.dartlang.org"
source: hosted
version: "1.3.3"
cross_file:
dependency: transitive
description:
......@@ -181,6 +188,13 @@ packages:
description: flutter
source: sdk
version: "0.0.0"
flutter_color_models:
dependency: "direct main"
description:
name: flutter_color_models
url: "https://pub.dartlang.org"
source: hosted
version: "1.3.3+2"
flutter_custom_clippers:
dependency: "direct main"
description:
......@@ -352,6 +366,13 @@ packages:
url: "https://pub.dartlang.org"
source: hosted
version: "1.8.0"
num_utilities:
dependency: transitive
description:
name: num_utilities
url: "https://pub.dartlang.org"
source: hosted
version: "1.0.5"
page_transition:
dependency: "direct main"
description:
......@@ -436,6 +457,13 @@ packages:
url: "https://pub.dartlang.org"
source: hosted
version: "2.1.3"
powers:
dependency: transitive
description:
name: powers
url: "https://pub.dartlang.org"
source: hosted
version: "1.0.0+2"
process:
dependency: transitive
description:
......
......@@ -50,6 +50,7 @@ dependencies:
spotify_sdk: ^2.3.0
flutter_dotenv: ^5.0.2
drop_shadow_image: ^0.9.1
flutter_color_models: ^1.3.3+2
dev_dependencies:
flutter_test:
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment