Skip to content

Instantly share code, notes, and snippets.

@Br0wnZ
Last active January 25, 2023 09:09
Show Gist options
  • Save Br0wnZ/85c8bfd23bcd2244a4213a3792443529 to your computer and use it in GitHub Desktop.
Save Br0wnZ/85c8bfd23bcd2244a4213a3792443529 to your computer and use it in GitHub Desktop.
Image with backdrop shadow and loading handler
import 'dart:ui';
import 'package:flutter/material.dart';
class CustomImage extends StatelessWidget {
final String image;
const CustomImage({super.key, required this.image});
@override
Widget build(BuildContext context) {
return Stack(
children: [
Opacity(
opacity: .5,
child: Image.network(
image,
color: Colors.black,
),
),
ClipRect(
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 5.0, sigmaY: 5.0),
child: Image.network(
image,
loadingBuilder: (BuildContext context, Widget child,
ImageChunkEvent? loadingProgress) {
if (loadingProgress == null) {
return child;
}
return Center(
child: CircularProgressIndicator(
value: loadingProgress.expectedTotalBytes != null
? loadingProgress.cumulativeBytesLoaded /
loadingProgress.expectedTotalBytes!
: null,
),
);
},
frameBuilder: (BuildContext context, Widget child, int? frame,
bool wasSynchronouslyLoaded) {
if (wasSynchronouslyLoaded) {
return child;
}
return AnimatedOpacity(
opacity: frame == null ? 0 : 1,
duration: const Duration(seconds: 1),
curve: Curves.easeOut,
child: child,
);
},
),
),
)
]);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment