簡體   English   中英

Android 相對布局和不同屏幕尺寸/設備

[英]Android relative layout and different screen sizes/devices

我剛剛寫了所有這些,這個小紅條告訴我我不能發布圖片或兩個以上的鏈接。 所以如果你能引用這張 Imgur 專輯,那就太好了。 謝謝你。

我在這里相對較新,甚至對 android 編程也較新。 我正在嘗試編寫一個強調視覺吸引力而不是功能吸引力的應用程序。 這與任務或工作無關,只是我想嘗試的東西。

所以我遇到了障礙。 當在不同的模擬器和設備中時,我正在處理一些TextView框的布局。 我一直在讀這個,但它有點長,它似乎並沒有解決我的問題,老實說,它只是在我的頭上。

所以這是我的問題。

我有一些TextView框,我在 XML 中使用了layout屬性,在 Android Studio 中帶有 Nexus 4 模擬設備的設計窗口中,它看起來像這樣(圖 1)

代碼如下所示:

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/anger"
    android:id="@+id/angertv"
    android:textSize="28sp"
    android:textStyle="bold"
    android:typeface="serif"
    android:textColor="#FFFFFF"
    android:layout_centerVertical="true"
    android:layout_alignParentEnd="true"
    android:layout_marginEnd="36dp"/>
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/happiness"
    android:id="@+id/happinesstv"
    android:textSize="28sp"
    android:textStyle="bold"
    android:typeface="serif"
    android:textColor="#FFFFFF"
    android:layout_centerVertical="true"
    android:layout_alignParentStart="true"
    android:layout_marginStart="34dp" />
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/fear"
    android:id="@+id/feartv"
    android:textSize="28sp"
    android:textStyle="bold"
    android:typeface="serif"
    android:textColor="#FFFFFF"
    android:layout_alignParentTop="true"
    android:layout_alignParentEnd="true"
    android:layout_marginTop="165dp"
    android:layout_marginEnd="100dp" />
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/sadness"
    android:id="@+id/sadnesstv"
    android:textSize="28sp"
    android:textStyle="bold"
    android:typeface="serif"
    android:textColor="#FFFFFF"
    android:layout_alignParentBottom="true"
    android:layout_alignParentStart="true"
    android:layout_marginBottom="165dp"
    android:layout_marginStart="66dp" />
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/surprise"
    android:id="@+id/surprisetv"
    android:textSize="28sp"
    android:textStyle="bold"
    android:typeface="serif"
    android:textColor="#FFFFFF"
    android:layout_alignParentTop="true"
    android:layout_alignParentStart="true"
    android:layout_marginTop="165dp"
    android:layout_marginStart="60dp" />
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/disgust"
    android:id="@+id/disgusttv"
    android:textSize="28sp"
    android:textStyle="bold"
    android:typeface="serif"
    android:textColor="#FFFFFF"
    android:layout_alignParentBottom="true"
    android:layout_alignParentEnd="true"
    android:layout_marginBottom="165dp"
    android:layout_marginEnd="74dp" />

我一直在使用父邊框在設備屏幕上定位 6 個單詞。 但是到了運行它的時候,它在 Nexus 5 模擬器屏幕上看起來像這樣(圖 2),而在實際的 HTC One m8 上,它看起來像這樣(圖 3)。

所以我嘗試這樣的事情:

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/center"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/anger"
    android:id="@+id/angertv"
    android:textSize="28sp"
    android:textStyle="bold"
    android:typeface="serif"
    android:textColor="#FFFFFF"
    android:layout_centerVertical="true"
    android:layout_toEndOf="@+id/center"
    android:layout_marginStart="70dp" />
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/happiness"
    android:id="@+id/happinesstv"
    android:textSize="28sp"
    android:textStyle="bold"
    android:typeface="serif"
    android:textColor="#FFFFFF"
    android:layout_centerVertical="true"
    android:layout_toStartOf="@+id/center"
    android:layout_marginEnd="67dp" />
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/fear"
    android:id="@+id/feartv"
    android:textSize="28sp"
    android:textStyle="bold"
    android:typeface="serif"
    android:textColor="#FFFFFF"
    android:layout_above="@+id/center"
    android:layout_toEndOf="@+id/center"
    android:layout_marginBottom="67dp"
    android:layout_marginStart="30dp" />
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/sadness"
    android:id="@+id/sadnesstv"
    android:textSize="28sp"
    android:textStyle="bold"
    android:typeface="serif"
    android:textColor="#FFFFFF"
    android:layout_below="@+id/center"
    android:layout_toStartOf="@+id/center"
    android:layout_marginTop="68dp"
    android:layout_marginEnd="12dp" />
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/surprise"
    android:id="@+id/surprisetv"
    android:textSize="28sp"
    android:textStyle="bold"
    android:typeface="serif"
    android:textColor="#FFFFFF"
    android:layout_above="@+id/center"
    android:layout_toStartOf="@+id/center"
    android:layout_marginBottom="67dp"
    android:layout_marginEnd="10dp" />
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/disgust"
    android:id="@+id/disgusttv"
    android:textSize="28sp"
    android:textStyle="bold"
    android:typeface="serif"
    android:textColor="#FFFFFF"
    android:layout_below="@+id/center"
    android:layout_toEndOf="@+id/center"
    android:layout_marginTop="68dp"
    android:layout_marginStart="16dp" />

我使用了一個額外的TextView (ID'd center ),它與設備的中心對齊,它是空的,並使用它來將其他視圖與其中的文本對齊。 這些是結果。

設計窗口 Nexus 4:(圖 4)

Nexus 5 模擬器:(圖 5)

HTC One m8:(圖 6)

它更好但不完全。 理想情況下,這些詞應該留在我制作的餡餅切片內的一個地方。 我一直在環顧四周,但似乎沒有什么具體的,而且由於我是初學者,我似乎無法從人們對其他可能相似但不太像這種情況的問題的答案中推斷出來。

如果有人可以向我解釋我如何解決這個問題,或者為我指明正確的方向,我將不勝感激。 謝謝你。

您可以使用@dimen不同的@dimen文件,以便不同的屏幕大小將具有不同的字體大小。

android:textSize="@dimen/text_28"

在不同目錄中具有維度值:

res/values/dimen.xml

<dimen name="text_28">28sp</dimen>

res/values-600dp/dimen.xml

<dimen name="text_28">22sp</dimen>

等等。

您將不得不嘗試使用不同的字體大小和屏幕大小,但您應該能夠找到可行的方法。

http://developer.android.com/training/multiscreen/screensizes.html#TaskUseSizeQuali

此頁面顯示了一些流行的設備指標: https : //design.google.com/devices/

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM