199 lines
5.8 KiB
Dart
199 lines
5.8 KiB
Dart
|
import 'package:fl_chart/fl_chart.dart';
|
||
|
|
||
|
import 'package:flutter/material.dart';
|
||
|
import 'package:konectar_events/utils/appcolors.dart';
|
||
|
import 'package:konectar_events/widgets/indicators.dart';
|
||
|
|
||
|
class CustomPieChart extends StatefulWidget {
|
||
|
const CustomPieChart({super.key});
|
||
|
|
||
|
@override
|
||
|
State<StatefulWidget> createState() => CustomPieChartState();
|
||
|
}
|
||
|
|
||
|
class CustomPieChartState extends State {
|
||
|
int touchedIndex = -1;
|
||
|
|
||
|
@override
|
||
|
Widget build(BuildContext context) {
|
||
|
return AspectRatio(
|
||
|
aspectRatio: 1.3,
|
||
|
child: Column(
|
||
|
children: <Widget>[
|
||
|
const SizedBox(
|
||
|
height: 18,
|
||
|
),
|
||
|
Expanded(
|
||
|
child: AspectRatio(
|
||
|
aspectRatio: 1.9,
|
||
|
child: PieChart(
|
||
|
PieChartData(
|
||
|
pieTouchData: PieTouchData(
|
||
|
touchCallback: (FlTouchEvent event, pieTouchResponse) {
|
||
|
setState(() {
|
||
|
if (!event.isInterestedForInteractions ||
|
||
|
pieTouchResponse == null ||
|
||
|
pieTouchResponse.touchedSection == null) {
|
||
|
touchedIndex = -1;
|
||
|
return;
|
||
|
}
|
||
|
touchedIndex = pieTouchResponse
|
||
|
.touchedSection!.touchedSectionIndex;
|
||
|
});
|
||
|
},
|
||
|
),
|
||
|
borderData: FlBorderData(
|
||
|
show: false,
|
||
|
),
|
||
|
sectionsSpace: 0,
|
||
|
centerSpaceRadius: 60,
|
||
|
sections: showingSections(),
|
||
|
),
|
||
|
),
|
||
|
),
|
||
|
),
|
||
|
SizedBox(
|
||
|
height: 5,
|
||
|
),
|
||
|
Padding(
|
||
|
padding: const EdgeInsets.all(8.0),
|
||
|
child: const Column(
|
||
|
mainAxisAlignment: MainAxisAlignment.end,
|
||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||
|
children: <Widget>[
|
||
|
Indicator(
|
||
|
size: 8,
|
||
|
color: AppColors.contentColorBlue,
|
||
|
text: 'Medical Oncology',
|
||
|
isSquare: true,
|
||
|
),
|
||
|
SizedBox(
|
||
|
height: 2,
|
||
|
),
|
||
|
Indicator(
|
||
|
size: 8,
|
||
|
color: AppColors.contentColorYellow,
|
||
|
text: 'Hematology/Oncology',
|
||
|
isSquare: true,
|
||
|
),
|
||
|
SizedBox(
|
||
|
height: 2,
|
||
|
),
|
||
|
Indicator(
|
||
|
size: 8,
|
||
|
color: AppColors.contentColorPurple,
|
||
|
text: 'Internal Medicine',
|
||
|
isSquare: true,
|
||
|
),
|
||
|
SizedBox(
|
||
|
height: 2,
|
||
|
),
|
||
|
Indicator(
|
||
|
size: 8,
|
||
|
color: AppColors.contentColorGreen,
|
||
|
text: 'Radiation Oncology',
|
||
|
isSquare: true,
|
||
|
),
|
||
|
SizedBox(
|
||
|
height: 2,
|
||
|
),
|
||
|
Indicator(
|
||
|
size: 8,
|
||
|
color: AppColors.contentColorOrange,
|
||
|
text: 'Pediatric Hematology/Oncology',
|
||
|
isSquare: true,
|
||
|
),
|
||
|
SizedBox(
|
||
|
height: 5,
|
||
|
),
|
||
|
],
|
||
|
),
|
||
|
),
|
||
|
const SizedBox(
|
||
|
width: 9,
|
||
|
),
|
||
|
],
|
||
|
),
|
||
|
);
|
||
|
}
|
||
|
|
||
|
List<PieChartSectionData> showingSections() {
|
||
|
return List.generate(5, (i) {
|
||
|
final isTouched = i == touchedIndex;
|
||
|
final fontSize = isTouched ? 25.0 : 16.0;
|
||
|
final radius = isTouched ? 60.0 : 50.0;
|
||
|
const shadows = [Shadow(color: Colors.black, blurRadius: 2)];
|
||
|
switch (i) {
|
||
|
case 0:
|
||
|
return PieChartSectionData(
|
||
|
color: AppColors.contentColorBlue,
|
||
|
value: 40,
|
||
|
title: '40%',
|
||
|
radius: radius,
|
||
|
titleStyle: TextStyle(
|
||
|
fontSize: fontSize,
|
||
|
fontWeight: FontWeight.bold,
|
||
|
color: AppColors.mainTextColor1,
|
||
|
shadows: shadows,
|
||
|
),
|
||
|
);
|
||
|
case 1:
|
||
|
return PieChartSectionData(
|
||
|
color: AppColors.contentColorYellow,
|
||
|
value: 44,
|
||
|
title: '44%',
|
||
|
radius: radius,
|
||
|
titleStyle: TextStyle(
|
||
|
fontSize: fontSize,
|
||
|
fontWeight: FontWeight.bold,
|
||
|
color: AppColors.mainTextColor1,
|
||
|
shadows: shadows,
|
||
|
),
|
||
|
);
|
||
|
case 2:
|
||
|
return PieChartSectionData(
|
||
|
color: AppColors.contentColorPurple,
|
||
|
value: 40.5,
|
||
|
title: '40.5%',
|
||
|
radius: radius,
|
||
|
titleStyle: TextStyle(
|
||
|
fontSize: fontSize,
|
||
|
fontWeight: FontWeight.bold,
|
||
|
color: AppColors.mainTextColor1,
|
||
|
shadows: shadows,
|
||
|
),
|
||
|
);
|
||
|
case 3:
|
||
|
return PieChartSectionData(
|
||
|
color: AppColors.contentColorGreen,
|
||
|
value: 8.2,
|
||
|
title: '8.2%',
|
||
|
radius: radius,
|
||
|
titleStyle: TextStyle(
|
||
|
fontSize: fontSize,
|
||
|
fontWeight: FontWeight.bold,
|
||
|
color: AppColors.mainTextColor1,
|
||
|
shadows: shadows,
|
||
|
),
|
||
|
);
|
||
|
case 4:
|
||
|
return PieChartSectionData(
|
||
|
color: AppColors.contentColorOrange,
|
||
|
value: 5.2,
|
||
|
title: '5.2%',
|
||
|
radius: radius,
|
||
|
titleStyle: TextStyle(
|
||
|
fontSize: fontSize,
|
||
|
fontWeight: FontWeight.bold,
|
||
|
color: AppColors.mainTextColor1,
|
||
|
shadows: shadows,
|
||
|
),
|
||
|
);
|
||
|
|
||
|
default:
|
||
|
throw Error();
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
}
|