scroll_snap_effect

Visão geral do pacote

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

Um pacote Flutter que simplifica a implementação de efeitos de snap de rolagem em widgets roláveis. Permite um deslize suave e preciso para posições específicas durante a rolagem, ideal para criar interfaces de rolagem semelhantes a carrosséis ou segmentadas. O pacote é leve e se integra perfeitamente com os ScrollView existentes, oferecendo aos desenvolvedores uma maneira fácil de melhorar a experiência do usuário com navegação intuitiva. Suporta todas as principais plataformas, incluindo Android, iOS, Web, macOS, Windows e Linux.

Casos de uso

Criando carrosséis ou deslizadores
Construindo interfaces de rolagem segmentada
Melhorando a navegação nas telas de onboarding
Designando galerias de imagens com alinhamento em grade
Implementando visualizações de rolagem com guias

Principais recursos

API simples para comportamento de snap
Suporta múltiplas direções de rolagem
animações de snap suaves
Compatibilidade multiplataforma
Integração fácil com ListView e PageView
Intervalos de snap personalizáveis

Indicado para

Desenvolvedores construindo interfaces interativas baseadas em rolagem
Designers procurando navegação por rolagem intuitiva
Aplicativos que exigem rolagem alinhada em grade
Projetos direcionados para múltiplas plataformas
Equipes que desejam configuração mínima para efeitos de rolagem

Considerações

Pode exigir ajustes para layouts complexos
Personalização limitada para fixação não linear
Não otimizado para conjuntos de dados extremamente grandes
Mais adequado para itens de tamanho fixo
O desempenho pode variar com árvores de widget pesadas

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

A Flutter package to create easy animation scroll snap effect in ListView

  // Example itemSize
  // itemSize = child width (ex: 100) + child padding (ex: 16);
  // itemSize = 116
  ScrollSnapEffect(
      itemSize: 116,
      itemCount: 15,
      padding: const EdgeInsets.symmetric(horizontal: 20),
      onChanged: (index) {
        debugPrint('$index');
      },
      itemBuilder: (context, index) {
        return Padding(
          padding: const EdgeInsets.only(right: 16),
          child: SizedBox(
            height: 100,
            width: 100,
            child: ColoredBox(
              color: Colors.blue,
              child: Center(
                child: Text(
                  '$index',
                  style: const TextStyle(
                    color: Colors.white,
                    fontSize: 20,
                  ),
                ),
              ),
            ),
          ),
        );
      },
    ),

Example Scroll Snap Effect

🚧 Maintener

Farhan Fadila
📫 How to reach me: farhan.fadila1717@gmail.com

Buscar pacotes, repositórios e categorias de apps

Instalar pacote

Visão geral do pacote

Casos de uso

Principais recursos

Indicado para

Considerações

README original

Example Scroll Snap Effect

🚧 Maintener

❤️ Suport Maintener

Categorias

Repositório-fonte