From 3af6933d18a77e7d9df546b301345add4e3bfac8 Mon Sep 17 00:00:00 2001 From: joonsv Date: Fri, 17 Mar 2023 13:45:04 +0100 Subject: [PATCH] add custom inbetween animated widget --- CHANGELOG.md | 8 +++++- example/.metadata | 25 ++++--------------- example/lib/main.dart | 12 +++++++-- example/pubspec.lock | 2 +- lib/src/animated_grid_to_list.dart | 5 ++++ .../animated_grid_to_list_item_builder.dart | 8 ++++++ lib/src/animated_grid_to_list_type.dart | 6 +++-- pubspec.yaml | 2 +- 8 files changed, 41 insertions(+), 27 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 87e8b1b..3446f82 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,9 @@ ## [0.0.1] 15 March 2023 -- Initial Release \ No newline at end of file +- Initial Release + +## [0.0.2] 17 March 2023 + +- Add custom wrap alignment +- Add custom widget during animation +- Can now set duration to 0 for instant transition diff --git a/example/.metadata b/example/.metadata index af46018..a51f538 100644 --- a/example/.metadata +++ b/example/.metadata @@ -4,7 +4,7 @@ # This file should be version controlled. version: - revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 + revision: 2ad6cd72c040113b47ee9055e722606a490ef0da channel: stable project_type: app @@ -13,26 +13,11 @@ project_type: app migration: platforms: - platform: root - create_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 - base_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 + create_revision: 2ad6cd72c040113b47ee9055e722606a490ef0da + base_revision: 2ad6cd72c040113b47ee9055e722606a490ef0da - platform: android - create_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 - base_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 - - platform: ios - create_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 - base_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 - - platform: linux - create_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 - base_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 - - platform: macos - create_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 - base_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 - - platform: web - create_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 - base_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 - - platform: windows - create_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 - base_revision: 12cb4eb7a009f52b347b62ade7cb4854b926af72 + create_revision: 2ad6cd72c040113b47ee9055e722606a490ef0da + base_revision: 2ad6cd72c040113b47ee9055e722606a490ef0da # User provided section diff --git a/example/lib/main.dart b/example/lib/main.dart index 5908aef..042d7fd 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -53,12 +53,20 @@ class _GridToListState extends State { controller: controller, onTap: (i) { if (!controller.isExpanded) { - controller.expand(i, const Duration(seconds: 2)); + controller.expand(i, const Duration(seconds: 1)); } else { - controller.shrink(const Duration(seconds: 2)); + controller.shrink(const Duration(seconds: 0)); } }, itemBuilder: AnimatedGridToListItemBuilder( + wrapAlignment: WrapAlignment.start, + animatedItemBuilder: (context, index) => Container( + height: MediaQuery.of(context).size.height * 0.6, + width: MediaQuery.of(context).size.width * 0.8, + color: containers[index].color, + padding: const EdgeInsets.all(8), + child: Text('Item $index IS ANIMATING'), + ), gridItemBuilder: (context, index) { return containers[index]; }, diff --git a/example/pubspec.lock b/example/pubspec.lock index e963be8..d6c2f51 100644 --- a/example/pubspec.lock +++ b/example/pubspec.lock @@ -68,7 +68,7 @@ packages: path: ".." relative: true source: path - version: "1.0.0+1" + version: "0.0.2+1" flutter_lints: dependency: "direct dev" description: diff --git a/lib/src/animated_grid_to_list.dart b/lib/src/animated_grid_to_list.dart index d272848..f267fcc 100644 --- a/lib/src/animated_grid_to_list.dart +++ b/lib/src/animated_grid_to_list.dart @@ -297,6 +297,11 @@ class AnimatedGridToListController extends ChangeNotifier { _controller.addListener(_listenerFunction); _controller.forward(); + if (duration?.inMilliseconds == 0) { + _controller.value = _controller.value > _controller.upperBound / 2 + ? _controller.upperBound + : _controller.lowerBound; + } } } } diff --git a/lib/src/animated_grid_to_list_item_builder.dart b/lib/src/animated_grid_to_list_item_builder.dart index 939da43..24a56a3 100644 --- a/lib/src/animated_grid_to_list_item_builder.dart +++ b/lib/src/animated_grid_to_list_item_builder.dart @@ -21,6 +21,8 @@ class AnimatedGridToListItemBuilder { required this.itemCount, required this.gridItemSize, required this.listItemSize, + this.animatedItemBuilder, + this.wrapAlignment = WrapAlignment.center, }); /// [IndexedWidgetBuilder] which build the items in grid state. @@ -29,12 +31,18 @@ class AnimatedGridToListItemBuilder { /// [IndexedWidgetBuilder] which build the items in list state. final IndexedWidgetBuilder listItemBuilder; + /// [IndexedWidgetBuilder] which build the items in animated state. + final IndexedWidgetBuilder? animatedItemBuilder; + /// A [Size] to build the items in the correct manner and handle scrolling in grid state. final Size gridItemSize; /// A [Size] to build the items in the correct manner and handle scrolling in list state. final Size listItemSize; + /// A [WrapAlignment] to align the items in the correct manner. + final WrapAlignment wrapAlignment; + /// A [int] of the amount of items to build. int itemCount; } diff --git a/lib/src/animated_grid_to_list_type.dart b/lib/src/animated_grid_to_list_type.dart index a958f2f..9d75623 100644 --- a/lib/src/animated_grid_to_list_type.dart +++ b/lib/src/animated_grid_to_list_type.dart @@ -34,7 +34,7 @@ extension Render on GridToListType { }) { return !isAnimating ? Wrap( - alignment: WrapAlignment.center, + alignment: itemBuilder.wrapAlignment, spacing: spacing, children: [ for (int i = 0; i < itemBuilder.itemCount; i++) ...[ @@ -73,7 +73,9 @@ extension Render on GridToListType { width: boxWidth ?? itemBuilder.listItemSize.width, height: boxHeight ?? itemBuilder.listItemSize.height, child: GestureDetector( - child: itemBuilder.listItemBuilder(context, tappedItem!), + child: itemBuilder.animatedItemBuilder != null + ? itemBuilder.animatedItemBuilder!(context, tappedItem!) + : itemBuilder.listItemBuilder(context, tappedItem!), ), ), ); diff --git a/pubspec.yaml b/pubspec.yaml index cf935c0..b4e280c 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -2,7 +2,7 @@ name: flutter_grid_to_list description: A new Flutter project. publish_to: "none" -version: 1.0.0+1 +version: 0.0.2+1 environment: sdk: ">=2.19.3 <3.0.0"