如何為所有屏幕尺寸制作靈活的 UI？

Question

如何讓我的 ui 在不同屏幕上看起來相同？

我制作了一個應用程序並測試它可以在 2 部不同屏幕尺寸的不同手機上運行，​​它看起來非常不同。

以下是一些截圖：

手機 1：華為 P20 lite (5.83")：

https://drive.google.com/file/d/1_wa9bcEa46Ygduo47Q8DNTu9-DIhOv5h/view?usp=drivesdk

手機 2：三星 Galaxy J1（4.31 英寸）：

https://drive.google.com/file/d/1fNDLea4Vv6LcX-vy-T1S4-XyhHN59pKD/view?usp=drivesdk

我怎樣才能讓它們看起來一樣？

Answer 1

您可以通過以下選項實現此目的

選項 1：為每個設備分辨率制作單獨的布局文件

選項 2：使用下面的庫它將自動支持多個屏幕。

SDP： https : //github.com/intuit/sdp SSP： https : //github.com/intuit/ssp

Answer 2

我認為您需要花更多時間閱讀 android 文檔，特別關注：

1. DP vs SP - 字體大小。 了解您應該使用哪種字體以及字體設置（操作系統默認值或用戶覆蓋）如何影響為每種字體設置的大小。 通過這個 SO 討論 - “px”、“dip”、“dp”和“sp”之間有什么區別？

2. 了解 android 上可用的不同布局以及何時以及如何使用它們。 花一些時間了解他們每個人的獨特屬性。 看看這個https://developer.android.com/training/constraint-layout

3. 了解填充和邊距的工作原理以及它們之間的區別。 如果您使用的是 recyclerview，請了解當您將它們應用於 recyclerview 與 child 時這些行為的行為。 嘗試不同的組合並直觀地查看輸出是最好的學習方式。
4. 啟用“顯示布局邊界”以幫助您調試布局問題。 看： https : //developer.android.com/studio/debug/dev-options

您不應該需要任何庫來實現您的目標。 布局看起來非常簡單。

Answer 3

將以下添加到您的項目級別 Gradle 文件中：

compile 'com.intuit.sdp:sdp-android:1.0.5'

用法：在代碼中，無論您在何處指定10dp 等尺寸，都將其更改為@dimen/_10sdp 。 就像我在此示例 ImageView 中指定的那樣。

        <ImageView
            android:id="@+id/your_image"
            android:layout_marginTop="@dimen/_10sdp"
            android:layout_marginBottom="@dimen/_10sdp"
            android:layout_width="@dimen/_100sdp"
            android:layout_height="@dimen/_100sdp"
            android:src="@drawable/logo"/>

這將使您的應用程序在不同設備上看起來相同。