cancel
Showing results for 
Search instead for 
Did you mean: 

【冷知識】調整Android的版面與文字大小

BigBunny
Level 10

我們今天要來討論的就如題目所說,我們來討論如何調整Android的版面大小。

調整的方式非常簡單,我們可以依循下列步驟:

設定=>顯示=>接著找到「顯示調整」底下的「螢幕大小和文字」選項。

不同品牌的手機對於選項的名稱和排序可能有點不同,上述的選項是Android系統預設的項目名稱。

在「螢幕大小與文字」底下,通常最頂部會有幾種不同的資訊頁面可以切換。

以華碩的手機來說,頂部會給我們的範例依序是「模擬的社群軟體頁面」「UI使用者介面」「設定選項介面」「純文字排版範例」,共計四種範例。

Screenshot_20231125-162637091.jpg

↳ 底下兩個拉桿就是影響整個手機顯示排版最關鍵的選項,「字形大小」和「顯示大小」

 

Android版面調整屬於「相對」的調整

注意,「字形大小」和「顯示大小」的選項,在Android系統當中都屬於一種抽象的概念。

我們在這裡調整的內容是一種相對值不是「絕對參數」而是「相對參數」。

把「字形大小」調大,意思不是指定系統把顯示字按照字級(Font-size)來調整。在這裡調整的意思就只是把字形調大或調小,不是像word文件中調整字級、或是使用多少像素點來顯示一個字體的這種概念。

 

「字形大小」的影響

「字型大小」這個選項非常好理解,就是系統顯示的字形大小。

這不太需要什麼解釋,就只是調整字體大小。

根據我的觀察,Android「字形大小」的選項採用的應該是「比例縮放」的改念。

舉例來說,原本有一個大小是10公分的文字,我們在選項裡面往右調大一格像是放大1.5倍,原本10公分的文字就變成15公分。這裡只是為了方便大家理解所以用實際的長度單位來舉例。

因為是按照比例來放大,所以螢幕上原本就已經很大的字體就會被放得更大。

把字形大小的選項往右調整超過一半的時候,會開始對手機顯示的排版出現比較明顯的影響。

另外,文字的字形、粗體也會讓版面出現一點變化,但差異不如字型和顯示大小這麼明顯。

 

「顯示大小」的影響

顯示大小調整和字形大小的意思有點不同。

如果我們從系統給我們的圖例來看,可以發現當我們把「顯示大小」調大,系統的圖示、按鈕也跟著變大。

實際上這裡調整的大小並不完全是圖示、按鈕這麼單純。

比較完整一點的解釋:這個選項改變的是同樣的範圍裏面容納的資訊密度。

舉例來說,10公分x10公分的範圍,原本我們在裡面塞滿二十五個2公分x2公分的正方形,接著我們把正方形的邊長縮短成1公分,同樣範圍裏面就有一百個正方形。

顯示大小的邏輯就是類似上述的概念。

然後可能就會有人提出疑問:耶?不對啊?我把顯示大小調「大」,圖示和按鈕都變大,資訊的密度其實變低了,說反了對吧?

我其實沒有說反,是Android系統為了讓大多數的用戶理解這個選項的運作,所以把這個選項轉換成大多數人容易理解的解釋。

選項調整的內容確實是資訊密度,但控制的邏輯是顛倒的。

把顯示大小調「大」,資訊密度會變「小」

把顯示大小調「小」,資訊密度會變「大」

 

螢幕排版依循的比例

Android原生系統根據不同螢幕大小、不同的解析度,會自動調整排版,這個排版主要依循的單位是dp(
Density-Independent Pixel)。內容實在太複雜,有興趣的人可以另外找資料自己研究。

這邊放兩個developer的解說給各位參考:

支援不同的螢幕大小

螢幕相容性總覽

 

「顯示大小」對應了開發人員選項中的「最小寬度」

顯示大小調整的內容,等於開發者選項當中的「最小寬度」。

以華碩ROG Phone 5舉例,「顯示大小」五個段數從左到右對應的「最小寬度」數值依序為485、411(預設數值)、375、345、320 dp

只要我們把調整的撥桿拉到特定的檔位,開發者選項裡面的最小寬度也會跟著一起變動。

我們也可以直接在「最小寬度」輸入數值。

注意:最小寬度設定的數值值盡可能不要超過「顯示大小」預定的上限和下限。

以ROG Phone 5舉例,dp數值盡可能不要超過485,也不要低於320。

指定的dp數值太大,某些按鈕選項可能會小到你很難點選。dp數值太小,按鈕選項有可能會超出螢幕邊界,這可能會需要把整個裝置恢復成出廠狀態才能救回來。

 

「顯示大小」的實際效果

用文字敘述還是很複雜,接下來我們用圖片來看看實際會是什麼效果。

Screenshot_20231125-150021065.jpg Screenshot_20231125-150101888.jpg

↳ 485 dp

Screenshot_20231125-150218329.jpg Screenshot_20231125-150242838.jpg

↳ 411 dp

Screenshot_20231125-150308721.jpg Screenshot_20231125-150325553.jpg

↳ 375 dp

Screenshot_20231125-150759979.jpg Screenshot_20231125-150812405.jpg

↳ 345 dp

Screenshot_20231125-150932964.jpg Screenshot_20231125-150944846.jpg

↳ 320 dp

從圖片來看,顯示大小的確和資訊密度有關。

但排版的樣式其實是很複雜的。舉例來說,我們可以發現左邊的新聞頁面在485 dp的模式下,資訊的密度確實有提升,但畫面的左右沒有「滿版」,而是出現了兩道空白。

這是因為Google在這個新聞的版面另外設定左右橫寬的最小數值。

應該是牽涉到圖片在網頁排版的最小寬度,當我們設定的dp數值大於這個新聞頁面圖片的預設數值,系統會用圖片的最小寬度作為整個版面的橫寬極限值,使得螢幕左右兩邊出現留白。

但在Wahoo SYSTM的APP底下,「顯示大小」的效果就顯得非常完美。

在485 dp的模式下,顯示的資訊量確實的增加,甚至連畫面頂部的排版內容都出現了變化。這是因為開發人員在開發這個APP的時候,有考慮到不同的排版密度去調整排版的內容,甚至連排版的樣式也會在越過某些dp的時候做出調整。

理論上「顯示效果」也會影響遊戲軟體的介面樣式。

舉例來說,如果你覺得遊戲裡的介面選項、按鈕圖示太小,可以試著把「顯示大小」調「大」。相反,如果覺得介面選項、按鈕圖示太大導致畫面太擠,可以把「顯示大小」調「小」。

但「顯示效果」不一定會對每一個軟體都有作用。也有可能開發商是按照解析度綁定介面選單的大小,那麼手機的「顯示大小」就不會產生效果。

669 Views
0 REPLIES 0