Flutter 英雄动画不起作用,相同的标签但在新屏幕中仍然没有动画

时间:2021-06-06 05:44:55

标签: flutter dart flutter-animation

我的下载屏幕中有内存图像作为网格图块,当点击时,它会动画到下一个完整图像视图页面,其中整个身体是图像视图,所以我想用英雄动画动画到新屏幕,但它不起作用。 我什至提供了相同的标签,但仍然没有动画。

问题是它与 Navigator.push 方法一起工作,但在这里我使用 Get.toNamed() 方法,因为我将参数传递给下一个屏幕控制器类,但使用此导航它没有动画。 Getx导航怎么做英雄动画?

下载.dart

class Downloads extends StatelessWidget {
final photos = DatabaseProvider.db.getPictures();

@override
Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(
    title: brandName('Down', 'loads'),
    elevation: 0.0,
  ),
  body: FutureBuilder<List<Picture>>(
    future: photos,
    builder: (BuildContext context, AsyncSnapshot<List<Picture>> snapshot) {
      if (snapshot.hasData) {
        if (snapshot.data.length == 0) {
          return Center(
              child: Text(
            'No data available for downloads',
            textAlign: TextAlign.center,
            style: TextStyle(fontWeight: FontWeight.w300, fontSize: 18),
          ));
        } else {
          return AnimationLimiter(
            child: GridView.count(
              shrinkWrap: true,
              padding: EdgeInsets.symmetric(horizontal: 20, vertical: 24),
              physics: BouncingScrollPhysics(
                  parent: AlwaysScrollableScrollPhysics()),
              crossAxisCount: 2,
              childAspectRatio: 0.6,
              mainAxisSpacing: 10.0,
              crossAxisSpacing: 10.0,
              children: snapshot.data.map((wallpaper) {
                return AnimationConfiguration.staggeredGrid(
                  position: 2,
                  duration: Duration(milliseconds: 500),
                  columnCount: 3,
                  child: ScaleAnimation(
                    duration: Duration(milliseconds: 900),
                    curve: Curves.fastLinearToSlowEaseIn,
                    scale: 1.5,
                    child: FadeInAnimation(
                      child: GridTile(
                        child: GestureDetector(
                          onTap: () {
                             Get.toNamed(
                                   '/image_view',
                              arguments: [
                              wallpapers[index].src.portrait,
                              wallpapers[index].photographer,
                               wallpapers[index].photographerUrl
                         ],
                       );
                          },
                          child: Container(
                            child: ClipRRect(
                              borderRadius: BorderRadius.circular(16),
                              child: Hero(
                                tag: 'picture:${wallpaper.imageUrl}',
                                child: Image.memory(
                                  wallpaper.picture,
                                  fit: BoxFit.cover,
                                ),
                              ),
                            ),
                          ),
                        ),
                      ),
                    ),
                  ),
                );
              }).toList(),
            ),
          );
        }
      } else {
        return Center(child: CircularProgressIndicator());
      }
    },
  ),
);
}
}

imageVeiw.dart

 class LocalImageView extends StatelessWidget {
 final Uint8List pictureBytes;
 final String imageUrl;
 final String title;

 LocalImageView({this.pictureBytes, this.imageUrl, this.title});

 @override
 Widget build(BuildContext context) {
print(imageUrl);
return Container(
  child: LayoutBuilder(
    builder: (context, constraints) => SingleChildScrollView(
      reverse: true,
      scrollDirection: Axis.horizontal,
      child: SizedBox(
        height: constraints.biggest.height,
        child: Hero(
          tag: 'picture:$imageUrl',
          child: Image.memory(
            pictureBytes,
            fit: BoxFit.cover,
          ),
        ),
      ),
    ),
  ),
);
}
}

0 个答案:

没有答案