Untitled
unknown
plain_text
3 years ago
7.9 kB
11
Indexable
import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
import 'package:ordo_waiter_app/constant/app_text_style.dart';
import 'package:ordo_waiter_app/constant/color.dart';
import 'package:ordo_waiter_app/constant/string_constant.dart';
class CommonChart extends StatefulWidget {
final Color? darkColor;
final Color? lightColor;
final bool? isTag;
const CommonChart({Key? key, this.darkColor, this.isTag, this.lightColor}) : super(key: key);
@override
State<StatefulWidget> createState() => CommonChartState();
}
class CommonChartState extends State<CommonChart> {
final Color dark = AppColor.orderYellow;
final Color light = AppColor.orderYellow.withOpacity(.2);
@override
Widget build(BuildContext context) {
return Column(
children: [
Container(
color: AppColor.white,
height: 230,
width: 350,
child: BarChart(
BarChartData(
alignment: BarChartAlignment.center,
barTouchData: BarTouchData(
enabled: false,
),
titlesData: FlTitlesData(
show: true,
bottomTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
reservedSize: 33,
getTitlesWidget: bottomTitles,
),
),
leftTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
reservedSize: 35,
getTitlesWidget: leftTitles,
),
),
topTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: false,
),
),
rightTitles: AxisTitles(
sideTitles: SideTitles(showTitles: false, reservedSize: 30),
),
),maxY: 600,minY: 10,
gridData: FlGridData(
show: true,
drawHorizontalLine: true,
checkToShowHorizontalLine: (value) => value % 10 == 0,
getDrawingHorizontalLine: (value) => FlLine(
color: const Color(0xffe7e8ec),
strokeWidth: 1,
),
drawVerticalLine: false,
),
borderData: FlBorderData(border: const Border(bottom: BorderSide(color: Color(0xffe7e8ec))),
show: true,
),
groupsSpace: 30,
barGroups: getData(),
),
),
),
widget.isTag == true ? Padding(
padding: const EdgeInsets.only(top: 15,left: 5),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
box(AppStrings.currentWeek,widget.darkColor ?? dark),
const SizedBox(width: 20,),
box(AppStrings.previousWeek,widget.lightColor ?? light),
],
),
) : Container()
],
);
}
Widget bottomTitles(double value, TitleMeta meta) {
const style = TextStyle(color: Color(0xff939393), fontSize: 10);
String text;
switch (value.toInt()) {
case 0:
text = 'MON';
break;
case 1:
text = 'TUE';
break;
case 2:
text = 'WED';
break;
case 3:
text = 'THU';
break;
case 4:
text = 'FRI';
break;
case 5:
text = 'SAT';
break;
default:
text = '';
break;
}
return SideTitleWidget(
axisSide: meta.axisSide,
child: Text(text, style: style),
);
}
Widget leftTitles(double value, TitleMeta meta) {
if (value == meta.max) {
return Container();
}
const style = TextStyle(
color: Color(
0xff939393,
),
fontSize: 10,
);
return SideTitleWidget(
axisSide: meta.axisSide,
child: Text(
'\$${meta.formattedValue}',
style: style,
),
);
}
List<BarChartGroupData> getData() {
return [
BarChartGroupData(
x: 0,
barsSpace: 4,
barRods: [
BarChartRodData(
width: 15,
toY: 500,
color: Colors.transparent,
rodStackItems: [
BarChartRodStackItem(220, 300,widget.darkColor ?? dark),
BarChartRodStackItem(0, 250,widget.lightColor ?? light),
],
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(2), topRight: Radius.circular(2))),
],
),
BarChartGroupData(
x: 1,
barsSpace: 4,
barRods: [
BarChartRodData(
width: 15,
toY: 500,
color: Colors.transparent,
rodStackItems: [
BarChartRodStackItem(150, 250, widget.darkColor ?? dark),
BarChartRodStackItem(0, 150,widget.lightColor ?? light),
],
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(2), topRight: Radius.circular(2))),
],
),
BarChartGroupData(
x: 2,
barsSpace: 4,
barRods: [
BarChartRodData(
width: 15,
toY: 500,
color: Colors.transparent,
rodStackItems: [
BarChartRodStackItem(50, 100,widget.darkColor ?? dark),
BarChartRodStackItem(0, 50,widget.lightColor ?? light),
],
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(2), topRight: Radius.circular(2))),
],
),
BarChartGroupData(
x: 3,
barsSpace: 4,
barRods: [
BarChartRodData(
width: 15,
toY: 500,
color: Colors.transparent,
rodStackItems: [
BarChartRodStackItem(0, 230,widget.darkColor ?? dark),
BarChartRodStackItem(0, 300,widget.lightColor ?? light),
],
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(2), topRight: Radius.circular(2))),
],
),
BarChartGroupData(
x: 4,
barsSpace: 4,
barRods: [
BarChartRodData(
width: 15,
toY: 500,
color: Colors.transparent,
rodStackItems: [
BarChartRodStackItem(220, 350,widget.darkColor ?? dark),
BarChartRodStackItem(0, 350,widget.lightColor ?? light),
],
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(2), topRight: Radius.circular(2))),
],
),
BarChartGroupData(
x: 5,
barsSpace: 4,
barRods: [
BarChartRodData(
width: 15,
toY: 600,
color: Colors.transparent,
rodStackItems: [
BarChartRodStackItem(250, 300,widget.darkColor ?? dark),
BarChartRodStackItem(0, 250,widget.lightColor ?? light),
],
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(2), topRight: Radius.circular(2))),
],
),
];
}
Widget box(String text,Color color) {
return Row(
children: [
Container(
height: 14,
width: 14,
decoration: BoxDecoration(
color: color, borderRadius: BorderRadius.circular(4)),
),
Padding(
padding: const EdgeInsets.only(left: 10),
child: Text(text,style: AppStyle.weight500Style(size: 12,color: AppColor.textColor),),
),
],
);
}
}
Editor is loading...