我們請(qǐng)來(lái)了人氣跨平臺(tái)記賬應(yīng)用《錢(qián)跡》的開(kāi)發(fā)者，為大家解讀原生和定制 Android 系統(tǒng)小組件的功過(guò)得失。

在今年的 WWDC 中，Apple 終于「舍得」為 iOS 的桌面小組件補(bǔ)上一項(xiàng)重要功能：可交互性。從 iOS 17 開(kāi)始，無(wú)論是在鎖屏、主屏還是這次剛上線(xiàn)的「待機(jī)」頁(yè)面，我們都可以通過(guò)小組件上的交互按鈕完成一些簡(jiǎn)單的任務(wù)。

關(guān)聯(lián)閱讀：

(資料圖片僅供參考)

但對(duì)于 Android 用戶(hù)來(lái)說(shuō)，小組件支持交互似乎應(yīng)該是一件「天經(jīng)地義」的事情。早在 2008 年 10 月發(fā)布的首個(gè)版本中，Android 就支持小組件；2021 年發(fā)布 Android 12 時(shí)，Google 還進(jìn)一步強(qiáng)化了小組件方方面面的功能，包括圓角、主題、自定義、功能、自適應(yīng)布局、動(dòng)畫(huà)效果等，為小組件在平板、折疊屏等大屏設(shè)備中的表現(xiàn)力提供了更好的基礎(chǔ)。

Android 4.2 的鎖屏小組件，圖自 Trendblog

不過(guò)，這種先發(fā)優(yōu)勢(shì)并不意味著 Android 小組件就能睥睨 iOS。相反，正如 Android 平臺(tái)的常見(jiàn)劇本《起個(gè)大早趕個(gè)晚集》那樣，它的小組件也是功能有余、細(xì)節(jié)不足。今天，如果你在 Google Pixel 的啟動(dòng)器上添加幾個(gè)來(lái)自不同 app 的同尺寸小組件，大概率也就能看到幾種各不相同的實(shí)際尺寸和圓角半徑。

或許正是出于對(duì)原生 Android 這種粗糙效果的不滿(mǎn)意，我們看到 MIUI 等定制系統(tǒng)紛紛選擇另起爐灶，重新制定一套小組件的開(kāi)發(fā)方案和設(shè)計(jì)規(guī)范。

那么，Google 的小組件方案到底有什么問(wèn)題導(dǎo)致了這種現(xiàn)狀，第三方系統(tǒng)又是怎么試圖解決的？

專(zhuān)業(yè)的問(wèn)題還是要專(zhuān)業(yè)的人來(lái)解答。為此，我們請(qǐng)到了人氣記賬 app《錢(qián)跡》的開(kāi)發(fā)者李唐。作為一款跨平臺(tái) app 的開(kāi)發(fā)者，李唐對(duì) iOS 和 Android 的小組件適配有著第一手的經(jīng)驗(yàn)，也親身體會(huì)過(guò)個(gè)中不為用戶(hù)所知的種種「坑」。

下面，我們就把麥克風(fēng)交給李唐，由他來(lái)為大家分析原生和定制 Android 系統(tǒng)小組件的功過(guò)得失。

找準(zhǔn)「定位」，是小組件的首要問(wèn)題

和型號(hào)總是已知、分辨率數(shù)值明確的 iPhone 不同，Android 設(shè)備的分辨率可謂千奇百怪，這種屏幕參數(shù)的碎片化，直接導(dǎo)致小組件無(wú)法按照開(kāi)發(fā)者設(shè)想的形狀進(jìn)行呈現(xiàn)。

以下圖為例，物理尺寸觀感基本相同的字母 a，在左側(cè)的低分辨率設(shè)備上顯示時(shí)所使用的實(shí)際物理像素?cái)?shù)量更少；所以反過(guò)來(lái)說(shuō)，一個(gè)長(zhǎng)寬均為 100 物理像素的正方形，在同尺寸低分辨率設(shè)備上的顯示效果往往會(huì)更大。

尺寸相同的兩個(gè)屏幕可能具有不同數(shù)量的像素 | 圖：Google

為了保證不同屏幕上的尺寸和觀感一致性，Android 平臺(tái)引入了密度無(wú)關(guān)像素（dp）這個(gè)度量單位來(lái)進(jìn)行輔助；桌面小組件也不例外。在 Android 12 之前，Google 允許開(kāi)發(fā)借助單位為 dp 的 minHeight 和 minWidth 兩項(xiàng)參數(shù)來(lái)設(shè)定小組件在主屏上的最小長(zhǎng)寬，希望通過(guò)這種方式來(lái)保證同一小組件在不同設(shè)備上的尺寸基本一致。

但密度問(wèn)題可以「無(wú)關(guān)」，精度問(wèn)題又會(huì)出來(lái)?yè)v亂。密度無(wú)關(guān)像素的計(jì)算過(guò)程涉及根據(jù)特定公式進(jìn)行計(jì)算轉(zhuǎn)換，由于轉(zhuǎn)換后的數(shù)值可能不是一個(gè)整數(shù)值，結(jié)果需要四舍五入，然后將結(jié)果歸入最為接近的整數(shù)坐標(biāo)網(wǎng)格內(nèi)。另外，因?yàn)檗D(zhuǎn)換公式中屏幕密度與物理像素的正相關(guān)關(guān)系，分辨率越高的設(shè)備，在遇到類(lèi)似情況時(shí)四舍五入的結(jié)果差異也就越大。

換言之，以 dp 作為小組件尺寸參考的做法只能保證小組件在視覺(jué)觀感上的大致相近，并且這種觀感差異會(huì)極大程度上收到高分辨率、高像素密度等因素影響。

開(kāi)發(fā)者為了避免小組件內(nèi)容顯示出現(xiàn)錯(cuò)位、異常，就不得不通過(guò)一些特定的布局手段來(lái)對(duì)小組件邊界進(jìn)行額外調(diào)整，比如邊距、比例、對(duì)齊規(guī)則等……這些額外的調(diào)整標(biāo)準(zhǔn)各不相同，最終小組件呈現(xiàn)出來(lái)的實(shí)際效果自然千差萬(wàn)別。

以下圖中的 Glance Weather 與 Apple Music 的小組件為例。盡管兩者名義上都是 4 × 1 尺寸，但前者追求將小組件鋪滿(mǎn)所在的網(wǎng)格區(qū)域，后者則以?xún)?nèi)容為中心，將小組件做得盡可能緊湊；放在一起，就會(huì)出現(xiàn)這種「逼死強(qiáng)迫癥」的景觀。

因此，李唐認(rèn)為直到 Android 12 之前，Android 的小組件都可以說(shuō)是「半成品」。從開(kāi)發(fā)者的角度觸發(fā)，他的記賬應(yīng)用錢(qián)跡最初進(jìn)行小組件開(kāi)發(fā)時(shí)就遇到過(guò)非常多的痛點(diǎn)，加上 Android 本身比較割裂的生態(tài)，Google 以往所提供的方法或者屬性在實(shí)際應(yīng)用中可以說(shuō)是沒(méi)什么效果的：

早前如果我們按照 Google 的官方文檔開(kāi)發(fā)小組件，這個(gè)小組件在不同廠(chǎng)商的手機(jī)上所呈現(xiàn)出來(lái)的尺寸大概率各不相同，同一個(gè)小組件在 4x5 和 5x6 的桌面中寬高比也完全不一樣……在經(jīng)歷了多輪嘗試后，我們最終放棄了對(duì)尺寸統(tǒng)一的奢望，以 MATCH_PARENT 這種方式將小組件尺寸渲染完全交給手機(jī)去自行處理——盡管它在某些機(jī)型又會(huì)帶來(lái)其他問(wèn)題。

那么，對(duì)小組件做出重大更新的 Android 12 是否解決了這個(gè)問(wèn)題呢？答案并不十分樂(lè)觀。

首先回顧一下 Android 12 對(duì)小組件的一個(gè)主要改進(jìn)和切入點(diǎn)：桌面網(wǎng)格（grid cells）。從這代系統(tǒng)開(kāi)始，小組件可以預(yù)設(shè)自己的目標(biāo)網(wǎng)格寬度和高度（通過(guò) targetCellWidth 和 targetCellHeight 兩項(xiàng)屬性）了。換句話(huà)說(shuō)，開(kāi)發(fā)者可以向桌面聲明其小組件預(yù)期呈現(xiàn)的形態(tài)，而不是放由系統(tǒng)進(jìn)行不精確的估算和轉(zhuǎn)換。這樣，用戶(hù)能夠直接感，特殊情況也更易提前考慮，在 Google 看來(lái)正是更好的選擇。

應(yīng)當(dāng)肯定，這個(gè)改進(jìn)是有效果的。直接將小組件與桌面網(wǎng)格匹配的做法，配合 Android 12 對(duì)小組件圓角半徑、響應(yīng)式布局以及精確式布局等方面的改進(jìn)，使得借助這些新規(guī)范進(jìn)行開(kāi)發(fā)的小組件在 Android 12 及以上版本系統(tǒng)中，已經(jīng)能夠呈現(xiàn)視覺(jué)效果幾乎一致的小組件尺寸了，比如下圖右側(cè)上方的 Google 天氣和 Google 相冊(cè)：

iOS 與 Android 的 2 × 2 小組件對(duì)比

但這套方案與 iOS 的小組件差距依然存在，因?yàn)?Android 12 的新方案并沒(méi)有解決所有問(wèn)題。網(wǎng)格能約束小組件的「外在」，但管不到「內(nèi)在」。Google 并未像 iOS 那樣為小組件規(guī)定更為嚴(yán)格的布局屬性，如果在網(wǎng)格內(nèi)部小組件與網(wǎng)格邊緣的邊距各不相同，依然會(huì)導(dǎo)致特定尺寸、尤其是不規(guī)則形狀小組件在視覺(jué)效果上的「不和諧」。

以下圖的兩個(gè)小組件為例，雖然名義上都是 3 × 2 尺寸，但一個(gè)內(nèi)部邊距大、一個(gè)內(nèi)部邊距小，看起來(lái)完全不像是一個(gè)尺寸的東西：

3 × 2 尺寸的不規(guī)則小組件，邊距就千奇百怪了立足小生態(tài)摳細(xì)節(jié)、嚴(yán)管理：MIUI 的嘗試

Google 的原生方案不好用，定制系統(tǒng)也就紛紛動(dòng)起了另起爐灶的心思。特別是 MIUI、OriginOS 等本就或多或少借鑒了 iOS 的國(guó)內(nèi)定制系統(tǒng)，眼看著 iOS 跟進(jìn)了小組件，繼續(xù)「從善如流」地打造一套更接近 Apple 做法的方案，是一個(gè)比較自然的選擇。

這方面，最有代表性的就是 MIUI。2021 年 9 月，MIUI「小部件」功能上線(xiàn)開(kāi)發(fā)版，同時(shí)上線(xiàn)的還有首批適配了小部件的第三方應(yīng)用，包括百度、QQ 音樂(lè)、高德地圖等。