fluttercommunity / flutter_blurhash

Compact representation of a placeholder for an image. Encode a blurry image under 30 caracters for instant display like used by Medium. Maintainer: @Solido
https://pub.dev/packages/flutter_blurhash
MIT License
513 stars 65 forks source link

Background issue on PNG image #35

Closed yeasin50 closed 2 years ago

yeasin50 commented 2 years ago

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

image

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
romatallinn commented 2 years ago

Yeah, same here. I think there should be an option to remove the blur when image is loaded.

Solido commented 2 years ago

Hi, onDisplayed() event is now accessible in the last update so you adjust your display.

ishafiul commented 5 months ago

Can someone give me an idea of how to remove a hashed image with the onDisplayed() event?