Search packages, repositories and app categories

sliver_bar_chart cover
Package detailsv0.0.1

sliver_bar_chart

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.

AndroidiOSWebmacOSWindowsLinux
30-day downloads
21
Likes
27
Pub points
150

Install package

flutter pub add sliver_bar_chart

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

The sliver_bar_chart package enables the integration of bar charts within Flutter's Sliver widgets, allowing developers to display bar charts as scrollable headers in lists or custom scroll views. It is designed for use in complex scrolling layouts where visual data representation is needed at the top of a scrollable area. The package supports all major platforms and provides a seamless way to combine data visualization with responsive UIs. It enhances user experience by offering dynamic, interactive charts that adapt to scroll behavior.

Use cases

  • Creating scrollable dashboards with chart headers
  • Displaying time-series data in a list header
  • Building analytics interfaces with visual summaries
  • Integrating charts into nested scroll views
  • Enhancing data-heavy app screens with visual feedback

Key features

  • Bar charts as Sliver headers
  • Responsive design across platforms
  • Smooth integration with CustomScrollView
  • Support for dynamic data updates
  • Built-in animation for chart rendering

Suitable for

  • Data visualization in scrollable UIs
  • Dashboard and analytics apps
  • Mobile and web applications with large datasets
  • Developers using Sliver-based layouts
  • Apps requiring interactive chart headers

Considerations

  • Requires understanding of Sliver widgets
  • May impact performance with very large datasets
  • Limited customization beyond basic chart styling
  • Depends on underlying chart rendering library
  • Best suited for static or moderately dynamic data

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

sliver_bar_chart

Flutter Website Dart Website MIT License

It is Sliver component. Bar chart work with sliver animation on expand and collapse. It is an independent component that allows you to set data for the chart with the configuration of Sliver.

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 sales@mindinventory.com And do let us know if you have any questions or suggestion regarding our work.

Categories

Source repository

Projects using this package

No data available yet.