Simple sliver that spin when moving out from leading edge of viewport.
For using you have to place this widget in scrollable area. It may look like:
class DemoScreen extends StatelessWidget {
static const urls = <String>[
'https://www.stockvault.net/data/2018/12/30/258501/preview16.jpg',
'https://www.stockvault.net/data/2010/10/01/115175/preview16.jpg',
'https://www.stockvault.net/data/2011/04/18/122242/preview16.jpg',
'https://www.stockvault.net/data/2014/03/26/155336/preview16.jpg',
'https://www.stockvault.net/data/2018/12/30/258501/preview16.jpg',
'https://www.stockvault.net/data/2010/10/01/115175/preview16.jpg',
'https://www.stockvault.net/data/2011/04/18/122242/preview16.jpg',
'https://www.stockvault.net/data/2014/03/26/155336/preview16.jpg',
'https://www.stockvault.net/data/2018/12/30/258501/preview16.jpg',
'https://www.stockvault.net/data/2010/10/01/115175/preview16.jpg',
'https://www.stockvault.net/data/2011/04/18/122242/preview16.jpg',
'https://www.stockvault.net/data/2014/03/26/155336/preview16.jpg',
];
const DemoScreen({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
body: CustomScrollView(
slivers: urls
.map(
(url) =>
Spinner(
child: ClipRRect(
borderRadius: BorderRadius.circular(20),
child: Image.network(
url,
fit: BoxFit.cover,
height: 300,
),
),
),
)
.toList(),
),
);
}
}