Dart library with stack blur algorithm for RGBA images

Overview

Generic badge Pub Package pub points

stack_blur

The Dart library for blurring images with the Stack blur algorithm.

The Stack blur works fast and looks good. It is a compromise between Gaussian blur and Box blur.

This library modifies a raw buffer containing RGBA pixels. This is "low-level", but universal and does not impose external dependencies.

Use with image library

import 'dart:io';

import 'package:image/image.dart';
import 'package:stack_blur/stack_blur.dart';

void main() {
  // loading image from file
  final image = decodeImage(File('source.png').readAsBytesSync())!;
  Uint32List rgbaPixels = image.data;

  // blurring image pixels with blur radius 42
  stackBlurRgba(rgbaPixels, image.width, image.height, 42);

  // saving image to file
  File('blurred.png').writeAsBytesSync(encodePng(image));
}

Use with Flutter and bitmap library

Flutter images have the same RGBA pixel buffer. You can get it in a rather non-obvious way through ImageStreamListener.

import 'dart:ui' as ui;
import 'package:flutter/material.dart';
import 'package:bitmap/bitmap.dart';

Future<Image> blurAsset(String assetName) async {
  ImageProvider provider = ExactAssetImage(assetName);

  // Rain dance to get RGBA pixels from image
  final ImageStream stream = provider.resolve(ImageConfiguration.empty);
  final completer = Completer<ui.Image>();
  late ImageStreamListener listener;
  listener = ImageStreamListener((frame, _) {
    stream.removeListener(listener);
    completer.complete(frame.image);
  });
  stream.addListener(listener);
  ui.Image image = await completer.future;
  ByteData rgbaData = (await image.toByteData(format: ui.ImageByteFormat.rawRgba))!;

  // This is the pixels we need
  Uint32List rgbaPixels = rgbaData.buffer.asUint32List();

  // We can blur the image buffer
  stackBlurRgba(rgbaPixels, image.width, image.height, 42);

  // We need a third-party 'bitmap' library to turn the buffer into a widget
  final bitmap = Bitmap.fromHeadless(
      image.width, image.height,
      rgbaPixels.buffer.asUint8List());
  return Image.memory(bitmap.buildHeaded());
}
You might also like...

Full Stack Instagram Clone made with ❤ using Flutter & Firebase.

Full Stack Instagram Clone made with ❤ using Flutter & Firebase.

Instagram Clone Full Stack Instagram Clone made with ❤ using Flutter & Firebase. Click on the link below to view the Overview video by Tushar Khatri.

Oct 22, 2022

Caffodils - Download everything | Flutter app for Android and IOS. Download Video, Reels, Shorts, Music, Images, Files from Instagram, Facebook and Youtube

caffodils Caffodils - Download everything Flutter app for Android and IOS. Download Video, Reels, Shorts, Music, Images, Files from Instagram, Faceboo

Oct 24, 2022

Crop and Rotate Images using this Flutter plugin

Crop and Rotate Images using this Flutter plugin

image_cropping This plugin supports cropping and rotating images for multiplatform. It Allow inclusion of background, Rotation of image, changing rati

Nov 20, 2022

Mobile app to square images by adding padding around it.

Resizrr Mobile app to crop images. Screens 📐 How to set-up this project on local machine? Fork this project Then clone the forked project by git clon

Oct 23, 2022

A social media app where people can post images, follow users ,chat with other users and much more.

A social media app  where people can post images, follow users ,chat with other users and much more.

Nallagram A Social media app (Both frontend and backend) created with Flutter and Firebase.(inspired from instagram) Show some ❤️ and star ⭐ the repo

Jan 6, 2023

Images gathered by NASA's Curiosity, Opportunity, and Spirit rovers on Mars.

Images gathered by NASA's Curiosity, Opportunity, and Spirit rovers on Mars.

Eye of rover This app includes image data gathered by NASA's Curiosity, Opportunity, and Spirit rovers on Mars with given filters (Sol and Camera). Lo

Jan 6, 2022

A plugin for panning and zooming images by touch.

A plugin for panning and zooming images by touch.

zoomable_image A dart+flutter package for panning and zooming images by touch. Getting Started // You can use any ImageProvider, including NetworkImag

Dec 27, 2022

We are building an open database of COVID-19 cases with chest X-ray or CT images.

We are building an open database of COVID-19 cases with chest X-ray or CT images.

🛑 Note: please do not claim diagnostic performance of a model without a clinical study! This is not a kaggle competition dataset. Please read this pa

Jan 7, 2023

A chatting app made with Flutter and FireBase. It supports GIPHY gifs, images, stcikers, dark mode, custom animations, google login, online storage, beautiful UI and more.

A chatting app made with Flutter and FireBase. It supports GIPHY gifs, images, stcikers, dark mode, custom animations, google login, online storage, beautiful UI and more.

ChatMe A Flutter based chatting app which lets user chat from random peoples or strangers, has GIPHY gif support, sitckers, custom animations, dark mo

Nov 7, 2022
Flutter - Blur Widgets - BackdropFilter Widget

blur_widgets Flutter - Blur Widgets - BackdropFilter Widget. Screenshot: Getting Started This project is a starting point for a Flutter application. A

Ulfhrafn 3 Dec 4, 2022
Dart package to rank proposals according to Majority Judgment, using a score-based algorithm for performance and scalability

Majority Judgment for Dart This Dart package helps to resolve polls using Majority Judgment. Features Efficient Majority Judgment algorithm, scales we

Mieux Voter 1 Oct 18, 2021
Algorithm for choosing the best seats in a cinema. Made in dart.

Buy movie tickets algorithm This dart project contains an algorithm to choose the better seats on the cinema. Also contains a bot to buy movie tickets

Chris Chávez 1 Dec 2, 2021
Algorithm Toolbox is an Android app for C++, Python and DART algorithms. It shows the codes as well as its explanation with various examples.

AlgoKing Algorithm Toolbox is an Android app for C++, Python and DART algorithms. It shows the codes as well as its explanation with various examples.

Hash Studios 5 Sep 13, 2022
AES 256 GCM encryption algorithm in Dart

aes-256-gcm-dart AES 256 GCM encryption algorithm in Dart Use var text = 'SOME D

Swifty 8 Nov 11, 2022
A Flutter ListView that implicitly calculates the changes between two lists using the MyersDiff algorithm and animates between them for you

A Flutter ListView that implicitly calculates the changes between two lists using the MyersDiff algorithm and animates between them for you

Vojtech Pavlovsky 2 Dec 16, 2022
🚀 Full-Stack Flutter application, encoded using Dart. Utilizes native device features 📷 and stores user data on a local SQFLite database. ✔

great_places_app A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started

Soumyadeep Das 2 Jan 24, 2022
🌍 Full-stack travel app using Flutter, Dart and Geolocation service. Map updates 🗺 along with map markers based on location filters 📌

Tripscape ?? Built With Frontend Flutter Dart Backend & Libraries Geolocator Google Maps Flutter Provider API Places API Google Maps API Places Autoco

Soumyadeep Das 3 Nov 23, 2022
This is an interactive roadmaps/full stack curriculum app created for new programmers and enthusiasts.

Eduance This is an educational app created by Gokul Eswaran and Kiran Vishwak for the national level Hackathon TekSpark'21 on 27/10/2021 hosted by Kar

Gokul Eswaran 3 Feb 4, 2022
Full Stack Mobile Chat App - Built with django, flutter and mongodb

Applied design patterns. Built with django, flutter and mongodb. Mobile messaging application which uses a rest api and web sockets.

Andres Arturo Rodriguez Calderon 35 Nov 26, 2022