本文將告訴你如何讓你的應用程序支持各種不同屏幕大小,主要通過以下幾種辦法:
讓你的佈局能充分的自適應屏幕
根據屏幕的配置來加載合適的UI佈局
確保正確的佈局應用在正確的設備屏幕上
提供可以根據屏幕大小自動伸縮的圖片
使用 "wrap_content" 和 "match_parent"
為瞭確保你的佈局能夠自適應各種不同屏幕大小,你應該在佈局的視圖中使用"wrap_content"和"match_parent"來確定它的寬和高。如果你使用瞭"wrap_content",相應視圖的寬和高就會被設定成剛好能夠包含視圖中內容的最小值。而如果你使用瞭"match_parent"(在Android API 8之前叫作"fill_parent"),就會讓視圖的寬和高延伸至充滿整個父佈局。
通過使用"wrap_content"和"match_parent"來替代硬編碼的方式定義視圖大小,你的視圖要麼僅僅使用瞭需要的那邊一點空間,要麼就會充滿所有可用的空間。例如:
[html] <LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout android:layout_width="match_parent"
android:id="@+id/linearLayout1"
android:gravity="center"
android:layout_height="50dp">
<ImageView android:id="@+id/imageView1"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="@drawable/logo"
android:paddingRight="30dp"
android:layout_gravity="left"
android:layout_weight="0" />
<View android:layout_height="wrap_content"
android:id="@+id/view1"
android:layout_width="wrap_content"
android:layout_weight="1" />
<Button android:id="@+id/categorybutton"
android:background="@drawable/button_bg"
android:layout_height="match_parent"
android:layout_weight="0"
android:layout_width="120dp"
style="@style/CategoryButtonStyle"/>
</LinearLayout>
<fragment android:id="@+id/headlines"
android:layout_height="fill_parent"
android:name="com.example.android.newsreader.HeadlinesFragment"
android:layout_width="match_parent" />
</LinearLayout>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout android:layout_width="match_parent"
android:id="@+id/linearLayout1"
android:gravity="center"
android:layout_height="50dp">
<ImageView android:id="@+id/imageView1"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="@drawable/logo"
android:paddingRight="30dp"
android:layout_gravity="left"
android:layout_weight="0" />
<View android:layout_height="wrap_content"
android:id="@+id/view1"
android:layout_width="wrap_content"
android:layout_weight="1" />
<Button android:id="@+id/categorybutton"
android:background="@drawable/button_bg"
android:layout_height="match_parent"
android:layout_weight="0"
android:layout_width="120dp"
style="@style/CategoryButtonStyle"/>
</LinearLayout>
<fragment android:id="@+id/headlines"
android:layout_height="fill_parent"
android:name="com.example.android.newsreader.HeadlinesFragment"
android:layout_width="match_parent" />
</LinearLayout>註意上面的例子中是如何使用"wrap_content"和"match_parent"來給控件定義寬高的,這讓整個佈局可以正確地適應不同屏幕的大小,甚至是橫屏。
下圖是這個佈局分別在豎屏和橫屏時顯示的結果,註意控件的寬和高是根據屏幕自適應的。
使用RelativeLayout
通過多層嵌套LinearLayout和組合使用"wrap_content"和"match_parent"已經可以構建出足夠復雜的佈局。但是LinearLayout無法允許你準確地控制子視圖之前的位置關系,所有LinearLayout中的子視圖隻能簡單的一個挨著一個地排列。如果你需要讓子視圖能夠有更多的排列方式,而不是簡單地排成一行或一列,使用RelativeLayout將會是更好的解決方案。RelativeLayout允許佈局的子控件之間使用相對定位的方式控制控件的位置,比如你可以讓一個子視圖居屏幕左側對齊,讓另一個子視圖居屏幕右側對齊。
例如:
[html]
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="https://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Type here:"/>
<EditText
android:id="@+id/entry"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/label"/>
<Button
android:id="@+id/ok"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/entry"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dp"
android:text="OK" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="@id/ok"
android:layout_alignTop="@id/ok"
android:text="Cancel" />
</RelativeLayout>