🔨 Refactor the download progress and press the state mask

evifree · Sep 20, 2017 · 3e91db1 · 3e91db1
1 parent cfe175d
commit 3e91db1
Show file tree

Hide file tree

Showing 19 changed files with 479 additions and 432 deletions.
diff --git a/docs/logs/log_2.5.0_p2_temp.md b/docs/logs/log_2.5.0_p2_temp.md
@@ -6,13 +6,22 @@ bugs：
 
 变更：
 * :hammer: Listener.onStartLoad() 方法名字改为 onReadyLoad()
+* :hammer: ImageShaper 接口新增 Path getPath(Rect bounds) 方法，获取形状的 Path
+* :hammer: 重构 SketchImageView 的下载进度和按下状态功能的蒙层形状配置方式，详情请参考 [SketchImageView 使用指南][sketch_image_view]
 
 删除：
 * :fire: 删除 RequestLevelFrom ，因此取消原因中不再区分 REQUEST_LEVEL_IS_LOCAL 和 REQUEST_LEVEL_IS_MEMORY
 * :fire: 删除 CancelCause.REQUEST_LEVEL_IS_LOCAL 和 REQUEST_LEVEL_IS_MEMORY
 * :fire: 删除 SketchUtils.makeRequestKey(String, UriModel, DownloadOptions) 方法，makeRequestKey(String, UriModel, String) 方法代替之
 * :fire: 删除 SketchUtils.makeRequestKey(String, String) 方法，makeRequestKey(String, UriModel, String) 方法代替之
 * :fire: 删除 SketchUtils.makeStateImageMemoryCacheKey(String, DownloadOptions) 方法，makeRequestKey(String, UriModel, String) 方法代替之
+* :fire: 删除 SketchImageView.ImageShape 
+* :fire: 删除 SketchImageView.getImageShape() 方法
+* :fire: 删除 SketchImageView.setImageShape(SketchImageView.ImageShape) 方法
+* :fire: 删除 SketchImageView.getImageShapeCornerRadius() 方法
+* :fire: 删除 SketchImageView.setImageShapeCornerRadius(float[]) 方法
+* :fire: 删除 SketchImageView.setImageShapeCornerRadius(float) 方法
+* :fire: 删除 SketchImageView.setImageShapeCornerRadius(float, float, float, float) 方法
 
 优化：
 * :zap: 移动网络暂停下载功能支持识别 流量共享 WIFI 热点，更多内容请参考 [移动网络下暂停下载图片，节省流量][pause_download]
@@ -26,4 +35,5 @@ sample app：
 待办：
 * 写文档介绍 OptionsFilter
 
-[pause_download]: ../wiki/pause_download.md
+[pause_download]: ../wiki/pause_download.md
+[sketch_image_view]: ../wiki/sketch_image_view.md
diff --git a/docs/wiki/max_size.md b/docs/wiki/max_size.md
@@ -46,6 +46,5 @@ BitmapFactory 提供了一个 Options 来配置读取图片的相关选项，其
 2. 调用 Sketch.with(context).getConfiguration().setSizeCalculator(ImageSizeCalculator) 方法使用你自定义的 [ImageSizeCalculator]
 
 
-[MaxSize]: ../../sketch/src/main/java/me/xiaopan/sketch/request/[MaxSize].java
-[ImageDecoder]: ../../sketch/src/main/java/me/xiaopan/sketch/decode/ImageDecoder.java
-[ImageSizeCalculator]: ,,/../sketch/src/main/java/me/xiaopan/sketch/decode/ImageSizeCalculator.java
+[MaxSize]: ../../sketch/src/main/java/me/xiaopan/sketch/request/MaxSize.java
+[ImageSizeCalculator]: ../../sketch/src/main/java/me/xiaopan/sketch/decode/ImageSizeCalculator.java
diff --git a/docs/wiki/sketch_image_view.md b/docs/wiki/sketch_image_view.md
@@ -7,7 +7,7 @@
 * 支持手势缩放
 * 只是分块显示超大图
 * 支持显示下载进度
-* 支持显示按下状态，长按的时候还会有圆圈扩散效果
+* 支持显示按下状态，按下后会在图片上显示一个黑色半透明的蒙层
 * 支持显示图片来源，能方便的看出当前图片来自内存还是本地缓存还是刚从网络下载的
 * 支持显示 gif 图标，当显示的是 gif 图的时候会在右下角显示一个图标，用于提示用户这是一张 gif 图片
 * 支持显示失败的时候点击重新显示图片
@@ -69,28 +69,29 @@ sketchImageView.setOptions(displayOptions)
 
 ### 显示下载进度
 
-[SketchImageView] 提供了一个简易版的显示进度的功能，你只需调用如下代码开启即可：
+[SketchImageView] 提供了一个简易的显示进度功能，会在图片上面显示一个黑色半透明层，随着进度的更新从上往下消失，你只需调用如下代码开启即可：
 
 ```java
 sketchImageView.setShowDownloadProgressEnabled(true);
 ```
 
 `一定要在 displayImage() 之前调用，否则不起作用`
 
-默认进度蒙层是矩形的，如果图片或 loading 占位图是圆形的，就会显得不协调，你可以通过 [SketchImageView].ImageShape 改变蒙层的形状，如下：
+默认会使用 DisplayOptions 里的 ImageShaper 修改蒙层的形状，你也可以自定义蒙层的形状，如下：
 
 ```java
-// 设置蒙层形状为圆形
-sketchImageView.setImageShape(SketchImageView.ImageShape.CIRCLE);
+sketchImageView.setShowDownloadProgressEnabled(true, new RoundRectImageShaper());
+```
+
+你还可以修改蒙层的颜色，如下：
 
-// 设置蒙层形状为圆角矩形，并设置圆角的度数
-sketchImageView.setImageShape(SketchImageView.ImageShape.ROUNDED_RECT);
-sketchImageView.setImageShapeCornerRadius(20);
+```java
+sketchImageView.setShowDownloadProgressEnabled(true, Color.parse("#ff0000"));
 ```
 
 ### 显示按下状态
 
-[SketchImageView] 支持点击的时候在图片上面显示一层黑色半透明蒙层，表示按下状态，长按的时候还会有圆圈扩散效果
+[SketchImageView] 支持点击的时候在图片上面显示一层黑色半透明蒙层，表示按下状态
 
 ```java
 // 你需要先设置点击Listener
@@ -100,18 +101,17 @@ sketchImageView.setOnClickListener(...);
 sketchImageView.setShowPressedStatusEnabled(true);
 ```
 
-同下载进度蒙层一样，按下状态蒙层默认也是矩形的，如果图片是圆形的，就会显得不协调，你可以通过 [SketchImageView].ImageShape 改变蒙层的形状，如下：
+默认会使用 DisplayOptions 里的 ImageShaper 修改蒙层的形状，你也可以自定义蒙层的形状，如下：
 
 ```java
-// 设置蒙层形状为圆形
-sketchImageView.setImageShape(SketchImageView.ImageShape.CIRCLE);
-
-// 设置蒙层形状为圆角矩形，并设置圆角的度数
-sketchImageView.setImageShape(SketchImageView.ImageShape.ROUNDED_RECT);
-sketchImageView.setImageShapeCornerRadius(20);
+sketchImageView.setShowPressedStatusEnabled(true, new RoundRectImageShaper());
 ```
 
-按下状态蒙层和下载进度蒙层共享同一个 [SketchImageView].ImageShape 设置
+你还可以修改蒙层的颜色，如下：
+
+```java
+sketchImageView.setShowPressedStatusEnabled(true, Color.parse("#ff0000"));
+```
 
 ### 显示图片来源
 

diff --git a/sample/src/main/java/me/xiaopan/sketchsample/adapter/itemfactory/AppItemFactory.java b/sample/src/main/java/me/xiaopan/sketchsample/adapter/itemfactory/AppItemFactory.java
@@ -7,9 +7,6 @@
 
 import butterknife.BindView;
 import me.xiaopan.assemblyadapter.AssemblyRecyclerItemFactory;
-import me.xiaopan.sketch.SketchImageView;
-import me.xiaopan.sketch.shaper.ImageShaper;
-import me.xiaopan.sketch.shaper.RoundRectImageShaper;
 import me.xiaopan.sketch.uri.ApkIconUriModel;
 import me.xiaopan.sketch.uri.AppIconUriModel;
 import me.xiaopan.sketchsample.ImageOptions;
@@ -57,13 +54,6 @@ protected void onConfigViews(Context context) {
             iconImageView.setOptions(ImageOptions.ROUND_RECT);
             iconImageView.setPage(SampleImageView.Page.APP_LIST);
 
-            ImageShaper imageShaper = iconImageView.getOptions().getImageShaper();
-            if (imageShaper instanceof RoundRectImageShaper) {
-                RoundRectImageShaper roundRectImageShaper = (RoundRectImageShaper) imageShaper;
-                iconImageView.setImageShape(SketchImageView.ImageShape.ROUNDED_RECT);
-                iconImageView.setImageShapeCornerRadius(roundRectImageShaper.getOuterRadii());
-            }
-
             getItemView().setOnClickListener(new View.OnClickListener() {
                 @Override
                 public void onClick(View v) {

diff --git a/sample/src/main/java/me/xiaopan/sketchsample/adapter/itemfactory/MyPhotoItemFactory.java b/sample/src/main/java/me/xiaopan/sketchsample/adapter/itemfactory/MyPhotoItemFactory.java
@@ -9,9 +9,6 @@
 
 import butterknife.BindView;
 import me.xiaopan.assemblyadapter.AssemblyRecyclerItemFactory;
-import me.xiaopan.sketch.SketchImageView;
-import me.xiaopan.sketch.shaper.ImageShaper;
-import me.xiaopan.sketch.shaper.RoundRectImageShaper;
 import me.xiaopan.sketch.util.SketchUtils;
 import me.xiaopan.sketchsample.ImageOptions;
 import me.xiaopan.sketchsample.R;
@@ -77,14 +74,7 @@ public void onClick(View v) {
                     }
                 }
             });
-            imageView.setOptions(ImageOptions.RECT);
-
-            ImageShaper imageShaper = imageView.getOptions().getImageShaper();
-            if (imageShaper != null && imageShaper instanceof RoundRectImageShaper) {
-                RoundRectImageShaper roundRectImageShaper = (RoundRectImageShaper) imageShaper;
-                imageView.setImageShape(SketchImageView.ImageShape.ROUNDED_RECT);
-                imageView.setImageShapeCornerRadius(roundRectImageShaper.getOuterRadii());
-            }
+            imageView.setOptions(ImageOptions.ROUND_RECT);
 
             if (itemSize > 0) {
                 ViewGroup.LayoutParams layoutParams = imageView.getLayoutParams();

diff --git a/sample/src/main/java/me/xiaopan/sketchsample/widget/SampleImageView.java b/sample/src/main/java/me/xiaopan/sketchsample/widget/SampleImageView.java
@@ -56,25 +56,20 @@ protected void onAttachedToWindow() {
         } catch (EventBusException e) {
             e.printStackTrace();
         }
-
-        if (!isInEditMode()) {
-            disabledRedisplay = true;
-            onEvent(new AppConfigChangedEvent(AppConfig.Key.SHOW_GIF_FLAG));
-            onEvent(new AppConfigChangedEvent(AppConfig.Key.SHOW_IMAGE_FROM_FLAG));
-            onEvent(new AppConfigChangedEvent(AppConfig.Key.CLICK_SHOW_PRESSED_STATUS));
-            onEvent(new AppConfigChangedEvent(AppConfig.Key.SHOW_IMAGE_DOWNLOAD_PROGRESS));
-            onEvent(new AppConfigChangedEvent(AppConfig.Key.CLICK_RETRY_ON_PAUSE_DOWNLOAD));
-            onEvent(new AppConfigChangedEvent(AppConfig.Key.CLICK_RETRY_ON_FAILED));
-            onEvent(new AppConfigChangedEvent(AppConfig.Key.CLICK_PLAY_GIF));
-            disabledRedisplay = false;
-        }
     }
 
     @Override
     public void onReadyDisplay(UriModel uriModel) {
         super.onReadyDisplay(uriModel);
 
         disabledRedisplay = true;
+        onEvent(new AppConfigChangedEvent(AppConfig.Key.SHOW_GIF_FLAG));
+        onEvent(new AppConfigChangedEvent(AppConfig.Key.SHOW_IMAGE_FROM_FLAG));
+        onEvent(new AppConfigChangedEvent(AppConfig.Key.CLICK_SHOW_PRESSED_STATUS));
+        onEvent(new AppConfigChangedEvent(AppConfig.Key.SHOW_IMAGE_DOWNLOAD_PROGRESS));
+        onEvent(new AppConfigChangedEvent(AppConfig.Key.CLICK_RETRY_ON_PAUSE_DOWNLOAD));
+        onEvent(new AppConfigChangedEvent(AppConfig.Key.CLICK_RETRY_ON_FAILED));
+        onEvent(new AppConfigChangedEvent(AppConfig.Key.CLICK_PLAY_GIF));
         onEvent(new AppConfigChangedEvent(AppConfig.Key.DISABLE_CORRECT_IMAGE_ORIENTATION));
         onEvent(new AppConfigChangedEvent(AppConfig.Key.PLAY_GIF_ON_LIST));
         onEvent(new AppConfigChangedEvent(AppConfig.Key.THUMBNAIL_MODE));

diff --git a/sketch/src/main/java/me/xiaopan/sketch/SketchImageView.java b/sketch/src/main/java/me/xiaopan/sketch/SketchImageView.java
@@ -100,13 +100,4 @@ public String getOptionsKey() {
             return getOptions().makeKey();
         }
     }
-
-    /**
-     * 图片的形状
-     */
-    public enum ImageShape {
-        RECT,
-        CIRCLE,
-        ROUNDED_RECT,
-    }
 }
diff --git a/sketch/src/main/java/me/xiaopan/sketch/request/DisplayHelper.java b/sketch/src/main/java/me/xiaopan/sketch/request/DisplayHelper.java
@@ -76,7 +76,7 @@ public DisplayHelper init(@NonNull Sketch sketch, @NonNull String uri, @NonNull
         // onDisplay 一定要在最前面执行，因为 在onDisplay 中会设置一些属性，这些属性会影响到后续一些 get 方法返回的结果
         this.sketchView.onReadyDisplay(uriModel);
         if (SLog.isLoggable(SLog.LEVEL_DEBUG | SLog.TYPE_TIME)) {
-            Stopwatch.with().record("onDisplay");
+            Stopwatch.with().record("onReadyDisplay");
         }
 
         viewInfo.reset(sketchView, sketch);

diff --git a/sketch/src/main/java/me/xiaopan/sketch/shaper/CircleImageShaper.java b/sketch/src/main/java/me/xiaopan/sketch/shaper/CircleImageShaper.java
@@ -19,6 +19,7 @@
 import android.graphics.Canvas;
 import android.graphics.Matrix;
 import android.graphics.Paint;
+import android.graphics.Path;
 import android.graphics.Rect;
 import android.support.annotation.NonNull;
 import android.support.annotation.Nullable;
@@ -33,6 +34,8 @@ public class CircleImageShaper implements ImageShaper {
     private int strokeColor;
 
     private Paint strokePaint;
+    private Rect boundsBack;
+    private Path path;
 
     @SuppressWarnings("unused")
     public int getStrokeColor() {
@@ -66,6 +69,31 @@ private void updatePaint() {
         }
     }
 
+    @NonNull
+    @Override
+    public Path getPath(@NonNull Rect bounds) {
+        if (path != null && boundsBack != null && boundsBack.equals(bounds)) {
+            return path;
+        }
+
+        if (boundsBack == null) {
+            boundsBack = new Rect();
+        }
+        boundsBack.set(bounds);
+
+        if (path == null) {
+            path = new Path();
+        }
+        path.reset();
+
+        int centerX = bounds.centerX();
+        int centerY = bounds.centerX();
+        int radius = Math.max(centerX - bounds.left, centerY - bounds.top);
+        path.addCircle(centerX, centerY, radius, Path.Direction.CW);
+
+        return path;
+    }
+
     @Override
     public void onUpdateShaderMatrix(@NonNull Matrix matrix, @NonNull Rect bounds, int bitmapWidth, int bitmapHeight,
                                      @Nullable ShapeSize shapeSize, @NonNull Rect srcRect) {

diff --git a/sketch/src/main/java/me/xiaopan/sketch/shaper/ImageShaper.java b/sketch/src/main/java/me/xiaopan/sketch/shaper/ImageShaper.java
@@ -19,6 +19,7 @@
 import android.graphics.Canvas;
 import android.graphics.Matrix;
 import android.graphics.Paint;
+import android.graphics.Path;
 import android.graphics.Rect;
 import android.support.annotation.NonNull;
 import android.support.annotation.Nullable;
@@ -29,7 +30,19 @@
  * 用于绘制时改变图片的形状
  */
 public interface ImageShaper {
+    /**
+     * 获取形状 Path
+     */
+    @NonNull
+    Path getPath(@NonNull Rect bounds);
     void onUpdateShaderMatrix(@NonNull Matrix matrix, @NonNull Rect bounds, int bitmapWidth, int bitmapHeight, @Nullable ShapeSize shapeSize, @NonNull Rect srcRect);
 
+    /**
+     * 绘制
+     *
+     * @param canvas
+     * @param paint
+     * @param bounds
+     */
     void draw(@NonNull Canvas canvas, @NonNull Paint paint, @NonNull Rect bounds);
 }
diff --git a/sketch/src/main/java/me/xiaopan/sketch/shaper/RoundRectImageShaper.java b/sketch/src/main/java/me/xiaopan/sketch/shaper/RoundRectImageShaper.java
@@ -45,6 +45,10 @@ public class RoundRectImageShaper implements ImageShaper {
 
     private Paint strokePaint;
 
+    private Rect boundsBack;
+    private RectF rectF;
+    private Path path;
+
     public RoundRectImageShaper(float[] radiis) {
         if (radiis == null || radiis.length < 8) {
             throw new ArrayIndexOutOfBoundsException("outer radii must have >= 8 values");
@@ -53,7 +57,8 @@ public RoundRectImageShaper(float[] radiis) {
     }
 
     public RoundRectImageShaper(float topLeftRadii, float topRightRadii, float bottomLeftRadii, float bottomRightRadii) {
-        this(new float[]{topLeftRadii, topLeftRadii, topRightRadii, topRightRadii, bottomLeftRadii, bottomLeftRadii, bottomRightRadii, bottomRightRadii});
+        this(new float[]{topLeftRadii, topLeftRadii, topRightRadii, topRightRadii,
+                bottomLeftRadii, bottomLeftRadii, bottomRightRadii, bottomRightRadii});
     }
 
     public RoundRectImageShaper(float radii) {
@@ -112,6 +117,33 @@ private boolean hasStroke() {
         return strokeColor != 0 && strokeWidth > 0;
     }
 
+    @NonNull
+    @Override
+    public Path getPath(@NonNull Rect bounds) {
+        if (path != null && boundsBack != null && boundsBack.equals(bounds)) {
+            return path;
+        }
+
+        if (boundsBack == null) {
+            boundsBack = new Rect();
+        }
+        boundsBack.set(bounds);
+
+        if (path == null) {
+            path = new Path();
+        }
+        path.reset();
+
+        if (rectF == null) {
+            rectF = new RectF();
+        }
+        rectF.set(boundsBack);
+
+        path.addRoundRect(rectF, outerRadii, Path.Direction.CW);
+
+        return path;
+    }
+
 
     @Override
     public void onUpdateShaderMatrix(@NonNull Matrix matrix, @NonNull Rect bounds, int bitmapWidth, int bitmapHeight,

diff --git a/sketch/src/main/java/me/xiaopan/sketch/viewfun/ClickPlayGifFunction.java b/sketch/src/main/java/me/xiaopan/sketch/viewfun/ClickPlayGifFunction.java
@@ -43,11 +43,8 @@ public class ClickPlayGifFunction extends ViewFunction {
 
     private PlayGifRedisplayListener redisplayListener;
 
-    public ClickPlayGifFunction(FunctionCallbackView view, Drawable playIconDrawable) {
+    public ClickPlayGifFunction(FunctionCallbackView view) {
         this.view = view;
-
-        this.playIconDrawable = playIconDrawable;
-        this.playIconDrawable.setBounds(0, 0, playIconDrawable.getIntrinsicWidth(), playIconDrawable.getIntrinsicHeight());
     }
 
     @Override
@@ -106,6 +103,16 @@ private boolean canClickPlay(Drawable newDrawable) {
         return SketchUtils.isGifImage(endDrawable) && !(endDrawable instanceof SketchGifDrawable);
     }
 
+    public boolean setPlayIconDrawable(@NonNull Drawable playIconDrawable) {
+        if (this.playIconDrawable == playIconDrawable) {
+            return false;
+        }
+
+        this.playIconDrawable = playIconDrawable;
+        this.playIconDrawable.setBounds(0, 0, playIconDrawable.getIntrinsicWidth(), playIconDrawable.getIntrinsicHeight());
+        return true;
+    }
+
     private static class PlayGifRedisplayListener implements RedisplayListener {
 
         @Override

diff --git a/sketch/src/main/java/me/xiaopan/sketch/viewfun/FunctionCallbackView.java b/sketch/src/main/java/me/xiaopan/sketch/viewfun/FunctionCallbackView.java
@@ -228,7 +228,7 @@ public void setDisplayListener(@Nullable DisplayListener displayListener) {
     @Nullable
     @Override
     public DownloadProgressListener getDownloadProgressListener() {
-        if (getFunctions().showProgressFunction != null || wrappedProgressListener != null) {
+        if (getFunctions().showDownloadProgressFunction != null || wrappedProgressListener != null) {
             return progressListenerProxy;
         } else {
             return null;