The colorful_background is a flutter library for creating a beautiful background container with gradient colors that are always changing or animating.
Features
- Create beautiful backgrounds
- Use multiple colors as backgrounds with animation
- Add decorations with containers to make the app more beautiful.
Getting started
This package is simple to use. It contains a duration and a list background colors as required attributes. Rest all the attributes has a default value, but you can change properties to accomplish your needs.
Add dependencies
dependencies:
colorful_background: ^0.0.4
Add imports
import 'package:flutter/material.dart';
import 'package:colorful_background/colorful_background.dart';
Usage
ColorfulBackground(
// Color changing animation duration
duration: Duration(milliseconds: 300),
// List extra decoration containers
decoratorsList: [
Positioned(
top: MediaQuery.of(context).size.height / 2.5,
left: MediaQuery.of(context).size.width / 2.5,
child: Container(
height: 200,
width: 200,
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.3),
shape: BoxShape.circle,
),
),
) ,
Positioned(
top: 100,
left: 20,
child: Container(
height: 20,
width: 20,
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.3),
shape: BoxShape.circle,
),
),
),
Positioned(
top: 200,
left: 90,
child: Container(
height: 80,
width: 80,
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.3),
shape: BoxShape.circle,
),
),
),
],
// List colors to animate in the background
backgroundColors: [
const Color(0xFFFF5ACD),
const Color(0xFFFBDA61),
const Color(0xFFFBAB7E),
const Color(0xFFF7CE68),
const Color(0xFFFFFB7D),
],
// A child widget
child: Text("Check my background!"),
);
ColorfulBackground attributes
- height: Takes a double type for the height of the widget
- width: Takes a double type for the width of the widget
- begin: Takes an Alignment property as begin of the gradient colors.
- end: Takes an Alignment property as end of the gradient colors.
- duration: Takes the duration of the animation for colors
- backgroundColors: Takes a list of colors for background animation
- decoratorsList: Takes a list of widgets as the decorations for the widget. It is recommended to wrap each child in Positioned widget.
- child: Takes a widget as child
Conclusion
🌟 Star this repo & follow for more 😊