made the first element of the bar rods to have only a top sides radius to match the design.

This commit is contained in:
Faris Armoush
2025-06-01 12:45:41 +03:00
parent ca1feb9600
commit 44c4648941
2 changed files with 54 additions and 16 deletions

View File

@ -35,6 +35,7 @@ class AqiDistributionChart extends StatelessWidget {
final data = chartData[index]; final data = chartData[index];
final stackItems = <BarChartRodData>[]; final stackItems = <BarChartRodData>[];
double currentY = 0; double currentY = 0;
bool isFirstElement = true;
if (data.good != null) { if (data.good != null) {
stackItems.add( stackItems.add(
@ -42,11 +43,18 @@ class AqiDistributionChart extends StatelessWidget {
fromY: currentY, fromY: currentY,
toY: currentY + data.good!, toY: currentY + data.good!,
color: AirQualityDataModel.metricColors['good']!, color: AirQualityDataModel.metricColors['good']!,
borderRadius: _barBorderRadius, borderRadius: isFirstElement
? const BorderRadius.only(
topLeft: Radius.circular(22),
topRight: Radius.circular(22),
)
// ignore: dead_code
: _barBorderRadius,
width: _barWidth, width: _barWidth,
), ),
); );
currentY += data.good! + _rodStackItemsSpacing; currentY += data.good! + _rodStackItemsSpacing;
isFirstElement = false;
} }
if (data.moderate != null) { if (data.moderate != null) {
@ -55,11 +63,17 @@ class AqiDistributionChart extends StatelessWidget {
fromY: currentY, fromY: currentY,
toY: currentY + data.moderate!, toY: currentY + data.moderate!,
color: AirQualityDataModel.metricColors['moderate']!, color: AirQualityDataModel.metricColors['moderate']!,
borderRadius: _barBorderRadius, borderRadius: isFirstElement
? const BorderRadius.only(
topLeft: Radius.circular(22),
topRight: Radius.circular(22),
)
: _barBorderRadius,
width: _barWidth, width: _barWidth,
), ),
); );
currentY += data.moderate! + _rodStackItemsSpacing; currentY += data.moderate! + _rodStackItemsSpacing;
isFirstElement = false;
} }
if (data.poor != null) { if (data.poor != null) {
@ -68,11 +82,17 @@ class AqiDistributionChart extends StatelessWidget {
fromY: currentY, fromY: currentY,
toY: currentY + data.poor!, toY: currentY + data.poor!,
color: AirQualityDataModel.metricColors['poor']!, color: AirQualityDataModel.metricColors['poor']!,
borderRadius: _barBorderRadius, borderRadius: isFirstElement
? const BorderRadius.only(
topLeft: Radius.circular(22),
topRight: Radius.circular(22),
)
: _barBorderRadius,
width: _barWidth, width: _barWidth,
), ),
); );
currentY += data.poor! + _rodStackItemsSpacing; currentY += data.poor! + _rodStackItemsSpacing;
isFirstElement = false;
} }
if (data.unhealthy != null) { if (data.unhealthy != null) {
@ -81,11 +101,17 @@ class AqiDistributionChart extends StatelessWidget {
fromY: currentY, fromY: currentY,
toY: currentY + data.unhealthy!, toY: currentY + data.unhealthy!,
color: AirQualityDataModel.metricColors['unhealthy']!, color: AirQualityDataModel.metricColors['unhealthy']!,
borderRadius: _barBorderRadius, borderRadius: isFirstElement
? const BorderRadius.only(
topLeft: Radius.circular(22),
topRight: Radius.circular(22),
)
: _barBorderRadius,
width: _barWidth, width: _barWidth,
), ),
); );
currentY += data.unhealthy! + _rodStackItemsSpacing; currentY += data.unhealthy! + _rodStackItemsSpacing;
isFirstElement = false;
} }
if (data.severe != null) { if (data.severe != null) {
@ -94,11 +120,17 @@ class AqiDistributionChart extends StatelessWidget {
fromY: currentY, fromY: currentY,
toY: currentY + data.severe!, toY: currentY + data.severe!,
color: AirQualityDataModel.metricColors['severe']!, color: AirQualityDataModel.metricColors['severe']!,
borderRadius: _barBorderRadius, borderRadius: isFirstElement
? const BorderRadius.only(
topLeft: Radius.circular(22),
topRight: Radius.circular(22),
)
: _barBorderRadius,
width: _barWidth, width: _barWidth,
), ),
); );
currentY += data.severe! + _rodStackItemsSpacing; currentY += data.severe! + _rodStackItemsSpacing;
isFirstElement = false;
} }
if (data.hazardous != null) { if (data.hazardous != null) {
@ -107,11 +139,17 @@ class AqiDistributionChart extends StatelessWidget {
fromY: currentY, fromY: currentY,
toY: currentY + data.hazardous!, toY: currentY + data.hazardous!,
color: AirQualityDataModel.metricColors['hazardous']!, color: AirQualityDataModel.metricColors['hazardous']!,
borderRadius: _barBorderRadius, borderRadius: isFirstElement
? const BorderRadius.only(
topLeft: Radius.circular(22),
topRight: Radius.circular(22),
)
: _barBorderRadius,
width: _barWidth, width: _barWidth,
), ),
); );
currentY += data.hazardous! + _rodStackItemsSpacing; currentY += data.hazardous! + _rodStackItemsSpacing;
isFirstElement = false;
} }
return BarChartGroupData( return BarChartGroupData(

View File

@ -27,21 +27,21 @@ class AqiDistributionChartBox extends StatelessWidget {
chartData: [ chartData: [
AirQualityDataModel( AirQualityDataModel(
date: DateTime(2025, 5, 1), date: DateTime(2025, 5, 1),
good: 30, good: null,
moderate: 25, moderate: 35,
poor: 15, poor: 20,
unhealthy: 10, unhealthy: 15,
severe: 15, severe: 20,
hazardous: 5, hazardous: 10,
), ),
AirQualityDataModel( AirQualityDataModel(
date: DateTime(2025, 5, 2), date: DateTime(2025, 5, 2),
good: 40, good: null,
moderate: 20, moderate: 20,
poor: 20, poor: 20,
unhealthy: 10, unhealthy: null,
severe: 5, severe: 30,
hazardous: 5, hazardous: 25,
), ),
AirQualityDataModel( AirQualityDataModel(
date: DateTime(2025, 5, 3), date: DateTime(2025, 5, 3),