SelfPrivacy/selfprivacy.org.app
1
0
Fork 0
mirror of https://git.selfprivacy.org/kherel/selfprivacy.org.app.git synced 2024-11-10 19:03:12 +00:00
Code Issues Projects Releases Wiki Activity

fix(ui): Disk chart had too many horizontal grid lines

Browse source
This commit is contained in:
Inex Code 2024-08-14 08:10:56 +03:00
parent a490f5391b
commit 55d88fe9d4
1 changed files with 118 additions and 126 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

244
lib/ui/pages/server_details/charts/disk_charts.dart
View file

@ -1,5 +1,3 @@
import 'dart:math';
import 'package:easy_localization/easy_localization.dart'; import 'package:easy_localization/easy_localization.dart';
import 'package:fl_chart/fl_chart.dart'; import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
@ -63,149 +61,143 @@ class DiskChart extends StatelessWidget {
} }
@override @override
Widget build(final BuildContext context) { Widget build(final BuildContext context) => Semantics(
final diskDataMax = [ label: screenReaderDescription(context),
...diskData.map<List<double>>( child: LineChart(
(final disk) => disk.diskData.map((final e) => e.value).toList(), LineChartData(
), lineTouchData: LineTouchData(
].expand((final x) => x).reduce(max); enabled: true,
return Semantics( touchTooltipData: LineTouchTooltipData(
label: screenReaderDescription(context), getTooltipColor: (final LineBarSpot _) =>
child: LineChart( Theme.of(context).colorScheme.surface,
LineChartData( tooltipPadding: const EdgeInsets.all(8),
lineTouchData: LineTouchData( getTooltipItems: (final List<LineBarSpot> touchedBarSpots) {
enabled: true, final List<LineTooltipItem> res = [];
touchTooltipData: LineTouchTooltipData(
getTooltipColor: (final LineBarSpot _) =>
Theme.of(context).colorScheme.surface,
tooltipPadding: const EdgeInsets.all(8),
getTooltipItems: (final List<LineBarSpot> touchedBarSpots) {
final List<LineTooltipItem> res = [];
bool timeShown = false; bool timeShown = false;
for (final spot in touchedBarSpots) { for (final spot in touchedBarSpots) {
final value = spot.y; final value = spot.y;
final date = diskData.first.diskData[spot.x.toInt()].time; final date = diskData.first.diskData[spot.x.toInt()].time;
res.add( res.add(
LineTooltipItem( LineTooltipItem(
'${timeShown ? '' : DateFormat('HH:mm dd.MM.yyyy').format(date)} ${diskData[spot.barIndex].volume.displayName} ${value.toInt()}%', '${timeShown ? '' : DateFormat('HH:mm dd.MM.yyyy').format(date)} ${diskData[spot.barIndex].volume.displayName} ${value.toInt()}%',
TextStyle( TextStyle(
color: Theme.of(context).colorScheme.onSurface, color: Theme.of(context).colorScheme.onSurface,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
),
),
);
timeShown = true;
}
return res;
},
),
),
lineBarsData: diskData
.map<LineChartBarData>(
(final disk) => LineChartBarData(
spots: getSpots(disk.diskData),
isCurved: false,
barWidth: 2,
color: disk.color,
dotData: const FlDotData(
show: false,
),
belowBarData: BarAreaData(
show: true,
gradient: LinearGradient(
colors: [
disk.color.withOpacity(0.5),
disk.color.withOpacity(0.0),
],
begin: Alignment.bottomCenter,
end: Alignment.topCenter,
), ),
), ),
);
timeShown = true;
}
return res;
},
),
),
lineBarsData: diskData
.map<LineChartBarData>(
(final disk) => LineChartBarData(
spots: getSpots(disk.diskData),
isCurved: false,
barWidth: 2,
color: disk.color,
dotData: const FlDotData(
show: false,
), ),
belowBarData: BarAreaData( )
show: true, .toList(),
gradient: LinearGradient( minY: 0,
colors: [ maxY: 100,
disk.color.withOpacity(0.5), minX: 0,
disk.color.withOpacity(0.0), titlesData: FlTitlesData(
], topTitles: const AxisTitles(
begin: Alignment.bottomCenter, sideTitles: SideTitles(showTitles: false),
end: Alignment.topCenter, ),
), bottomTitles: AxisTitles(
), sideTitles: SideTitles(
), interval: 40,
) reservedSize: 30,
.toList(), getTitlesWidget: (final value, final titleMeta) => Padding(
minY: 0, padding: const EdgeInsets.all(8.0),
maxY: 100, child: ExcludeSemantics(
minX: 0, child: Text(
titlesData: FlTitlesData( bottomTitle(
topTitles: const AxisTitles( value.toInt(),
sideTitles: SideTitles(showTitles: false), diskData.first.diskData,
), period,
bottomTitles: AxisTitles( ),
sideTitles: SideTitles( style: Theme.of(context).textTheme.labelSmall?.copyWith(
interval: 40, color: Theme.of(context)
reservedSize: 30, .colorScheme
getTitlesWidget: (final value, final titleMeta) => Padding( .onSurfaceVariant,
padding: const EdgeInsets.all(8.0), ),
child: ExcludeSemantics(
child: Text(
bottomTitle(
value.toInt(),
diskData.first.diskData,
period,
), ),
style: Theme.of(context).textTheme.labelSmall?.copyWith(
color:
Theme.of(context).colorScheme.onSurfaceVariant,
),
), ),
), ),
showTitles: true,
),
),
leftTitles: const AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
rightTitles: const AxisTitles(
sideTitles: SideTitles(
showTitles: false,
), ),
showTitles: true,
), ),
), ),
leftTitles: const AxisTitles( gridData: FlGridData(
sideTitles: SideTitles(showTitles: false), show: true,
), drawVerticalLine: true,
rightTitles: const AxisTitles( verticalInterval: 40,
sideTitles: SideTitles( horizontalInterval: 25,
showTitles: false, getDrawingHorizontalLine: (final value) => FlLine(
),
),
),
gridData: FlGridData(
show: true,
drawVerticalLine: true,
verticalInterval: 40,
horizontalInterval: diskDataMax * 2 / 6.5,
getDrawingHorizontalLine: (final value) => FlLine(
color: Theme.of(context).colorScheme.outline.withOpacity(0.3),
strokeWidth: 1,
),
getDrawingVerticalLine: (final value) => FlLine(
color: Theme.of(context).colorScheme.outline.withOpacity(0.3),
strokeWidth: 1,
),
),
borderData: FlBorderData(
show: true,
border: Border(
bottom: BorderSide(
color: Theme.of(context).colorScheme.outline.withOpacity(0.3), color: Theme.of(context).colorScheme.outline.withOpacity(0.3),
width: 1, strokeWidth: 1,
), ),
left: BorderSide( getDrawingVerticalLine: (final value) => FlLine(
color: Theme.of(context).colorScheme.outline.withOpacity(0.3), color: Theme.of(context).colorScheme.outline.withOpacity(0.3),
width: 1, strokeWidth: 1,
), ),
right: BorderSide( ),
color: Theme.of(context).colorScheme.outline.withOpacity(0.3), borderData: FlBorderData(
width: 1, show: true,
), border: Border(
top: BorderSide( bottom: BorderSide(
color: Theme.of(context).colorScheme.outline.withOpacity(0.3), color: Theme.of(context).colorScheme.outline.withOpacity(0.3),
width: 1, width: 1,
),
left: BorderSide(
color: Theme.of(context).colorScheme.outline.withOpacity(0.3),
width: 1,
),
right: BorderSide(
color: Theme.of(context).colorScheme.outline.withOpacity(0.3),
width: 1,
),
top: BorderSide(
color: Theme.of(context).colorScheme.outline.withOpacity(0.3),
width: 1,
),
), ),
), ),
), ),
), ),
), );
);
}
bool checkToShowTitle( bool checkToShowTitle(
final double minValue, final double minValue,