电子书阅读器上的浏览器 [Day12] 桌面模式

目前的 E-ink 设备，6寸，7.8寸，一直到 10 寸，13 寸都有，除了6 寸有点太小，其他尺寸都还蛮适合用来浏览 PC 版网页；所以，让 browser 可以切换成 Desktop 模式是很重要的。

在 Reddit 上看到，在很早期的 FOSS Browser 是有支援这功能的，只是在後来不知道为什麽，就把这功能拿掉了。有了这资讯後，当然是先回去翻翻 commit，找原本的实作在哪里，看有没有机会直接再搬到最新版的程序码中。

经过一阵搜寻後，发现在是 v5.6 升级到 v5.7 时，将它拿掉的(目前最新版是 v6.9了)。在稍微参考原先的作法後，我把 fast toggle 选单中的「反转颜色」的功能，改成新版的 Desktop 模式的按钮。对 E-ink 设备来说，应该不会有人想把底色换成全黑的吧。

参考连结

如下图所示，当长按三个点时，会跳出 fast toggle 的选单，红色框选的按钮就是新加的 Desktop 模式。点选後画面会重新载入，就可以看到 PC 版的网页了。

实作的方式是塞一个类似 PC Browser 的 user agent string 给 WebView 的 WebSettings。如果想离开 Desktop 模式，只要再把WebView 预设的的 user agent string 重新设定回去就行。

在设定为一般的行动设备的 user agent string 时，可以看到我有把 wv 字串特别拿掉。因为这个 wv 字串会造成 Google 帐号在 WebView 中要登入时会遇到问题；拿掉它才可以让 Google 帐号在 browser 中能正常使用。

// 桌面模式的 user agent string 定义
const val UA_DESKTOP =
    "Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML like Gecko) Chrome/44.0.2403.155 Safari/537.36"

// NinjaWebView.kt 中用来切换桌面模式的函式
fun updateDesktopMode() {
    val isDesktopMode = config.desktop
    if (isDesktopMode) {
        settings.userAgentString = BrowserUnit.UA_DESKTOP
    } else {
        settings.userAgentString = WebSettings.getDefaultUserAgent(context).replace("wv", "")
    }

    settings.useWideViewPort = isDesktopMode
    settings.loadWithOverviewMode = isDesktopMode
}

示范影片

到目前为止，也累积了不少功能，要一字排开全放在工具列上，稍微挤了点。所以下一篇会来介绍一下，如何实作一个可以自订的工具列。