Search packages, repositories and app categories

GitHub repositoryyasinarik/flutter_pro_animated_blur

flutter_pro_animated_blur

yasinarik/flutter_pro_animated_blur open-source repository details.

flutter_pro_animated_blur project cover
Stars
12
Forks
0
Last push (UTC)
Apr 15, 2022
Project status
Active

Original README

English project snapshot. Visit GitHub 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

Yasin Arık GitHub avatar
GitHub author

Yasin Arık ↗

Software Engineer | Flutter | Product Engineering | Supabase | Postgres | Firebase | GraphQL ...also a Mechanical Engineer

Delivery Hero | TalabatDubai, UAEOfficial website ↗
LanguagesDart

Packages published by this repository

Dependencies used

Dependency list 3 items

  • flutter{"sdk":"flutter"}
  • flutter_testDevelopment{"sdk":"flutter"}
  • flutter_lintsDevelopment^1.0.0

How do I choose a repository?

Start with your use case, compare repository activity, and check the original project before adopting it.

  1. Search by repository name, owner or description, then narrow the results by topic.
  2. Compare stars, forks and recent pushes. Stars show community interest, not a guarantee of quality.
  3. Read the README, license and issues on GitHub before using a project.

Sources and maintenance

“A repository is the most basic element of GitHub.”

GitHub Docs — About repositories ↗