cylinder_bar_chart 0.0.4 copy "cylinder_bar_chart: ^0.0.4" to clipboard
cylinder_bar_chart: ^0.0.4 copied to clipboard

A Cylinder bar chart.

A Cylinder bar chart package for flutter.

Instalation #

Add cylinder_bar_chart to your dependecies and then import the packege

Getting started #

To use the cylinder bar chart you just have to pass both dates and values and you can customize the colors and seperator of the bar also.

Example #


import  'package:flutter/material.dart';

import  'package:cylinder_bar_chart/cylinder_bar_chart.dart';

  

void  main() {

runApp(CylinderBarChart(

dates: [
DateTime.now(),
DateTime.now(),
DateTime.now(),
DateTime.now(),
DateTime.now(),
DateTime.now(),
DateTime.now()
],
values:  const [150.0, 200.0, 23.0, 100.0, 145.0, 77, 53],
));
}

  
class  CylinderBarChart  extends  StatelessWidget {
const  CylinderBarChart({
super.key,
required  this.dates,
required  this.values,
this.mainColor =  const  Color(0xff73B3FE),
this.accentColor =  const  Color(0xff258AFE),
this.separator,
});
final  List<DateTime> dates;
final  List<double> values;
final  Color mainColor;
final  Color accentColor;
final  Widget? separator;
@override

Widget  build(BuildContext context) {
double maxValue = values.reduce((curr, next) => curr > next ? curr : next);
return  MaterialApp(
title:  'Flutter Demo',
theme:  ThemeData(
colorScheme:  ColorScheme.fromSeed(seedColor:  Colors.deepPurple),
useMaterial3:  true,
),
home:  Scaffold(
appBar:  AppBar(title:  const  Text('Bite me'),),
body:  ListView.separated(
scrollDirection:  Axis.horizontal,
itemBuilder: (context, index) {
return  Column(
children: [
Text(values[index].toString(),),
CylinderBar(
value: values[index],
maxValue: maxValue,
mainColor: mainColor,
accentColor: accentColor,
),
Text("${dates[index].day}/${dates[index].month}",),
],
);
},

separatorBuilder: (context, index) => separator ??  const  Gap(12),

itemCount: values.length,

),),);
}
}

  

Final result

cylinder_bar_chart #