heroProperties property

List<ImageGalleryHeroProperties>? heroProperties

The parameters required to initialise the hero animations. Can be sent as a list for a gallery view ui that displays more than one image before opening the fullscreen gallery.

final assets = const [
  Image(image: AssetImage('assets/1.jpeg')),
  Image(image: AssetImage('assets/2.jpeg')),
  Image(image: AssetImage('assets/3.jpeg')),
  Image(image: AssetImage('assets/4.jpeg')),
];
class ImageGalleryExamplesPage extends StatefulWidget {
  ImageGalleryExamplesPage({Key? key, required this.title}) : super(key: key);
  final String title;
  @override
  _ImageGalleryExamplesPageState createState() =>
      _ImageGalleryExamplesPageState();
}
class _ImageGalleryExamplesPageState extends State<ImageGalleryExamplesPage> {
  final heroProperties = [
    ImageGalleryHeroProperties(tag: 'imageId1'),
    ImageGalleryHeroProperties(tag: 'imageId2'),
  ];
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        padding: EdgeInsets.all(16.0),
        child: ListView(
          children: [
            Text('Hero Animation Example'),
            Row(
              children: [
                Expanded(
                  child: InkWell(
                    onTap: () => SwipeImageGallery(
                      context: context,
                      children: [assets[0], assets[1]],
                      heroProperties: heroProperties,
                    ).show(),
                    child: Hero(
                      tag: 'imageId1',
                      child: Image(
                        image: AssetImage('assets/1.jpeg'),
                      ),
                    ),
                  ),
                ),
                Expanded(
                  child: InkWell(
                    onTap: () => SwipeImageGallery(
                      context: context,
                      children: [assets[0], assets[1]],
                      initialIndex: 1,
                      heroProperties: heroProperties,
                    ).show(),
                    child: Hero(
                      tag: 'imageId2',
                      child: Image(
                        image: AssetImage('assets/2.jpeg'),
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}

Implementation

/// class ImageGalleryExamplesPage extends StatefulWidget {
///   ImageGalleryExamplesPage({Key? key, required this.title}) : super(key: key);
///   final String title;

///   @override
///   _ImageGalleryExamplesPageState createState() =>
///       _ImageGalleryExamplesPageState();
/// }

/// class _ImageGalleryExamplesPageState extends State<ImageGalleryExamplesPage> {
///   final heroProperties = [
///     ImageGalleryHeroProperties(tag: 'imageId1'),
///     ImageGalleryHeroProperties(tag: 'imageId2'),
///   ];

///   @override
///   Widget build(BuildContext context) {
///     return Scaffold(
///       body: Container(
///         padding: EdgeInsets.all(16.0),
///         child: ListView(
///           children: [
///             Text('Hero Animation Example'),
///             Row(
///               children: [
///                 Expanded(
///                   child: InkWell(
///                     onTap: () => SwipeImageGallery(
///                       context: context,
///                       children: [assets[0], assets[1]],
///                       heroProperties: heroProperties,
///                     ).show(),
///                     child: Hero(
///                       tag: 'imageId1',
///                       child: Image(
///                         image: AssetImage('assets/1.jpeg'),
///                       ),
///                     ),
///                   ),
///                 ),
///                 Expanded(
///                   child: InkWell(
///                     onTap: () => SwipeImageGallery(
///                       context: context,
///                       children: [assets[0], assets[1]],
///                       initialIndex: 1,
///                       heroProperties: heroProperties,
///                     ).show(),
///                     child: Hero(
///                       tag: 'imageId2',
///                       child: Image(
///                         image: AssetImage('assets/2.jpeg'),
///                       ),
///                     ),
///                   ),
///                 ),
///               ],
///             ),
///           ],
///         ),
///       ),
///     );
///   }
/// }
/// ```
final List<ImageGalleryHeroProperties>? heroProperties;