Hero works great! except with text
You can watch the 1 minute YouTube demo on the documentation:
There's also a full page that goes in-depth about the topic: https://flutter.dev/docs/development/ui/animations/hero-animations
But for basic use cases, you can simply take a look at the snippets below:
With an image
In the main list view:
leading: Hero(
tag: 'thumbnail' + youtuberId.toString(),
child: Image.network(youtuberInfo.thumbnailUrl),
),
In the details page, I can even use clipping:
Hero(
tag: 'thumbnail' + youtuberInfo.id.toString(),
child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(16)),
child: Image.network(youtuberInfo.thumbnailUrl),
)),
Text
With text it should be simple but it's really not. There has been a long standing issue that makes text turn red and flicker during the animation. See this issue from end of 2017: https://github.com/flutter/flutter/issues/12463.
Hopefully it'll be fixed soon. You can check the latest status on this issue at https://github.com/flutter/flutter/issues/36220.