There are some use-cases where it is useful to perform encoding on the device, e.g. when sending large images using e2e encryption.

Adding encoding to this package would support that use case without including another dependency. I'm not too familiar with the BlurHash algorithm but I suspect this wouldn't add much code to the implementation.

For reference, here's the blurhash_dart implementation, which itself has no dependencies: https://github.com/justacid/blurhash-dart/blob/master/lib/src/blurhash.dart#L70

First of all thank you for introducing us Flutter community with this great tool. It is a game changer. For this to reach to broader developers I think we should be able to encode the image to it's corresponding blurhash string. Are you planning on writing a function which does this on the client. This way we can upload the image along with the blurhash to Firestore and Firebase Storage at the same time. People might not be using server side code(cloud functions) since they will bring extra pricing/delay/performance issues. If this is not a good way, then I hope someone would show an cloud function example in type script.

As we discussed it with Rene at https://github.com/Baseflow/flutter_cached_network_image/issues/386, there is no need to depend on image for the conversion of pixel data to image, the Skia inside the Flutter framework can do it directly. These are the necessary changes. It works on mobile, I still have some problems on Flutter Web (it looks like ui.decodeImageFromPixels() simply never returns), so expect more to come.

Sorry for the inclusion of class Style, I don't know how Android Studio pulled that off. I simply forked, modified, committed and pushed. :-)

Hello. Very nice package, but it is not working on web even stated so in https://pub.dev/packages/flutter_blurhash

I noticed you closed an issue 20 days ago about this, but not before fooling a lot around with the package as it was supposed to work on web.

Could you remove the web compability notice on the package listing until the flutter web framework is compatible....?

If you run into an exception trying to download the image (e.g. connection timeout due to bad connection) a red cross with the error message will be shown ontop of the blurhash image. Currently there is no way to disable this behaviour (I'd rather stick with the blur hash over having this ugly cross) or to set a custom error image.

Temporary workaround for https://github.com/flutter/flutter/issues/45190

On the web, there are various issues with Skia async functions no returning. As I mentioned in that thread, I suspect the HtmlCodec to be at fault. Until such time as this is fixed, I present the following workaround: on Flutter Web, we can create a BMP image on the fly. Considering the small size of the blurhash image, there is really no need for the compression that PNG or JPG could provide, so this is the cheapest temporary solution.

Using your exemple project with flutter_blurhash: ^0.4.0, I can't compile on Android :

Compiler message:
/C:/ProgramData/Flutter/.pub-cache/hosted/pub.dartlang.org/flutter_blurhash-0.4.0/lib/src/blurhash_image.dart:76:10: Error: The method 'objectRuntimeType' isn't defined for the class 'BlurHashImage'.
 - 'BlurHashImage' is from 'package:flutter_blurhash/src/blurhash_image.dart' ('/C:/ProgramData/Flutter/.pub-cache/hosted/pub.dartlang.org/flutter_blurhash-0.4.0/lib/src/blurhash_image.dart').
Try correcting the name to the name of an existing method, or defining a method named 'objectRuntimeType'.
      '${objectRuntimeType(this, 'BlurHashImage')}(${describeIdentity(blurHash)}, scale: $scale)';
         ^^^^^^^^^^^^^^^^^
Target kernel_snapshot failed: Exception: Errors during snapshot creation: null
build failed.

FAILURE: Build failed with an exception.

Any idea how to fix this ?

After Upgrading from 0.6.4 to 0.6.6,

I noticed huge lag while scrolling into multiple images that use BlurHash as loading widget.

I also noticed significant memory consumption and multiple _spawn stacks being generated.

Reverting back to 0.6.4 fixes the issue.

Hi, and thank u for such a good library!

In my case image on server protected by auth token which should be passed in the Header. Since blurhash used Image.network under the hood now it is impossible to pass token.

Seems like to reach this goal at the BlurHashState.prepareDisplayedImage instead of Image.network we need use:

Image(
    image: NetworkImage(
    imagePath,
    headers: {
      HttpHeaders.authorizationHeader: 'token',
    },
),

Let me know what u thinking and i can help with implementation

I am using blurha.sh as mentioned on documentation. While using PNG image, hash effect is still visible on background,

Top image is using BlurHash and bottom one using Image.network. For some images I like this effect but for some not. How can get the original image after loading like Image.network.

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  final imageUrl =
      "https://flutter.dev/assets/images/homepage/garden-logos-color/google.png";
  final hash =
      "rOByL6JFEoCA,koaRX\$IS~X8kFo#jXfnf*adf,fP0yxC\${+[I^W=otNarqogkEbdbHfRjXW9jDacj]bcoLjXWVjXW,b0WCs;W.jZWqnzWAjXacjr";

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        AspectRatio(
          key: const ValueKey("GBH"),
          aspectRatio: 200 / 67,
          child: BlurHash(
            hash: hash,
            image: imageUrl,
            color: Colors.green,
          ),
        ),
        Image.network(
          imageUrl,
          key: const ValueKey("GMN"),
        )
      ],
    );
  }
}

[√] Flutter (Channel stable, 2.5.3, on Microsoft Windows [Version
    10.0.19043.1348], locale en-US)
    • Flutter version 2.5.3 at C:\Tools\flutter
    • Upstream repository https://github.com/flutter/flutter.git      
    • Framework revision 18116933e7 (4 weeks ago), 2021-10-15 10:46:35      -0700
    • Engine revision d3ea636dc5
    • Dart version 2.14.4

When read blur hash widget, there is error as below: ════════ Exception caught by scheduler library ═════════════════════════════════ The following assertion was thrown during a scheduler callback: Assertion failed: org-dartlang-sdk:///flutter_web_sdk/lib/_engine/engine/canvaskit/skia_object_cache.dart:248:12 !browserSupportsFinalizationRegistry is not true

Doctor summary (to see all details, run flutter doctor -v): [✓] Flutter (Channel master, 2.6.0-6.0.pre.146, on macOS 11.0.1 20B29 darwin-x64, locale zh-Hant-TW) [!] Android toolchain - develop for Android devices (Android SDK version 29.0.3) ✗ cmdline-tools component is missing Run path/to/sdkmanager --install "cmdline-tools;latest" See https://developer.android.com/studio/command-line for more details. ✗ Android license status unknown. Run flutter doctor --android-licenses to accept the SDK licenses. See https://flutter.dev/docs/get-started/install/macos#android-setup for more details. [✓] Xcode - develop for iOS and macOS (Xcode 12.5.1) [✓] Chrome - develop for the web [✓] Android Studio (version 3.6) [✓] VS Code (version 1.60.1) [✓] Connected device (1 available)

We need colorBlendMode in order to build optimized apps and avoid using Opacity Widget above it

https://docs.flutter.dev/perf/ui-performance#identifying-problems-in-the-gpu-graph

Remote resource to download image is very specific way to use BlurHash widget. Images could be loaded in many different ways using different protocols. Could be nice to make BlurHash widget universal.

Hi friends,

I have an issue with flutter_blurhash, how to get the hash code from an image in Flutter? I can't find any details for this :(

Thanks in advance!

Because Image widget in buildBlurHashBackground does not have errorBuilder, its causing the framework to throw errors as per issues:

1. https://github.com/fluttercommunity/flutter_blurhash/issues/46
2. https://github.com/fluttercommunity/flutter_blurhash/issues/40

Since buildBlurHashBackground is widget function instead of stateless widget this made it even harder to trace where the error is coming from.

Which was pointing to Flutter image widget only, which I think it should include buildBlurHashBackground too.

Please Refer to:

Stackoverflow

Flutter issue 19269

If you look at flutter image widget at image.dart line 1141:

assert(() {
  if (widget.errorBuilder == null) {
    // ignore: only_throw_errors, since we're just proxying the error.
    throw error; // Ensures the error message is printed to the console.
  }
  return true;
}());

Long story short:

Your code does not produce this error, our code does. Your code only does not enable us to handle it.

Kindly merge this.

Thanks,

I know this is a duplicated issue.

Please consider a fix. Its causing headache while in development (non fatal exception). As well as in production it's sending so many reports to Crashlytics.

Non-fatal Exception: io.flutter.plugins.firebase.crashlytics.FlutterError: Bad state: Cannot clone a disposed image.
The clone() method of a previously-disposed Image was called. Once an Image object has been disposed, it can no longer be used to create handles, as the underlying data may have been released.. Error thrown Instance of 'ErrorDescription'.
       at Image.clone(Image.java)
       at ImageInfo.clone(image_stream.dart:51)
       at ImageStreamCompleter.setImage(image_stream.dart:635)Ï