Skip to content
Snippets Groups Projects
Commit 110f18cc authored by Benoît Harrault's avatar Benoît Harrault
Browse files

Improve charts colors

parent 686b8d10
No related branches found
No related tags found
1 merge request!13Resolve "Improve charts colors"
Pipeline #4467 passed
Stage: update
Stage: build-debug
This commit is part of merge request !13. Comments created here will be created in the context of that merge request.
Hide whitespace changes
Inline Side-by-side
Showing
with 103 additions and 22 deletions
android/gradle.properties
+ 2
− 2
View file @ 110f18cc
org.gradle.jvmargs=-Xmx1536M
android.useAndroidX=true
android.enableJetifier=true
app.versionName=0.0.11
app.versionCode=11
app.versionName=0.0.12
app.versionCode=12
fastlane/metadata/android/en-US/changelogs/12.txt 0 → 100644
+ 1
− 0
View file @ 110f18cc
Improve charts colors.
fastlane/metadata/android/fr-FR/changelogs/12.txt 0 → 100644
+ 1
− 0
View file @ 110f18cc
Amélioration des couleurs des graphiques.
lib/ui/widgets/main_screen/counts_by_day_card.dart
+ 1
− 1
View file @ 110f18cc
......@@ -25,7 +25,7 @@ class ChartCountsByDayCard extends StatelessWidget {
return Card(
elevation: 2,
shadowColor: Theme.of(context).colorScheme.shadow,
color: Theme.of(context).colorScheme.primary,
color: Theme.of(context).colorScheme.surface,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.all(
Radius.circular(12),
......
lib/ui/widgets/main_screen/counts_by_day_chart.dart
+ 22
− 3
View file @ 110f18cc
......@@ -14,7 +14,7 @@ class CountsByDayCardContentChart extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
height: 100.0,
height: 120.0,
child: LayoutBuilder(builder: (context, constraints) {
final double maxWidth = constraints.maxWidth;
final int barsCount = this.chartData.data.keys.length;
......@@ -23,7 +23,7 @@ class CountsByDayCardContentChart extends StatelessWidget {
return BarChart(
BarChartData(
barGroups: getDataCounts(barWidth),
backgroundColor: Theme.of(context).colorScheme.onBackground,
backgroundColor: Theme.of(context).colorScheme.onSurface,
borderData: getBorderData(),
gridData: getGridData(),
titlesData: getTitlesData(),
......@@ -54,6 +54,19 @@ class CountsByDayCardContentChart extends StatelessWidget {
return scale * ((number ~/ scale).toInt() + 1);
}
LinearGradient getGradient(Color baseColor) {
return LinearGradient(
begin: Alignment.topLeft,
end: Alignment(0.8, 1),
colors: <Color>[
baseColor.lighten(30),
baseColor,
baseColor.darken(30),
],
tileMode: TileMode.mirror,
);
}
List<BarChartGroupData> getDataCounts(double barWidth) {
List<BarChartGroupData> data = [];
......@@ -87,16 +100,20 @@ class CountsByDayCardContentChart extends StatelessWidget {
default:
}
final gradient = getGradient(barColor);
final borderColor = barColor.darken(20);
data.add(BarChartGroupData(
x: day,
barRods: [
BarChartRodData(
toY: counts,
color: barColor,
gradient: gradient,
width: barWidth,
borderRadius: BorderRadius.all(Radius.zero),
borderSide: BorderSide(
color: barColor.darken(20),
color: borderColor,
),
),
],
......@@ -120,6 +137,8 @@ class CountsByDayCardContentChart extends StatelessWidget {
FlGridData getGridData() {
return const FlGridData(
show: true,
drawHorizontalLine: true,
drawVerticalLine: false,
);
}
......
lib/ui/widgets/main_screen/counts_by_hour_card.dart
+ 1
− 1
View file @ 110f18cc
......@@ -26,7 +26,7 @@ class ChartCountsByHourCard extends StatelessWidget {
return Card(
elevation: 2,
shadowColor: Theme.of(context).colorScheme.shadow,
color: Theme.of(context).colorScheme.primary,
color: Theme.of(context).colorScheme.surface,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.all(
Radius.circular(12),
......
lib/ui/widgets/main_screen/counts_by_hour_chart.dart
+ 22
− 6
View file @ 110f18cc
......@@ -13,7 +13,7 @@ class CountsByHourCardContentChart extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
height: 100.0,
height: 120.0,
child: LayoutBuilder(builder: (context, constraints) {
final double maxWidth = constraints.maxWidth;
final int barsCount = this.chartData.data.keys.length;
......@@ -22,7 +22,7 @@ class CountsByHourCardContentChart extends StatelessWidget {
return BarChart(
BarChartData(
barGroups: getDataCounts(barWidth),
backgroundColor: Theme.of(context).colorScheme.onBackground,
backgroundColor: Theme.of(context).colorScheme.onSurface,
borderData: getBorderData(),
gridData: getGridData(),
titlesData: getTitlesData(),
......@@ -53,25 +53,41 @@ class CountsByHourCardContentChart extends StatelessWidget {
return scale * ((number ~/ scale).toInt() + 1);
}
LinearGradient getGradient(Color baseColor) {
return LinearGradient(
begin: Alignment.topLeft,
end: Alignment(0.8, 1),
colors: <Color>[
baseColor.lighten(30),
baseColor,
baseColor.darken(30),
],
tileMode: TileMode.mirror,
);
}
List<BarChartGroupData> getDataCounts(double barWidth) {
List<BarChartGroupData> data = [];
final baseColor = AppColors.contentColorCyan.darken(30);
final gradient = getGradient(baseColor);
final borderColor = baseColor.darken(20);
this.chartData.data.keys.forEach((day) {
final double? counts = this.chartData.data[day];
if (counts != null) {
final Color barColor = AppColors.contentColorCyan.darken(30);
data.add(BarChartGroupData(
x: day,
barRods: [
BarChartRodData(
toY: counts,
color: barColor,
color: baseColor,
gradient: gradient,
width: barWidth,
borderRadius: BorderRadius.all(Radius.zero),
borderSide: BorderSide(
color: barColor.darken(20),
color: borderColor,
),
),
],
......
lib/ui/widgets/main_screen/timeline_card.dart
+ 1
− 1
View file @ 110f18cc
......@@ -25,7 +25,7 @@ class ChartTimelineCard extends StatelessWidget {
return Card(
elevation: 2,
shadowColor: Theme.of(context).colorScheme.shadow,
color: Theme.of(context).colorScheme.primary,
color: Theme.of(context).colorScheme.surface,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.all(
Radius.circular(12),
......
lib/ui/widgets/main_screen/timeline_chart_counts.dart
+ 23
− 3
View file @ 110f18cc
......@@ -23,7 +23,7 @@ class ChartTimelineCounts extends StatelessWidget {
return BarChart(
BarChartData(
barGroups: getDataCounts(barWidth),
backgroundColor: Theme.of(context).colorScheme.onBackground,
backgroundColor: Theme.of(context).colorScheme.onSurface,
borderData: getBorderData(),
gridData: getGridData(),
titlesData: getTitlesData(),
......@@ -55,9 +55,26 @@ class ChartTimelineCounts extends StatelessWidget {
return scale * ((number ~/ scale).toInt() + 1);
}
LinearGradient getGradient(Color baseColor) {
return LinearGradient(
begin: Alignment.topLeft,
end: Alignment(0.8, 1),
colors: <Color>[
baseColor.lighten(30),
baseColor,
baseColor.darken(30),
],
tileMode: TileMode.mirror,
);
}
List<BarChartGroupData> getDataCounts(double barWidth) {
List<BarChartGroupData> data = [];
final baseColor = AppColors.contentColorOrange;
final gradient = getGradient(baseColor);
final borderColor = baseColor.darken(20);
this.chartData.data.keys.forEach((key) {
TimelineDataValue? value = this.chartData.data[key];
if (value != null) {
......@@ -69,11 +86,12 @@ class ChartTimelineCounts extends StatelessWidget {
barRods: [
BarChartRodData(
toY: counts,
color: AppColors.contentColorOrange,
color: baseColor,
gradient: gradient,
width: barWidth,
borderRadius: BorderRadius.all(Radius.zero),
borderSide: BorderSide(
color: AppColors.contentColorOrange.darken(20),
color: borderColor,
),
),
],
......@@ -97,6 +115,8 @@ class ChartTimelineCounts extends StatelessWidget {
FlGridData getGridData() {
return const FlGridData(
show: true,
drawHorizontalLine: true,
drawVerticalLine: false,
);
}
......
lib/ui/widgets/main_screen/timeline_chart_eclecticism.dart
+ 28
− 4
View file @ 110f18cc
......@@ -4,6 +4,7 @@ import 'package:fl_chart/fl_chart.dart';
import '../../../config/app_colors.dart';
import '../../../models/timeline.dart';
import '../../../utils/color_extensions.dart';
class ChartTimelineEclecticism extends StatelessWidget {
final TimelineData chartData;
......@@ -13,11 +14,11 @@ class ChartTimelineEclecticism extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
height: 100.0,
height: 120.0,
child: LineChart(
LineChartData(
lineBarsData: getDataEclecticism(),
backgroundColor: Theme.of(context).colorScheme.onBackground,
backgroundColor: Theme.of(context).colorScheme.onSurface,
borderData: getBorderData(),
gridData: getGridData(),
titlesData: getTitlesData(),
......@@ -30,6 +31,19 @@ class ChartTimelineEclecticism extends StatelessWidget {
);
}
LinearGradient getGradient(Color baseColor) {
return LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: <Color>[
baseColor.lighten(30),
baseColor,
baseColor.darken(30),
],
tileMode: TileMode.mirror,
);
}
List<LineChartBarData> getDataEclecticism() {
List<FlSpot> spots = [];
......@@ -43,14 +57,22 @@ class ChartTimelineEclecticism extends StatelessWidget {
}
});
final baseColor = AppColors.contentColorCyan;
final gradient = getGradient(baseColor);
final borderColor = baseColor.darken(20);
return [
LineChartBarData(
isCurved: true,
color: AppColors.contentColorCyan,
color: borderColor,
barWidth: 3,
isStrokeCapRound: false,
dotData: const FlDotData(show: false),
belowBarData: BarAreaData(show: true),
belowBarData: BarAreaData(
show: true,
color: baseColor,
gradient: gradient,
),
spots: spots,
),
];
......@@ -69,6 +91,8 @@ class ChartTimelineEclecticism extends StatelessWidget {
FlGridData getGridData() {
return const FlGridData(
show: true,
drawHorizontalLine: true,
drawVerticalLine: false,
);
}
......
pubspec.yaml
+ 1
− 1
View file @ 110f18cc
......@@ -3,7 +3,7 @@ description: Display scrobbles data and charts
publish_to: 'none'
version: 0.0.11+11
version: 0.0.12+12
environment:
sdk: '^3.0.0'
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment