Skip to content

Commit

Permalink
Merge pull request #30 from Baseflow/bugfix/remove-blurhash-dependency
Browse files Browse the repository at this point in the history
Removed blurhash dependency
  • Loading branch information
renefloor authored Sep 25, 2023
2 parents e5cff49 + c2a488d commit 09d01c5
Show file tree
Hide file tree
Showing 14 changed files with 204 additions and 187 deletions.
4 changes: 2 additions & 2 deletions .github/workflows/build.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -35,8 +35,8 @@ jobs:
working-directory: ${{env.source-directory}}

# Run Flutter Format to ensure formatting is valid
- name: Run Flutter Format
run: flutter format --set-exit-if-changed .
- name: Run Dart Format
run: dart format --set-exit-if-changed .
working-directory: ${{env.source-directory}}

analyze:
Expand Down
3 changes: 3 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,6 @@
## [2.0.0] - 2023-09-25
* Remove Blurhash dependency, see [in the readme](https://pub.dev/packages/octo_image#blurhash) how to keep using blurhash.

## [1.0.2] - 2022-05-16
* Update Blurhash dependency

Expand Down
47 changes: 45 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -170,18 +170,61 @@ You can use them with OctoImage.fromSet:
```dart
OctoImage.fromSet(
image: image,
octoSet: OctoSet.blurHash('LEHV6nWB2yk8pyo0adR*.7kCMdnj'),
octoSet: OctoSet.circleAvatar(backgroundColor: Colors.red, text: Text("M")),
),
```

All included OctoSets are:

|**OctoSet**|**Explanation**|
|---|---|
|blurHash|Shows a blurhash as placeholder and error widget. When an error is thrown an icon is shown on top.|
|circleAvatar|Shows a colored circle with text during load and error. Clips the image after successful load.|
|circularIndicatorAndIcon|Shows a circularProgressIndicator with or without progress and an icon on error.|

### Blurhash
You can easily create your own OctoSet though, for example if you want to use blurHash as a placeholder:
```dart
/// 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,
);
}
```

# Contribute

If you would like to contribute to the plugin (e.g. by improving the documentation, solving a bug or adding a cool new feature), please carefully review our [contribution guide](CONTRIBUTING.md) and send us your [pull request](https://github.com/Baseflow/octo_image/pulls).
Expand Down
12 changes: 7 additions & 5 deletions example/lib/helpers/mock_image_provider.dart
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import 'dart:async' show Future, StreamController;
import 'dart:typed_data';
import 'dart:async';
import 'dart:ui' as ui show Codec;
import 'package:flutter/services.dart';
import 'package:http/http.dart' as http;

import 'package:flutter/foundation.dart';
Expand Down Expand Up @@ -33,7 +33,8 @@ class MockImageProvider extends ImageProvider<MockImageProvider> {
}

@override
ImageStreamCompleter load(MockImageProvider key, DecoderCallback decode) {
ImageStreamCompleter loadImage(
MockImageProvider key, ImageDecoderCallback decode) {
final chunkEvents = StreamController<ImageChunkEvent>();
return MultiFrameImageStreamCompleter(
codec: _loadAsync(key, chunkEvents, decode).first,
Expand All @@ -45,7 +46,7 @@ class MockImageProvider extends ImageProvider<MockImageProvider> {
Stream<ui.Codec> _loadAsync(
MockImageProvider key,
StreamController<ImageChunkEvent> chunkEvents,
DecoderCallback decode,
ImageDecoderCallback decode,
) async* {
try {
if (showLoading) {
Expand All @@ -62,7 +63,8 @@ class MockImageProvider extends ImageProvider<MockImageProvider> {
var url = 'https://blurha.sh/assets/images/img1.jpg';
Uint8List imageBytes;
imageBytes = (await http.get(Uri.parse(url))).bodyBytes;
var decodedImage = await decode(imageBytes);
final buffer = await ImmutableBuffer.fromUint8List(imageBytes);
var decodedImage = await decode(buffer);
yield decodedImage;
} finally {
await chunkEvents.close();
Expand Down
16 changes: 0 additions & 16 deletions example/lib/main.dart
Original file line number Diff line number Diff line change
Expand Up @@ -31,8 +31,6 @@ class OctoImagePage extends StatelessWidget {
children: [
_customImage(),
const SizedBox(height: 16),
_simpleBlur(),
const SizedBox(height: 16),
_circleAvatar(),
],
),
Expand All @@ -57,20 +55,6 @@ class OctoImagePage extends StatelessWidget {
);
}

Widget _simpleBlur() {
return AspectRatio(
aspectRatio: 269 / 173,
child: OctoImage(
image: const NetworkImage('https://blurha.sh/assets/images/img1.jpg'),
placeholderBuilder: OctoPlaceholder.blurHash(
'LEHV6nWB2yk8pyo0adR*.7kCMdnj',
),
errorBuilder: OctoError.icon(color: Colors.red),
fit: BoxFit.cover,
),
);
}

Widget _circleAvatar() {
return SizedBox(
height: 75,
Expand Down
1 change: 0 additions & 1 deletion example/lib/main_sets.dart
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,6 @@ class MyApp extends StatelessWidget {
theme: ThemeData(),
home: OctoImagePage(
sets: <OctoSet>[
OctoSet.blurHash('LEHV6nWB2yk8pyo0adR*.7kCMdnj'),
OctoSet.circleAvatar(
backgroundColor: Colors.red,
text: const Text(
Expand Down
Loading

0 comments on commit 09d01c5

Please sign in to comment.