FLUTTER ECOSYSTEM

luca-colazzo/icons_animate

这是一个 Flutter 包,用于从两个图标创建自定义 AnimatedIcon。该包旨在使 AnimatedIcons 能够轻松应用于任何图标,而不仅仅是少数默认图标。

icons_animate 项目封面
Stars
2
Forks
0
最近推送(UTC)
2022年5月26日
项目状态
未归档
Luca GitHub avatar
GITHUB User

Luca ↗

🚨 Warning Police 🚨

语言C++CMakeDartHTMLSwiftCKotlinObjective-C

技术话题

此仓库发布的插件

使用的依赖

依赖清单 3 项
  • flutter{"sdk":"flutter"}
  • flutter_test开发依赖{"sdk":"flutter"}
  • flutter_lints开发依赖^2.0.0

原始 README

以下为英文项目原文快照,最新内容请访问 GitHub。

展开 / 收起项目 README

Icons Animate

This is a Flutter package to make a custom AnimatedIcon from two Icons.
This package is born to make AnimatedIcons easily available for any Icon and not only the few default ones

GitHub branch checks state GitHub release (latest by date)
Pub Version Pub Points
GitHub license GitHub last commit GitHub issues GitHub closed issues

Features

Here are some examples of animated icons.

Note that you can provide any Icon that is of type IconData to the animator

example gif

You can see an example of some icons being animated in the Sample Project

Getting started

To install the package just do:

flutter pub add icons_animate
flutter pub get

OR add the dependency manually to your pubspec.yaml file:

dependencies:
  icons_animate: ^0.0.2

Then depend on it in your class:

import 'package:icons_animate/icons_animate.dart';

Usage

Here is a simple implementation:

AnimateIcons(
    startIcon: Icons.add_circle,
    endIcon: Icons.add_circle_outline,
    size: 100.0,
    controller: controller,
    startTooltip: 'Icons.add_circle',
    endTooltip: 'Icons.add_circle_outline',
    // add this for splashColor, default is Colors.transparent means no click effect
    splashColor: Colors.blueAccent.shade100.withAlpha(50),
    // add this to specify a custom splashRadius
    // default is Material.defaultSplashRadius (35)
    splashRadius: 24,
    onStartIconPress: () {
        print("Clicked on Add Icon");
        return true;
    },
    onEndIconPress: () {
        print("Clicked on Close Icon");
        return true;
    },
    duration: Duration(milliseconds: 500),
    startIconColor: Colors.deepPurple,
    endIconColor: Colors.deepOrange,
    clockwise: false,
),

See Example Code for more info.

Issues & Feedback

Please file an issue to send feedback or report a bug, If you want to ask a question or suggest an idea then you can open an discussion. Thank you!

Contributing

Every PR is welcome.