Skip to content
Flutter widgets wrapped with gradients
Dart Swift Kotlin Objective-C
Branch: master
Clone or download
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.idea update README.md screenshot of gradient-widgets example Jun 10, 2019
art update README.md screenshot of gradient-widgets example Jun 10, 2019
example update README.md screenshot of gradient-widgets example Jun 10, 2019
lib - `shadowColor` for `GradientCard`, `GradientButton` and Jun 5, 2019
test
.gitignore update README.md screenshot of gradient-widgets example Jun 10, 2019
CHANGELOG.md
LICENSE Update LICENSE Oct 28, 2018
README.md syntax hightlighting for some code to dart Jun 5, 2019
gradient_widgets.iml
pubspec.lock - `shadowColor` for `GradientCard`, `GradientButton` and Jun 5, 2019
pubspec.yaml - `shadowColor` for `GradientCard`, `GradientButton` and Jun 5, 2019

README.md

Pub

Gradient Widgets

Gradient Widgets

As of ^0.5.0, shadowColor is available for gradient buttons and cards

A minimal set of Flutter widgets encased with beautiful gradients.

You can use them when your UI needs user attention/focus, , e.g., login or send actions, or important shopping item title (see Gradient Screens to get the idea 😉)

☑️ GradientText

☑️ GradientCard

☑️ GradientButton

☑️ CircularGradientButton + Shadow Color

☑️ GradientProgressIndicator

◻️ CircularGradientProgressIndicator

◻️ GradientAppBar

Installation

In your pubspec.yaml root add:

dependencies:
  gradient_widgets: ^0.5.0

then,

import 'package:gradient_widgets/gradient_widgets.dart';

Usage

Card + Gradient

GradientCard(
    gradient: Gradients.tameer,
    shadowColor: Gradients.tameer.colors.last.withOpacity(0.25),
    elevation: 8,
);

most parameters are the same as the Card.

Progress Indicator + Gradient

Gradient Widgets

must be gradient.colors.length = 2

indeterminate

GradientProgressIndicator(gradient: Gradients.rainbowBlue,);

determinate

GradientProgressIndicator(
  gradient: Gradients.rainbowBlue,
  value: 0.65,
);

Normal Button + Gradient

GradientButton(
  child: Text('Gradient'),
  callback: () {},
  gradient: Gradients.backToFuture,
  shadowColor: Gradients.backToFuture.colors.last.withOpacity(0.25),
),

most parameters are the same as any *Button.

Circular Button + Gradient

CircularGradientButton(
  child: Icon(Icons.gradient),
  callback: (){},
  gradient: Gradients.rainbowBlue,
  shadowColor: Gradients.rainbowBlue.colors.last.withOpacity(0.5),
),

most parameters are the same as FloatingActionButton.

Text + Gradient

GradientText(
  'Hello',
  shaderRect: Rect.fromLTWH(0.0, 0.0, 50.0, 50.0),
  gradient: Gradients.hotLinear,
  style: TextStyle(fontSize: 40.0,),
),

all parameters are the same as the Text.


Getting Started

For help getting started with Flutter, view our online documentation.

For help on editing package code, view the documentation.

You can’t perform that action at this time.