Sliver bar chart - A package that supports Bar Chart in a Flutter Sliver

Overview

sliver_bar_chart

Flutter Website Dart Website MIT License

A package that supports Bar Chart in a Flutter Sliver. This Package allow us to add Bar Chart in Sliver and its set a Bar Chart as a Header on Slivers Scroll.

Key Features

  • easy way to add Bar Chart in a Sliver.
  • used to set a Bar Chart as a Sliver Header.

Preview

sliver_bar_chart

Basic Usage

Import it to your project file

import 'package:sliver_bar_chart/sliver_bar_chart.dart';

And add it in its most basic form like it:

SliverBarChart(
  barWidget: BarChartWidget(
    minHeight: 100.0,
    maxHeight: 1000.0,
    barValues: [
      BarChartData(
        x: '2022',
        y: 500.0,
        barColor: Colors.blue,
      ),
    ],
    isScrolling: true,
  ),
);

Required parameters of SliverBarChart


Parameter Description
BarChartWidget barWidget Used to paint bar chart using custom painter

Optional parameters of SliverBarChart


Parameter Default Description
bool restrain false Whether to stick the header to the start of the viewport once it has reached its minimum size
bool scrolling - Whether sliver is scrolling or not
List heightArray [50.0, 78.0, 90.0, 67.0, 36.0] The array of height for generating the bars of the Bar Chart
double maxWidth 75.0 The maximum width dimensions of the sliver
double minHeight 30.0 The minimum height dimensions of the sliver
double maxHeight 175.0 The maximum height dimensions of the sliver
bool fluctuating false Whether the header should immediately grow again if the user reverses scroll direction

Required parameters of BarChartWidget


Parameter Description
double minHeight The minimum height dimensions of the BarChartWidget
double maxHeight The maximum height dimensions of the BarChartWidget
List barValues hold the list of bar chart data
bool isScrolling Whether sliver is scrolling or not

Optional parameters of BarChartWidget


Parameter Default Description
int yAxisIntervalCount 5 Used to set interval point on Y axis
double xAxisTextRotationAngle 0.0 Used to set X axis text on a rotation angle in case of larger text

Required parameters of BarChartData Model Class


Parameter Description
String x a text that visible on Bar Chart X axis
double y a value that visible on Bar Chart Y axis

Optional parameters of BarChartData Model Class


Parameter Default Description
Color barColor Colors.grey used to set color of the bar

Guideline for contributors


  • Contribution towards our repository is always welcome, we request contributors to create a pull request for development.

Guideline to report an issue/feature request


It would be great for us if the reporter can share the below things to understand the root cause of the issue.

  • Library version
  • Code snippet
  • Logs if applicable
  • Device specification like (Manufacturer, OS version, etc)
  • Screenshot/video with steps to reproduce the issue
  • Library used

LICENSE!

sliver_bar_chart is MIT-licensed.

Let us know!

We’d be really happy if you send us links to your projects where you use our component. Just send an email to [email protected] And do let us know if you have any questions or suggestion regarding our work.

You might also like...

A simple radial chart for Flutter

A simple radial chart for Flutter

Jun 2, 2022

Flutter heatmap calendar inspired by github contribution chart. [traditional mode / calendar mode]

Flutter heatmap calendar inspired by github contribution chart. [traditional mode / calendar mode]

Flutter Heatmap Flutter heatmap calendar inspired by github contribution chart.

Dec 26, 2021

📆 Flutter heatmap calendar inspired by github contribution chart.

📆 Flutter heatmap calendar inspired by github contribution chart.

Flutter Heatmap Calendar Flutter Heatmap Calendar inspired by github contribution chart. Flutter Heatmap Calendar provides traditional contribution ch

Jan 1, 2023

Stores and manages the data of your week expenses with a chart

personal_expenses_app A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you st

Dec 26, 2021

A library to draw fantastic bar charts race in Flutter

A library to draw fantastic bar charts race in Flutter

bar_chart_race The first library to draw fantastic bar charts race in Flutter Usage Let's get started add the dependencies to your app: dependencies:

Jun 24, 2022

A flutter package which makes it easier to plot different types of charts with lots of customization, made purely in dart

A flutter package which makes it easier to plot different types of charts with lots of customization, made purely in dart

multi_charts It is a library that provides different types of charts to plot data points. Currently it supports only Radar Chart, but will support mor

Nov 9, 2022

Flutter package for creating simple yet modern looking charts

Flutter package for creating simple yet modern looking charts

A package for creating simple yet modern looking charts. Five chart types Bar Gauge Line Pie Radar Canvas + DOM modern_charts combines Canvas and DOM

Nov 4, 2022

A pretty plotting package for Flutter apps

A pretty plotting package for Flutter apps

flutter_plot R. C. Howell - 2018 A pretty plotting package for Flutter apps. Sizing and autopadding isn't great right now, but tinkering with padding

Sep 27, 2022

Animating Location Pin Flutter Package

Animating Location Pin Flutter Package

Animating Location Pin This Flutter package provides a Animating Location Pin Widget which can be used while fetching device location. 💻 Installation

Jun 15, 2021
Owner
MindInventory
MindInventory works with Enterprises, Startups, and Agencies since 2011 providing web, mobile app development, enterprise mobility solutions & DevOps services.
MindInventory
A simple candlestick chart for flutter. Supports smooth scroll and zoom

simple_candlestick_chart A simple candlestick chart for flutter. Supports smooth

7c00 14 Oct 17, 2022
A powerful 🚀 Android chart view / graph view library, supporting line- bar- pie- radar- bubble- and candlestick charts as well as scaling, panning and animations.

⚡ A powerful & easy to use chart library for Android ⚡ Charts is the iOS version of this library Table of Contents Quick Start Gradle Maven Documentat

Philipp Jahoda 36k Dec 28, 2022
A beautiful bezier line chart widget for flutter that is highly interactive and configurable.

Bezier Chart A beautiful bezier line chart widget for flutter that is highly interactive and configurable. Features Multi bezier lines Allow numbers a

Aeyrium 428 Dec 21, 2022
A scrollable time chart in Flutter.

time_chart An amazing time chart in Flutter. Chart Types TimeChart AmountChart Getting Started 1 - Depend on it Add it to your package's pubspec.yaml

Minseong Kim 26 Oct 28, 2022
This project is used to introduce the use of flutter canvas, include draw chart, clip image's path and draw progress indicator.

flutter_canvas This project is used to introduce the use of flutter canvas, include draw chart, clip image's path and draw progress indicator. draw ch

YouXianMing 9 Oct 27, 2022
Maybe this is the best k chart in Flutter.Support drag,scale,long press,fling.And easy to use.

k_chart Maybe this is the best k chart in Flutter.Support drag,scale,long press,fling.And easy to use. display image gif Getting Started Install depen

OpenFlutter 342 Jan 9, 2023
Flutter chart library contains depth charts supporting various indicators and zooming

flutter_k_chart 介绍 一个仿火币的flutter图表库包含深度图,支持各种指标及放大缩小、平移等操作 webdemo演示 Demo v0.1.0:下载 APK 演示 简单用例 1.在 pubspec.yaml 中添加依赖 本项目数据来自火币openApi,火币的接口可能需要翻墙,接口

gwh 259 Dec 30, 2022
Animated line chart for flutter

fl_animated_linechart An animated chart library for flutter. Support for datetime axis Multiple y axis, supporting different units Highlight selection

null 51 Sep 25, 2022
Flutter Pie chart with animation

Pie Chart This Flutter package provides a Pie Chart Widget with cool animation. Live Demo: https://apgapg.github.io/pie_chart/ ?? Try LIVE Demo Live D

Ayush P Gupta 161 Dec 24, 2022
Basic radar chart for Flutter

flutter_radar_chart Animated radar chart for Flutter inspired by The Python Graph Gallery (https://python-graph-gallery.com/radar-chart/). Follow the

Dan Panaite 44 Dec 10, 2022