Skip to content

Commit

Permalink
* Breaking change:
Browse files Browse the repository at this point in the history 
  1. we cache raw image pixels as default behavior at previous versions, it's not good for heap memory usage. so add [ExtendedImageProvider.cacheRawData] to support whether should cache the raw image pixels. It's [false] now.

* Improve:

  1. add [ExtendedResizeImage] to support resize image more convenient.
  2. add [ExtendedImageProvider.imageCacheName] to support custom ImageCache to store ExtendedImageProvider.
  3. add MemoryUsageDemo. #315

* Issues:
  1. fix issue that [EditorConfig.editActionDetailsIsChanged] is not fire when change crop area. #317
  • Loading branch information
@zmtzawqlp
zmtzawqlp committed Mar 23, 2021
1 parent 75b5213 commit e64ce77
Show file tree
Hide file tree
Showing 25 changed files with 528 additions and 420 deletions.
5 changes: 4 additions & 1 deletion CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,10 @@

1. add [ExtendedResizeImage] to support resize image more convenient.
2. add [ExtendedImageProvider.imageCacheName] to support custom ImageCache to store ExtendedImageProvider.
3. add MemoryUsageDemo
3. add MemoryUsageDemo. #315

* Issues:
1. fix issue that [EditorConfig.editActionDetailsIsChanged] is not fire when change crop area. #317

## 3.0.0

Expand Down
109 changes: 61 additions & 48 deletions README-ZH.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,8 +56,8 @@ environment:
sdk: '>=2.12.0 <3.0.0'
flutter: '>=2.0'
dependencies:
extended_image: ^3.0.0
```
extended_image: ^4.0.0
```
* 非空安全
Expand All @@ -69,7 +69,7 @@ environment:
flutter: '>1.17.0 <=1.22.6'
dependencies:
extended_image: ^3.0.0-non-null-safety
```
```
## 缓存网络图片
Expand Down Expand Up @@ -935,61 +935,74 @@ ExtendedImage
[绘制例子](https://github.com/fluttercandies/extended_image/blob/master/example/lib/pages/simple/paint_image_demo.dart)
[下拉刷新头当中，也使用了这个技巧](https://github.com/fluttercandies/extended_image/blob/master/example/lib/common/widget/push_to_refresh_header.dart)

## 瀑布流
## 内存使用

使用 [LoadingMoreList](https://github.com/fluttercandies/loading_more_list) 或者 [WaterfallFlow](https://github.com/fluttercandies/waterfall_flow) 以及 ExtendedImage 创建瀑布流布局.
现在你可以通过下面设置来减少图片内存的占用.

![img](https://github.com/fluttercandies/flutter_candies/tree/master/gif/waterfall_flow/known_sized.gif)
* ExtendedResizeImage

| parameter | description | default |
| -------------------------------------------------------- | --------------------------------------------------- | --------- |
| [ExtendedResizeImage.compressionRatio] | 图片压缩率，大于0小于1 | null |
| [ExtendedResizeImage.maxBytes] | 图片的大小的最大值. 默认值为 500KB. | 500 << 10 |
| [ExtendedResizeImage.width]/[ExtendedResizeImage.height] | 宽和高用于decode和缓存. 跟官方的[ResizeImage]一致。 | null |

```dart
LoadingMoreList(
ListConfig<TuChongItem>(
waterfallFlowDelegate: WaterfallFlowDelegate(
crossAxisCount: 2,
crossAxisSpacing: 5,
mainAxisSpacing: 5,
),
itemBuilder: buildWaterfallFlowItem,
sourceList: listSourceRepository,
padding: EdgeInsets.all(5.0),
lastChildLayoutType: LastChildLayoutType.foot,
),
),
ExtendedImage.network(
'imageUrl',
compressionRatio: 0.1,
maxBytes: null,
cacheWidth: null,
cacheHeight: null,
)
ExtendedImage(
image: ExtendedResizeImage(
ExtendedNetworkImageProvider(
'imageUrl',
),
compressionRatio: 0.1,
maxBytes: null,
width: null,
height: null,
),
)
```

## 内存回收/可视区域追踪
* clearMemoryCacheWhenDispose

| parameter | description | default |
| --------------------------- | ------------------------------------------------------------ | ------- |
| clearMemoryCacheWhenDispose | 在Flutter 2.0之后也许不会起作用, 因为没法在图片没有完成之前释放掉(https://github.com/fluttercandies/extended_image/issues/317). 现在只会释放已完成的图片资源. | false |

当列表元素回收的时候你可以回收掉图片的内存缓存以减少内存压力。你也可以监听到 viewport 中 indexes 的变化。

更多详情请查看[LoadingMoreList](https://github.com/fluttercandies/loading_more_list), [WaterfallFlow](https://github.com/fluttercandies/waterfall_flow) 和 [ExtendedList](https://github.com/fluttercandies/extended_list)

```dart
LoadingMoreList(
ListConfig<TuChongItem>(
waterfallFlowDelegate: WaterfallFlowDelegate(
crossAxisCount: 2,
crossAxisSpacing: 5,
mainAxisSpacing: 5,
),
itemBuilder: buildWaterfallFlowItem,
sourceList: listSourceRepository,
padding: EdgeInsets.all(5.0),
lastChildLayoutType: LastChildLayoutType.foot,
collectGarbage: (List<int> garbages) {
///collectGarbage
garbages.forEach((index) {
final provider = ExtendedNetworkImageProvider(
listSourceRepository[index].imageUrl,
);
provider.evict();
});
//print("collect garbage : $garbages");
},
viewportBuilder: (int firstIndex, int lastIndex) {
print("viewport : [$firstIndex,$lastIndex]");
},
),
),
ExtendedImage.network(
'imageUrl',
clearMemoryCacheWhenDispose: true,
)
```

* imageCacheName

| parameter | description | default |
| -------------- | ------------------------------------------------------------ | ------- |
| imageCacheName | 你可以指定一个 ImageCache 来缓存一些图片。这样你可以一起处理它们，不会影响其他的图片缓存. | null |

```dart
ExtendedImage.network(
'imageUrl',
imageCacheName: 'MemoryUsage',
)
/// clear when this page is disposed
@override
void dispose() {
// clear ImageCache which named 'MemoryUsage'
clearMemoryImageCache(imageCacheName);
super.dispose();
}
```

## 其他 APIs
Expand Down
112 changes: 61 additions & 51 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,8 +39,7 @@ A powerful official extension library of image, which support placeholder(loadin
- [save network](#save-network)
- [Show Crop Image](#show-crop-image)
- [Paint](#paint)
- [WaterfallFlow](#waterfallflow)
- [CollectGarbage/viewportBuilder](#collectgarbageviewportbuilder)
- [MemoryUsage](#memoryusage)
- [Other APIs](#other-apis)

## Import
Expand All @@ -52,11 +51,11 @@ environment:
sdk: '>=2.12.0 <3.0.0'
flutter: '>=2.0'
dependencies:
extended_image: ^3.0.0
```
extended_image: ^4.0.0
```
* non-null-safety
1.22.6 to 2.0, Flutter Api has breaking change，please use non-null-safety if you under 1.22.6.
``` yaml
Expand All @@ -65,7 +64,7 @@ environment:
flutter: '>1.17.0 <=1.22.6'
dependencies:
extended_image: ^3.0.0-non-null-safety
```
```
## Cache Network
Expand Down Expand Up @@ -928,61 +927,72 @@ ExtendedImage
see [paint image demo](https://github.com/fluttercandies/extended_image/blob/master/example/lib/pages/simple/paint_image_demo.dart)
and [push to refresh header which is used in crop image demo](https://github.com/fluttercandies/extended_image/blob/master/example/lib/common/widget/push_to_refresh_header.dart)

## WaterfallFlow
## MemoryUsage

build WaterfallFlow with [LoadingMoreList](https://github.com/fluttercandies/loading_more_list) or [WaterfallFlow](https://github.com/fluttercandies/waterfall_flow) with ExtendedImage.
You can reduce memory usage with following settings now.

![img](https://github.com/fluttercandies/flutter_candies/tree/master/gif/waterfall_flow/known_sized.gif)
* ExtendedResizeImage

| parameter | description | default |
| -------------------------------------------------------- | ------------------------------------------------------------ | --------- |
| [ExtendedResizeImage.compressionRatio] | The image`s size will resize to original * [compressionRatio].It's ExtendedResizeImage`s first pick.The compressionRatio`s range is from 0.0 (exclusive), to 1.0 (exclusive). | null |
| [ExtendedResizeImage.maxBytes] | [ExtendedResizeImage] will compress the image to a size that is smaller than [maxBytes]. The default size is 500KB. | 500 << 10 |
| [ExtendedResizeImage.width]/[ExtendedResizeImage.height] | The width/height the image should decode to and cache. It's same as [ResizeImage], | null |

```dart
LoadingMoreList(
ListConfig<TuChongItem>(
waterfallFlowDelegate: WaterfallFlowDelegate(
crossAxisCount: 2,
crossAxisSpacing: 5,
mainAxisSpacing: 5,
),
itemBuilder: buildWaterfallFlowItem,
sourceList: listSourceRepository,
padding: EdgeInsets.all(5.0),
lastChildLayoutType: LastChildLayoutType.foot,
),
),
ExtendedImage.network(
'imageUrl',
compressionRatio: 0.1,
maxBytes: null,
cacheWidth: null,
cacheHeight: null,
)
ExtendedImage(
image: ExtendedResizeImage(
ExtendedNetworkImageProvider(
'imageUrl',
),
compressionRatio: 0.1,
maxBytes: null,
width: null,
height: null,
),
)
```

## CollectGarbage/viewportBuilder
* clearMemoryCacheWhenDispose

| parameter | description | default |
| -------------------------------------------------------- | ------------------------------------------------------------ | ------- |
| clearMemoryCacheWhenDispose | It's not good enough after Flutter 2.0, it seems that we can't release memory usage if this image is not completed(https://github.com/fluttercandies/extended_image/issues/317). It will release memory usage only for completed image now. | false |

you can collect garbage when item is dispose or viewport indexes is changed.
```dart
ExtendedImage.network(
'imageUrl',
clearMemoryCacheWhenDispose: true,
)
```

more details, [LoadingMoreList](https://github.com/fluttercandies/loading_more_list), [WaterfallFlow](https://github.com/fluttercandies/waterfall_flow) and [ExtendedList](https://github.com/fluttercandies/extended_list)
* imageCacheName

| parameter | description | default |
| -------------- | ------------------------------------------------------------ | ------- |
| imageCacheName | The name of [ImageCache], you can define custom [ImageCache] to store this image. In this way you can work with them without affecting other [ImageCache]| null |

```dart
LoadingMoreList(
ListConfig<TuChongItem>(
waterfallFlowDelegate: WaterfallFlowDelegate(
crossAxisCount: 2,
crossAxisSpacing: 5,
mainAxisSpacing: 5,
),
itemBuilder: buildWaterfallFlowItem,
sourceList: listSourceRepository,
padding: EdgeInsets.all(5.0),
lastChildLayoutType: LastChildLayoutType.foot,
collectGarbage: (List<int> garbages) {
///collectGarbage
garbages.forEach((index) {
final provider = ExtendedNetworkImageProvider(
listSourceRepository[index].imageUrl,
);
provider.evict();
});
//print("collect garbage : $garbages");
},
viewportBuilder: (int firstIndex, int lastIndex) {
print("viewport : [$firstIndex,$lastIndex]");
},
),
),
ExtendedImage.network(
'imageUrl',
imageCacheName: 'MemoryUsage',
)
/// clear when this page is disposed
@override
void dispose() {
// clear ImageCache which named 'MemoryUsage'
clearMemoryImageCache(imageCacheName);
super.dispose();
}
```

## Other APIs
Expand Down
1 change: 1 addition & 0 deletions example/android/app/src/main/AndroidManifest.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
<application
android:name="io.flutter.app.FlutterApplication"
android:label="example"
android:requestLegacyExternalStorage="true"
android:icon="@mipmap/ic_launcher">
<activity
android:name=".MainActivity"
Expand Down
Loading

0 comments on commit e64ce77

Please sign in to comment.