Search packages, repositories and app categories

animated_item_picker cover
Package detailsv2.0.0

animated_item_picker

Generic item picker that encapsulates single or multiple item selection logic.

AndroidiOSWebmacOSWindowsLinux
30-day downloads
71
Likes
33
Pub points
150

Install package

flutter pub add animated_item_picker

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

Animated Item Picker is a Flutter package that provides a customizable, animated interface for selecting single or multiple items from a list. It encapsulates selection logic with smooth transitions and visual feedback, making it ideal for forms, filters, or preference settings. The package supports all major platforms including Android, iOS, Web, macOS, Windows, and Linux, ensuring consistent behavior across devices. With intuitive APIs and built-in animations, it simplifies the implementation of interactive item selection without requiring custom state management.

Use cases

  • Form inputs with selectable options
  • Filtering interfaces
  • User preference selectors
  • Multi-select dropdowns
  • Interactive list navigation

Key features

  • Smooth animated transitions
  • Support for single and multiple selections
  • Cross-platform compatibility
  • Customizable appearance
  • Built-in selection state management
  • Lightweight and easy to integrate

Suitable for

  • Developers building interactive forms
  • Designers needing polished selection UIs
  • Apps requiring multi-select functionality
  • Projects targeting multiple platforms
  • Teams wanting reusable selection components

Considerations

  • May require additional styling for complex themes
  • Limited to basic selection patterns
  • Not optimized for very large datasets
  • Animation performance depends on device capabilities
  • Requires understanding of Flutter's state management

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

Animated Item Picker

Generic item picker that encapsulates single or multiple item selection logic.

Suitable for fixed size item lists, e.g level, week day or gender selector etc.

Supports tapUp/tapDown item opacity animation.

Preview

Usage

  @override
  Widget build(BuildContext context) {
    return AnimatedItemPicker(
          axis: Axis.horizontal,
          multipleSelection: false,
          itemCount: yourModelList.length,
          pressedOpacity: 0.85,
          initialSelection: {defaultItemIndex},
          onItemPicked: (index, selected) {
         
          },
          itemBuilder: (index, animValue, selected) => _YourItemWidget(
            name: yourModelList[index].name,
            borderColor: _colorTween1.transform(animValue),
            textColor: _colorTween2.transform(animValue),
            iconColor: _colorTween3.transform(animValue)
          ),
      );
  }

Article

Often a user has to make a choice in an application, eg. gender, difficulty level, or switch a tab, etc. You can agree that well-designed animated item selection will make your UI look more intuitively with enhanced User Experience.

We at KiRN tech use this element so often that we decided to create a separate package for it.

Here we'll walk through the base stages of this package creation:

  • Define AnimatedItemPicker API.
  • Implement select/unSelect item animation
  • Animate item selection opacity

More: https://kirn.tech/article-flutteranimation-animated-item-picker

Categories

Source repository

Projects using this package

No data available yet.