shiny_striped_progress_bar 1.1.0

A Flutter package for creating animated progress bars with a striped design and shine effect.

Shiny Striped Progress Bar

An open-source Flutter package providing an animated progress bar with stripes and a shine effect.

Features

• Smooth animations for progress changes.
• Striped design with customizable colors and angles.
• Shine effect to enhance visual appeal, now configurable.
• Fully customizable height, colors, border radius, and more.
• Reacts to dynamic changes in targetProgress with animations.

Getting Started

• Installing
• Basic Examples
  • Custom Colors
  • Custom Stripe Angle
  • Shine Effect
  • Border Radius
• Parameters Description

Installing

Add the following to your pubspec.yaml file:

dependencies:
  flutter:
    sdk: flutter
  shiny_striped_progress_bar: ^1.1.0

Then import the package in your Dart code:

import 'package:shiny_striped_progress_bar/shiny_striped_progress_bar.dart';

Basic Examples

Custom Colors

Set the colors for the progress bar, background, and stripes.

Dart code

ShinyStripedProgressBar(
  targetProgress: 0.7,
  backgroundColor: Colors.grey.shade300,
  progressColor: Colors.blue,
  stripeColor: Colors.white,
);

Custom Stripe Angle

Adjust the angle of the stripes for a unique design. You can choose from three predefined angles: 45°, 90°, and 135°.

Dart code

ShinyStripedProgressBar(
  targetProgress: 0.6,
  stripeAngle: StripeAngle.angle30,
  stripeColor: Colors.orange,
);

Shine Effect

The shine effect moves dynamically across the progress bar.

Dart code

ShinyStripedProgressBar(
  targetProgress: 0.5,
  stripeColor: Colors.cyan,
);

Border Radius

Adjust the corner radius for rounded progress bars.

Dart code

ShinyStripedProgressBar(
  targetProgress: 0.9,
  borderRadius: BorderRadius.circular(10),
);

Parameters Description

Parameter	Type	Default Value	Description
targetProgress	double	Required	Progress level between 0.0 and 1.0.
duration	Duration	Duration(milliseconds: 1000)	Animation duration.
height	double	40	Height of the progress bar.
backgroundColor	Color	Colors.grey.shade300	Background color of the progress bar.
progressColor	Color	Colors.blue	Color of the progress bar.
stripeColor	Color	Colors.white	Color of the stripes in the progress bar.
stripeAngle	StripeAngle	StripeAngle.angle45	The angle of the stripes.
enableShineEffect	bool	true	Whether to enable the shine effect.
borderRadius	BorderRadius	BorderRadius.circular(5)	Border radius for the corners of the progress bar.