https://github.com/marcelgarus/implicitly_animated_list

A Flutter widget that implicitly animates a list whenever it rebuilds with new items.
https://github.com/marcelgarus/implicitly_animated_list

Last synced: 8 days ago
JSON representation

A Flutter widget that implicitly animates a list whenever it rebuilds with new items.

• Host: GitHub
• URL: https://github.com/marcelgarus/implicitly_animated_list
• Owner: MarcelGarus
• License: mit
• Created: 2019-10-14T09:50:00.000Z (about 5 years ago)
• Default Branch: master
• Last Pushed: 2023-07-26T09:44:59.000Z (over 1 year ago)
• Last Synced: 2024-05-01T15:33:30.088Z (6 months ago)
• Language: Dart
• Size: 2.05 MB
• Stars: 6
• Watchers: 3
• Forks: 6
• Open Issues: 6
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        
Often, your lists represent some kind of data.

You can just pass the original list data to the `ImplicitlyAnimatedList` as

well as an `itemBuilder` for building a widget from one data point and it'll

animate whenever the data changes:

```dart

ImplicitlyAnimatedList(

  // When you change items of this list and hot reload, the list animates. 

  itemData: [1, 2, 3, 4],

  itemBuilder: (_, number) => ListTile(title: Text('$number')),

),

```

It works with all classes and works well with `StreamBuilder`:

```dart

class User {

  String firstName;

  String lastName;

  // The ImplicitlyAnimatedList uses the == operator to compare items.

  bool operator== (Object other) => other is User

    && firstName == other.firstName

    && lastName == other.lastName;

}

...

StreamBuilder>(

  stream: someSource.usersStream,

  builder: (context, snapshot) {

    if (!snapshot.hasData) {

      return ...;

    }

    return ImplicitlyAnimatedList(

      itemData: snapshot.data,

      itemBuilder: (context, user) {

        return ListTile(title: Text('${user.firstName} ${user.lastName}'));

      }

    );

  }

),

```

Here's an example that generates random numbers and animates from one state to the next (notice it's only 10 fps because of being a gif):

![example showcase](showcase.gif)