Search packages, repositories and app categories

ducafecatFlutter ecosystem guide
pro_animated_blur cover
Package detailsv0.0.2+1

pro_animated_blur

ProAnimatedBlur is a widget that blurs the underlying area of its child widget and it works like AnimatedContainer, AnimatedOpacity

AndroidiOSWebmacOSWindowsLinux
pub.dev API documentation Source code
30-day downloads
6
Likes
72
Pub points
160

Install package

flutter pub add pro_animated_blur

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

ProAnimatedBlur is a Flutter widget that dynamically blurs the content beneath its child, offering smooth transitions similar to AnimatedContainer and AnimatedOpacity. It enables developers to create visually appealing effects by animating blur intensity over time, ideal for overlays, modals, or dynamic UI elements. The widget supports all major platforms including Android, iOS, Web, macOS, Windows, and Linux, ensuring consistent behavior across devices. Built with performance in mind, it integrates seamlessly into existing Flutter apps.

Use cases

  • Creating animated backdrop blur effects
  • Designing floating UI elements with dynamic blur
  • Implementing smooth transitions in modals
  • Enhancing visual depth in layered interfaces
  • Building responsive overlays with blur animation

Key features

  • Smooth blur animation like AnimatedContainer
  • Supports all Flutter platforms
  • Efficient rendering with minimal performance impact
  • Easy integration with existing widgets
  • Customizable blur radius and duration

Suitable for

  • UI designers seeking advanced visual effects
  • Developers building modern, animated interfaces
  • Apps requiring dynamic backdrop blur
  • Teams targeting cross-platform consistency
  • Projects emphasizing visual polish and interactivity

Considerations

  • May impact performance on low-end devices
  • Blur quality depends on device capabilities
  • Requires careful tuning of animation duration
  • Not suitable for high-frequency updates
  • Limited customization beyond blur radius and timing

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

ProAnimatedBlur

  • pub.dev page: https://pub.dev/packages/pro_animated_blur

  • ProAnimatedBlur is a Flutter package that is very similar to other 'Animated' widgets such as AnimatedContainer, AnimatedOpacity, etc. *

  • Animates between different blur properties without needing a dedicated animation controller because it is auto-handled*

  • It blurs the background of the child widget.

Some usecases:

  • When a modal (popup window) is used, wrap the route with ProAnimatedBlur in order to blur the rest of the screen (you can blur the dark shaded dismissible barrier area)
  • Wrap any of your containers to make a frosted glass style.

Features

The example app looks like this:

ProAnimatedBlur_short_gif

Getting started

Add the dependency in pubspec.yaml:

dependencies:
  pro_animated_blur: ^0.0.1

  # It is recommended to use latest version.

Import it:

Now in your Dart code, you can use:

import 'package:pro_animated_blur/pro_animated_blur.dart';

Usage

  return Container(
    clipBehavior: Clip.antiAlias, // Use a clip  option.
    child: ProAnimatedBlur(
      blur: _isBlurred ? 20 : 0,
      duration: Duration(milliseconds: 200),
      curve: Curves.linear,
      child: Container(
        height: 200,
        width: 200,
      ),
    ),
  );

Author

Yasin Arık

Email: [yasin.ariky@gmail.com](mailto:yasin.ariky@gmail.com)

GitHub: github.com/yasinarik

LinkedIn: linkedin.com/in/yasinarik

Categories

Animation & Transition

Source repository

Projects using this package

No data available yet.