rive_animated_icon

Visão geral do pacote

Orientação gerada a partir de informações públicas. Apenas para referência.

O pacote rive_animated_icon oferece uma coleção de ícones animados personalizáveis construídos com Rive, permitindo animações suaves e interativas em múltiplas plataformas. Projetado para desenvolvedores que buscam elementos visuais dinâmicos, integra-se perfeitamente em aplicativos Flutter, permitindo a fácil personalização de tamanho, cor e estados de animação. Ideal para aprimorar interfaces do usuário com microinterações envolventes, o pacote suporta Android, iOS, Web, macOS, Windows e Linux. Ele aproveita o motor de animação leve do Rive para entregar visualizações de alto desempenho sem comprometer a responsividade do aplicativo.

Casos de uso

Melhorando a UI com ícones animados
Adicionando microinterações em aplicativos
Criando indicadores de carregamento envolventes
Personalizando animações de ícone por tema
Melhorando o feedback do usuário com movimento
Integrando botões animados

Principais recursos

animações com suporte do Rive
Tamanho e cor personalizáveis
Suporte para múltiplas plataformas
Integração fácil com o Flutter
conjunto de ícones animados pré-construídos
controle de animação responsivo

Indicado para

Desenvolvedores Flutter procurando elementos de interface animados
Aplicativos que exigem ícones interativos
Designers colaborando com desenvolvedores
Projetos com foco em implantação multiplataforma
Equipes usando Rive para animações

Considerações

Requer conhecimento de animações Rive
Tamanho adicional do pacote proveniente dos recursos Rive
Impacto potencial no desempenho em dispositivos de baixa configuração
Limitado a formatos de animação compatíveis com Rive
Necessita de gerenciamento adequado de recursos
Pode exigir código personalizado para interações complexas

README original

Snapshot do README original do repositório-fonte vinculado. Consulte o repositório para o conteúdo mais recente.

RiveAnimatedIcons - 50+ Icons Available! 🚀

This package provides rive animated icons that can be customized to suit your preference. It includes the riveIcon type, onTap, color and other parameters to give you a level of control.

Icons Sample ⬇️

Example


RiveAnimatedIcon(
    riveIcon: RiveIcon.home,
    width: 50,
    height: 50,
    color: Colors.green,
    strokeWidth: 3,
    loopAnimation: false,
    onTap: (){},
    onHover: (value){}                          
),

Required parameter

riveIcon:

This parameter is used to define the icon type from the RiveIcon enum

Optional parameters

width:

This parameter is used to set the icon width

height:

This parameter is used to set the icon height

color:

This parameter is used to set icon color

loopAnimation:

When this parameter is set to true the icon's animation will be on loop

onTap:

This callback is set by the user to perform actions onTap

onHover:

This callback is set by the user to perform actions onHover

splashColor:

This parameter is used to set icon splash color

strokeWidth:

This parameter is used to set icon stroke width

splashFactory:

This parameter is used to set icon splashFactory

mouseCursor:

This parameter is used to set icon mouseCursor when hovered

enableAbsorbPointer:

When this parameter is set to true it disables all interactive features of the icon

Animated Icon stroke width sample ⬇️

Best practices 🙌

If a Rive animation is set to loop and is scrolled off-screen, you can disable the loop to stop the animation and conserve resources while it's not visible. Similarly, you can re-enable the loop when the animation comes back into view.

License 📝

Rive Animated Icons is MIT-licensed

Animation credits 🏆

All the icons available were animated in Rive and sourced from the Rive community files. Special thanks to all the animators!

Maintainers 🔩

Nikki Eke

Buscar pacotes, repositórios e categorias de apps

Instalar pacote