Fresco翻转并拼接图片

方法一：拼接两个DraweeView（❌）

1、思路

• 第一个DraweeView显示原图
• 下方接一个DraweeView裁减至原图的四分之一并拼接

2、优缺点

• 优点：简单直观
• 缺点：对同一张图片需要两个DraweeView去分别显示，造成不必要的内存浪费

方法二：拼接两个Bitmap（✅）

1、思路

• 通过Fresco后处理器process( Bitmap sourceBitmap, PlatformBitmapFactory bitmapFactory)方法中的bitmapFactory参数创建自定义的bitmap进行拼接

  https://www.fresco-cn.org/docs/modifying-image.html

2、优缺点

• 优点：Fressco开启 后台线程 ，异步完成bitmap拼装，仅需一个DraweeView显示
• 缺点：
  • 嵌套for循环产生大量运算用于拼接像素点
  • 不支持动图

3、性能消耗

• 耗时：

2020-04-14 15:39:28.633 17037-17175/com.mo.testeverything E/sss: 代码运行时间： 1099ms
2020-04-14 15:39:29.670 17037-17175/com.mo.testeverything E/sss: 代码运行时间： 1037ms
2020-04-14 15:39:30.707 17037-17175/com.mo.testeverything E/sss: 代码运行时间： 1036ms
2020-04-14 15:39:31.742 17037-17175/com.mo.testeverything E/sss: 代码运行时间： 1035ms
2020-04-14 15:39:32.779 17037-17175/com.mo.testeverything E/sss: 代码运行时间： 1037ms
2020-04-14 15:39:33.820 17037-17175/com.mo.testeverything E/sss: 代码运行时间： 1041ms
2020-04-14 15:39:34.875 17037-17175/com.mo.testeverything E/sss: 代码运行时间： 1055ms
2020-04-14 15:39:35.938 17037-17175/com.mo.testeverything E/sss: 代码运行时间： 1063ms
2020-04-14 15:39:37.001 17037-17175/com.mo.testeverything E/sss: 代码运行时间： 1062ms
2020-04-14 15:39:38.065 17037-17175/com.mo.testeverything E/sss: 代码运行时间： 1063ms

• 内存：

  • PlatformBitmapFactory 类以指定的大小安全地创建一张图片，在 Java Heap 之外

  • 可关闭的引用：CloseableReference<Bitmap>

    https://www.fresco-cn.org/docs/closeable-references.html

4、封装后处理器代码

public class RotateAndJointProcessor extends BasePostprocessor {

  @Override
  public String getName() {
    return "RotateAndJointProcessor";
  }

  @Override
  public CloseableReference<Bitmap> process(
      Bitmap sourceBitmap,
      PlatformBitmapFactory bitmapFactory) {

    int sourceHeight = sourceBitmap.getHeight();
    int jointHeight = sourceHeight / 4;
    int totalHeight = sourceHeight + jointHeight;

    CloseableReference<Bitmap> bitmapRef = bitmapFactory.createBitmap(
        sourceBitmap.getWidth(),
        totalHeight);
    try {
      Bitmap destBitmap = bitmapRef.get();
      for (int x = 0; x < sourceBitmap.getWidth(); x++) {
        // 原图正常显示
        for (int m = 0; m < sourceHeight; m++) {
          destBitmap.setPixel(x, m, sourceBitmap.getPixel(x, m));
        }
        // 拼接原图的四分之一并翻转
        for (int y = 0; y < jointHeight; y++) {
          destBitmap.setPixel(x, y + sourceHeight, sourceBitmap.getPixel(x,
              sourceHeight - 1 - y));
        }
      }
      return CloseableReference.cloneOrNull(bitmapRef);
    } finally {
      CloseableReference.closeSafely(bitmapRef);
    }
  }
}

• 使用：

  <com.facebook.drawee.view.SimpleDraweeView
    android:id="@+id/iv_fresco_test"
    android:layout_width="640px"
    android:layout_height="450px"
    fresco:actualImageScaleType="centerCrop" />

    mSimpleDraweeView = (SimpleDraweeView) findViewById(R.id.iv_fresco_test);
    uri = new Uri.Builder().scheme(UriUtil.LOCAL_RESOURCE_SCHEME)
        .path(String.valueOf(R.drawable.img_test))
        .build();

    // 构建图片请求
    ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
        .setPostprocessor(new RotateAndJointProcessor())
        .build();

    // 构建Controller
    PipelineDraweeController controller = (PipelineDraweeController)
        Fresco.newDraweeControllerBuilder()
            .setImageRequest(request)
            .setOldController(mSimpleDraweeView.getController())
            .build();

    // 显示
    mSimpleDraweeView.setController(controller);

• 效果

  • 原图（16 : 9）

    

  • 拼接后（16 : 11.25）

    

  • 说明图