blur

Description:

blur

blur #
Blur is a wrapper widget that blur it's child. There are ImageBlur.asset and ImageBlur.network that blur the image. Frost is another wrapper which blurs the background.
Getting Started #
To use this package, add blur as a dependency in your pubspec.yaml file.

Add dependency #
dependencies:
blur: ^4.0.0
copied to clipboard
Import #
import 'package:blur/blur.dart'
copied to clipboard
Usage #
Blur(
blur: 2.5,
blurColor: Theme.of(context).primaryColor,
child: Padding(
padding: EdgeInsets.all(8.0),
child: Text(
'Blur',
style: Theme.of(context).textTheme.headline3,
),
),
),
copied to clipboard
Output #

Normal Image #

Using extensions #
Input #
Image.asset('assets/cat.png').blurred(
colorOpacity: 0.2,
borderRadius: BorderRadius.horizontal(right: Radius.circular(20)),
blur: blurValue,
overlay: Text(
'Cat',
style: theme.textTheme.headline2!.copyWith(color: theme.scaffoldBackgroundColor),
),
),
copied to clipboard
Output #

Frost #
Stack(
alignment: Alignment.center,
children: [
Image.asset(
'assets/cat.png',
scale: 3.5,
),
Text(
'Frost',
style: theme.textTheme.headline4,
).frosted(
blur: blurValue,
borderRadius: BorderRadius.circular(20),
padding: EdgeInsets.all(8),
),
],
),
copied to clipboard