Skip to content

Instantly share code, notes, and snippets.

@flar
Created July 11, 2020 00:45
Show Gist options
  • Save flar/1019ddb4e9c8d8a42370071b79f98426 to your computer and use it in GitHub Desktop.
Save flar/1019ddb4e9c8d8a42370071b79f98426 to your computer and use it in GitHub Desktop.
Effect of filtering an image with different BoxFit settings
import 'dart:ui';
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Material App',
theme: ThemeData.dark(),
home: Home(),
);
}
}
class Home extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Material App Bar'),
),
body: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget> [
BlurredImage(BoxFit.cover),
BlurredImage(BoxFit.contain),
],
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.adb),
onPressed: () {},
),
);
}
}
class BlurredImage extends StatelessWidget {
BlurredImage(this._fit);
final BoxFit _fit;
@override
Widget build(BuildContext context) {
return Center(
child: Container(
child: ImageFiltered(
imageFilter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
child: Container(
decoration: BoxDecoration(color: Colors.black.withOpacity(0.5)),
child: Image.network(
'https://i.imgur.com/QCNbOAo.png',
height: 200,
width: 200,
fit: _fit,
),
),
),
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment