缩略图判断是否长图失效

[KunMinX]

为了快速载入，分别传入了 urls 和 targetUrls， 现有的逻辑是，如果图片本身高度 未超过 屏幕高度1.5倍，就判定为非长图， 在有使用缩略图的情况下，就得不到符合预期的结果

样本： 缩略图： https://i.loli.net/2021/02/07/CbfiTt1k29KjesN.png

原图： https://i.loli.net/2021/02/07/4vFw6jeKThEVBnd.png

[KunMinX]

手动在 demo 中改了判定的方式，发现会产生更多复杂的状况， 目前的解决方式是，遍历装载缩略图 url 时，自行判断和将长图的 url 保持原图。

[mikaelzero]

1.61版本有问题是么，我忘记当初为什么要加上1.5倍的判断了，我测试了你发的两张图，是没有问题的

[KunMinX]

@MikaelZero

啊，是我把上面两个 url 地址贴反了，我直接贴代码吧，

String thumbUrl = "https://i.loli.net/2021/02/07/4vFw6jeKThEVBnd.png";
String targetUrl = "https://i.loli.net/2021/02/07/CbfiTt1k29KjesN.png";

button.setOnClickListener(v -> {
     Glide.with(this).load(url).into(imageView);
});

imageView.setOnClickListener(v -> {
     Mojito.with(this)
                    .urls(thumbUrl, targetUrl)
                    .views(imageView)
                    .start();
});

[KunMinX]

由于近期接触图片信息流的内容，手头上刚好有一些图片样本，所以一鼓作气将潜在的问题样本都提供了。

在阅读源码时发现这个框架封装的很不错，将设计模式原则应用的很出色，我可以将这个框架介绍给更多的朋友认识吗

[mikaelzero]

可以 明天我再对这个问题检查下

[KunMinX]

我在一楼对问题边界的判断存在偏差， 判断是否大于屏幕1.5 倍是为了适配 用户潜在的 “裁剪图片” 的结果， 所以该条件本身不是问题所在。

(此处提供一份 130*400px 的缩略图 和 原图） https://i.loli.net/2021/02/08/f5QedwvkMLcH8sP.jpg https://i.loli.net/2021/02/08/3HwSWnEAXrhyGOY.jpg

在缓存和进程都做过清空的 mojito demo 中，直接使用上述两个链接，可以满足预期的效果， 但在复杂的使用环境下，仍然存在不可预期的问题，意外发现 以下方式能 100% 复现 我在正常使用中遇到的情况：

1.在完全清除缓存 且清除进程后，第一次打开mojito，点击缩略图，载入目标图， 2.返回到一级页面，home键回到桌面，长按图标，在应用信息中清空缓存，但不清除进程， 3.从最近任务列表中 重新使 mojito 回到前景，继续点击一级界面的缩略图，此时进入预览页面时：不会先载入放大的缩略图、再载入目标图，而是直接进度条 + 载入目标图，并且长图不被视作长图，不会以阅读模式加载，而这会导致放大后无法 drag 关闭

录屏演示（可通过右上角 “保存” 按钮下载观看）： http://note.youdao.com/s/PWm0fpY3

[mikaelzero]

关于这个1.5倍的判断，只要长度和宽度比例符合大图条件，他应该就是长图，不分分辨率，至于你说的裁剪图片问题我是想不起来了，就单单发布的1.6.1版本删除了1.5倍判断的话，会出现同样的问题吗

[mikaelzero]

复现了下你的问题，暂时想到的解决方案是重新加载缩略图，并且同样显示查看原图按钮，缺点就是失去了转场动画，不过在这样情况下出现，我觉得没什么影响

[mikaelzero]

@KunMinX 我提交了一个dev的版本 你可以下载测试一下

[KunMinX]

@MikaelZero

不是的，你原先 1.5倍的判断是有道理的，是用于针对 “用户截图裁剪部分区域” 所造成的那种 “长条图片” 的情况。如果这种长条点进去是以阅读模式展开，就不符合预期。如图：

https://i.loli.net/2021/02/08/rtSAlXiEbu1xs8W.jpg

刚刚对 dev 项目进行测试，发现还是能重现，我下午也调试一下看看原因

[mikaelzero]

https://i.loli.net/2021/02/08/rtSAlXiEbu1xs8W.jpg
这张图没问题，是不是链接不对，这张图是一张正常的图

[mikaelzero]

另外针对1.5倍那个情况，如果一张宽度为30，高度为300的图，应该判定为长图

[KunMinX]

如果去掉和屏幕的判断，

https://i.loli.net/2021/02/08/4cLTa5Ftk9hpDeq.jpg 点进去后 https://i.loli.net/2021/02/08/F28eut1K3QfZw4M.jpg

[mikaelzero]

https://i.loli.net/2021/02/08/F28eut1K3QfZw4M.jpg 这图不对吧 这个宽度只有962

[KunMinX]

我从电脑的投影上截的屏，是点进去看大图时 1080p 手机屏幕的截屏

[mikaelzero]

这样 你在手机上测试下，然后给我一张出现问题的缩略图和原图，缩略图和原图的大小比例肯定是要一致的，这个没问题吧。

因为我这边测试结果是OK的，可能是我们测试的图片地址不对

[KunMinX]

可以的，在 mojito demo 新建一个测试 activity，然后引用 dev 的 module 即可测试

[KunMinX]

package net.mikaelzero.app

import android.os.Bundle
import android.widget.ImageView
import androidx.appcompat.app.AppCompatActivity
import com.bumptech.glide.Glide
import net.mikaelzero.mojito.Mojito

class TestMainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_test_main)

        val thumbUrls = listOf(
            "https://i.loli.net/2021/02/08/DiQvR57lKnGwXqp.png",
            "https://i.loli.net/2021/02/08/f5QedwvkMLcH8sP.jpg"
        )
        val targetUrls = listOf(
            "https://i.loli.net/2021/02/08/CLcprTGDS8mZoQB.png",
            "https://i.loli.net/2021/02/08/3HwSWnEAXrhyGOY.jpg"
        )

        val imageView1 = findViewById<ImageView>(R.id.iv_1)
        val imageView2 = findViewById<ImageView>(R.id.iv_2)

        Glide.with(this)
            .load(thumbUrls.get(0))
            .into(imageView1)

        imageView1.setOnClickListener {
            Mojito.with(this)
                .urls(thumbUrls.get(0), targetUrls.get(0))
                .views(imageView1)
                .autoLoadTarget(true)
                .position(0)
                .start()
        }

        Glide.with(this)
            .load(thumbUrls.get(1))
            .into(imageView2)

        imageView2.setOnClickListener {
            Mojito.with(this)
                .urls(thumbUrls.get(1), targetUrls.get(1))
                .views(imageView2)
                .autoLoadTarget(true)
                .position(0)
                .start()
        }

    }
}

[KunMinX]

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <ImageView
        android:id="@+id/iv_1"
        android:layout_width="wrap_content"
        android:layout_height="200dp"
        android:adjustViewBounds="true"
        android:scaleType="fitStart"
        android:text="Hello World!" />

    <ImageView
        android:id="@+id/iv_2"
        android:layout_width="wrap_content"
        android:layout_height="200dp"
        android:adjustViewBounds="true"
        android:scaleType="fitStart"
        android:text="Hello World!" />

</LinearLayout>

[KunMinX]

测试结果是，图1 被当做长图，不符预期地开启了阅读模式，

同时，图2 如果咱们恢复了 1.5 倍判断，它就无法被视作长图。

关于图2，我个人的想法是，有 2 种方式：

1.在加载 target 时，重新根据 target 的尺寸来判断是否加载阅读模式，不过这个过程可能会有 “闪变” 的体验，也即缩略图放大预览是不铺满的，加载原图后是会铺满的，在弱网下切换的体验不好（在骁龙 865 及以后的手机上无感知，因为切换够快）

2.我在外部使用我 2 楼提到的方式，在外部仅根据长宽比来判断是否“长图”，从而是否直接将 目标url 当做 缩略图 url 传入，并在 mojito 内部使用它自己的 1.5倍来最终判断是否以阅读模式展示

[mikaelzero]

嗯 是有这个问题 主要还是长图的逻辑判断不够准确 我这边考虑下如何处理

[mikaelzero]

首先纵向的长图判断逻辑不做更改，没有问题 其次横向的长图判定，看了市面的几款app，没发现有这种readMode的模式，因此在调研了一些横向长图的比例后，觉得宽度是高度的5倍是一个比较好的判断 你可以先pull dev分支测试下

[KunMinX]

@MikaelZero

ok，这个方案 nice，测试通过

[KunMinX]

刚刚翻到一个 截图 + 裁剪 的情况。 回溯了下，纵向的裁剪很少，所以可以单独为横向的保留屏幕倍数判断

以下是原图 https://i.loli.net/2021/02/08/lWfi1n4K9cUMzSb.png

[mikaelzero]

还有这种图 那我只能再发个版本了

[KunMinX]

好的，测试了一圈，结果相当棒