animate_gradient 0.0.3 copy "animate_gradient: ^0.0.3" to clipboard
animate_gradient: ^0.0.3 copied to clipboard

This Package lets you make animated gradients without any hassle. Just pass the primary and secondary colors and you're done.

example/lib/main.dart

import 'package:animate_gradient/animate_gradient.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'Animated Gradient',
      home: App(),
    );
  }
}

class App extends StatefulWidget {
  const App({Key? key}) : super(key: key);

  @override
  State<App> createState() => _AppState();
}

class _AppState extends State<App> {
  bool isChanged = false;
  List<Color> primaryColors = const [
    Colors.white,
    Colors.pinkAccent,
    Colors.pink,
  ];
  List<Color> secondaryColors = const [
    Colors.blue,
    Colors.blueAccent,
    Colors.white,
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: AnimateGradient(
        primaryBeginGeometry: const AlignmentDirectional(0, 1),
        primaryEndGeometry: const AlignmentDirectional(0, 2),
        secondaryBeginGeometry: const AlignmentDirectional(2, 0),
        secondaryEndGeometry: const AlignmentDirectional(0, -0.8),
        textDirectionForGeometry: TextDirection.rtl,
        primaryColors: primaryColors,
        secondaryColors: secondaryColors,
        child: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              const Text(
                'Animated Gradient',
                style: TextStyle(
                  fontSize: 36,
                  color: Colors.white,
                ),
              ),
              ElevatedButton(
                onPressed: _changeColors,
                style: _buttonStyle(),
                child: const Text(
                  'Change Colors',
                  style: TextStyle(color: Colors.black),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }

  ButtonStyle _buttonStyle() {
    return ButtonStyle(
      shape: MaterialStatePropertyAll(
        RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(8),
        ),
      ),
    );
  }

  void _changeColors() {
    if (isChanged) {
      isChanged = false;
      primaryColors = const [
        Colors.pink,
        Colors.pinkAccent,
        Colors.white,
      ];
      secondaryColors = const [
        Colors.white,
        Colors.blueAccent,
        Colors.blue,
      ];
    } else {
      isChanged = true;
      primaryColors = [
        Colors.red,
        Colors.redAccent,
        Colors.white,
      ];
      secondaryColors = [
        Colors.white,
        Colors.tealAccent,
        Colors.teal,
      ];
    }

    setState(() {});
  }
}
126
likes
140
pub points
93%
popularity

Publisher

verified publishergeekyants.com

This Package lets you make animated gradients without any hassle. Just pass the primary and secondary colors and you're done.

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (LICENSE)

Dependencies

flutter

More

Packages that depend on animate_gradient