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
528 stars 66 forks source link

Blurhash octoimage bug #66

Open Shafinmohd opened 9 months ago

Shafinmohd commented 9 months ago

Code snippet

`import 'package:cached_network_image/cached_network_image.dart'; import 'package:flutter/material.dart'; import 'package:instagram/presentation/widgets/global/others/play_this_video.dart'; // ignore: depend_on_referenced_packages import 'package:octo_image/octo_image.dart';

class NetworkDisplay extends StatefulWidget { final int cachingHeight, cachingWidth; final String url, blurHash; final double aspectRatio; final bool isThatImage; final double? height; final double? width;

const NetworkDisplay({ Key? key, required this.url, this.isThatImage = true, this.cachingHeight = 720, this.cachingWidth = 720, this.height, this.width, this.blurHash = "", this.aspectRatio = 0.0, }) : super(key: key);

@override State createState() => _NetworkDisplayState(); }

class _NetworkDisplayState extends State { @override void initState() { super.initState(); }

@override void didChangeDependencies() { if (widget.isThatImage && widget.url.isNotEmpty) { precacheImage(NetworkImage(widget.url), context); } super.didChangeDependencies(); }

@override Widget build(BuildContext context) { return widget.aspectRatio == 0 ? whichBuild(height: null) : aspectRatio(); }

Widget aspectRatio() { return AspectRatio( aspectRatio: widget.aspectRatio, child: whichBuild(), ); }

Widget whichBuild({double? height = double.infinity}) { return !widget.isThatImage ? PlayThisVideo( play: true, videoUrl: widget.url, blurHash: widget.blurHash, ) : buildOcto(height); }

Widget buildOcto(height) { int cachingHeight = widget.cachingHeight; int cachingWidth = widget.cachingWidth; if (widget.aspectRatio != 1 && cachingHeight == 720) cachingHeight = 960; return OctoImage( image: CachedNetworkImageProvider(widget.url, maxWidth: cachingWidth, maxHeight: cachingHeight), errorBuilder: (context, url, error) => buildError(), fit: BoxFit.cover, width: widget.width ?? double.infinity, height: widget.height ?? height, placeholderBuilder: widget.blurHash.isNotEmpty ? OctoImage.blurHash(widget.blurHash, fit: BoxFit.cover) : (context) => Center(child: loadingWidget()), ); }//Error is over here (Attached screenshot) Screenshot (129)

SizedBox buildError() { return SizedBox( width: double.infinity, height: widget.aspectRatio, child: Icon(Icons.warning_amber_rounded, size: 30, color: Theme.of(context).focusColor), ); }

Widget loadingWidget() { double aspectRatio = widget.aspectRatio; return aspectRatio == 0 ? buildSizedBox() : AspectRatio( aspectRatio: aspectRatio, child: buildSizedBox(), ); }

Widget buildSizedBox() { return Container( width: double.infinity, color: Theme.of(context).textTheme.bodyMedium!.color, child: Center( child: CircleAvatar( radius: 57, backgroundColor: Theme.of(context).textTheme.bodySmall!.color, child: Center( child: CircleAvatar( radius: 56, backgroundColor: Theme.of(context).textTheme.bodyMedium!.color, )), )), ); } } `

insan2001 commented 8 months ago

I think you are trying to use octo_image: ^2.0.0 and didn't import it. See the documentation here.