Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update examples (blurhash) #31

Open
sischnei opened this issue Oct 16, 2023 · 4 comments
Open

Update examples (blurhash) #31

sischnei opened this issue Oct 16, 2023 · 4 comments

Comments

@sischnei
Copy link

It seems blurhash has been removed - but the first example in the documentation still showcases how to use it:

OctoImage(
  image: CachedNetworkImageProvider(
      'https://blurha.sh/assets/images/img1.jpg'),
  placeholderBuilder: OctoPlaceholder.blurHash(
    'LEHV6nWB2yk8pyo0adR*.7kCMdnj',
  ),
  errorBuilder: OctoError.icon(color: Colors.red),
  fit: BoxFit.cover,
);

Yet there is no OctoPlacholder.blurHash(...) method anymore. Please update the examples!

@maskeyp
Copy link

maskeyp commented Oct 17, 2023

same .blurHash is not defined

@maskeyp
Copy link

maskeyp commented Oct 17, 2023

/// Simple set to show [OctoPlaceholder.circularProgressIndicator] as
/// placeholder and [OctoError.icon] as error.
OctoSet blurHash(
String hash, {
BoxFit? fit,
Text? errorMessage,
}) {
return OctoSet(
placeholderBuilder: blurHashPlaceholderBuilder(hash, fit: fit),
errorBuilder: blurHashErrorBuilder(hash, fit: fit),
);
}

OctoPlaceholderBuilder blurHashPlaceholderBuilder(String hash, {BoxFit? fit}) {
return (context) => SizedBox.expand(
child: Image(
image: BlurHashImage(hash),
fit: fit ?? BoxFit.cover,
),
);
}

OctoErrorBuilder blurHashErrorBuilder(
String hash, {
BoxFit? fit,
Text? message,
IconData? icon,
Color? iconColor,
double? iconSize,
}) {
return OctoError.placeholderWithErrorIcon(
blurHashPlaceholderBuilder(hash, fit: fit),
message: message,
icon: icon,
iconColor: iconColor,
iconSize: iconSize,
);
}

is this the way?

@mpastewski
Copy link

mpastewski commented Nov 16, 2023

I'm also using OctoImage with blurHash and it works great for ^1.0.2. It'd be great if you could document how to migrate to ^2.0.0 and overcome this.

@Mezmeraid
Copy link

Mezmeraid commented Nov 22, 2023

For those interested, I fixed on my side by introducing this class :

class OctoBlurHashFix {
  static OctoPlaceholderBuilder placeHolder(String hash, {BoxFit? fit}) {
    return (context) => SizedBox.expand(
      child: Image(
        image: BlurHashImage(hash),
        fit: fit ?? BoxFit.cover,
      ),
    );
  }

  static OctoErrorBuilder error(
      String hash, {
        BoxFit? fit,
        Text? message,
        IconData? icon,
        Color? iconColor,
        double? iconSize,
      }) {
    return OctoError.placeholderWithErrorIcon(
      placeHolder(hash, fit: fit),
      message: message,
      icon: icon,
      iconColor: iconColor,
      iconSize: iconSize,
    );
  }
}

Then, replace your usages of OctoError.blurhash and OctoPlaceholder.blurhash :

OctoImage(
    colorBlendMode: BlendMode.modulate,
    fit: BoxFit.cover,
    image: CachedNetworkImageProvider(imageUrl),
    placeholderBuilder: OctoBlurHashFix.placeHolder(placeHolderBlurHashString),
    errorBuilder: OctoBlurHashFix.error(errorBlurHashString, iconColor: Colors.transparent),
 ),

You may also have to add the blurhash dependency
flutter_blurhash: ^0.8.2

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants