Android基礎(chǔ):相對布局管理器RelativeLayout
相對布局管理器是基于一個參考點而言的布局管理器。就像Web開發(fā)中的相對路徑的概念,是基于一定的參考點而創(chuàng)建的。在Android中的相對布局管理器就是在一個參考點的四周(上,下,左,右)布局的管理器。
下面來看一下RelativeLayout的文檔:
它的繼承結(jié)構(gòu)為:
- java.lang.Object
- ↳ android.view.View
- ↳ android.view.ViewGroup
- ↳ android.widget.RelativeLayout
下面在Eclipse中新建一個項目來看一下相對布局管理器RelativeLayout的使用:
- <?xml version="1.0" encoding="utf-8"?>
- <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:orientation="vertical" >
- <ImageView
- android:id="@+id/img1"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:src="@drawable/ic_launcher" />
- <ImageView
- android:id="@+id/img2"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:src="@drawable/google_plus"
- android:layout_toRightOf="@+id/img1" />
- </RelativeLayout>
我們在main.xml中將布局管理器聲明為RelativeLayout,之后創(chuàng)建了兩個ImageView組件用來顯示兩幅圖片,其中在第二個 ImageView組件上設(shè)置了layout_toRightOf屬性,也就是設(shè)置相對于某組件的右側(cè),這里填入的是組件ID的值,那么這里也就是說我們 的img2相對于img1的位置是右側(cè)。下面運行程序,我們看到如下效果:
很明顯,第二幅圖片放置在了***副圖片的右側(cè),下面往代碼中再加入一個TextView組件:
- <TextView android:id="@+id/txt"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:text="這里是一些顯示文字"
- android:layout_below="@+id/img2"/>
這個組件也很簡單,我們設(shè)置了layout_below屬性,說明要放置在第二幅圖片的下面,那么運行程序,我們得到如下的顯示效果:
沒有問題,文字確實在第二幅片的下面了,但是卻頂頭顯示了,如果***副圖片小于第二幅圖片,是會產(chǎn)生覆蓋效果的,我們調(diào)整位置來看一下,調(diào)整代碼為:
- <ImageView
- android:id="@+id/img1"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:src="@drawable/ic_launcher"
- android:layout_toRightOf="@+id/img2" />
- <ImageView
- android:id="@+id/img2"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:src="@drawable/google_plus" />
- <TextView android:id="@+id/txt"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:text="這里是一些顯示文字"
- android:layout_below="@+id/img1"/>
這里不再解釋代碼的含義,直接運行,我們看到:
文字覆蓋***副圖片顯示了,那么需要繼續(xù)對它進(jìn)行設(shè)置:
- <TextView android:id="@+id/txt"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:text="這里是一些顯示文字"
- android:layout_below="@+id/img1"
- android:layout_toRightOf="@+id/img2"/>
再次運行程序,我們可以看到如下效果:
文字就在img1的下面并且在img2的右側(cè)了。此時文字的下側(cè)和img2的右側(cè)還有一定空間,我們再放置一個Button組件:
- <Button
- android:id="@+id/btn"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:text="按鈕"
- android:layout_below="@+id/txt"
- android:layout_toRightOf="@+id/img2"/>
再次運行程序,我們就得到了如下效果:
和其它布局管理器一樣,我們可以通過Java代碼來實現(xiàn)對相對布局管理器的控制,下面首先來看一下RelativeLayout.LayoutParams的文檔:
其繼承結(jié)構(gòu)為:
- java.lang.Object
- ↳ android.view.ViewGroup.LayoutParams
- ↳ android.view.ViewGroup.MarginLayoutParams
- ↳ android.widget.RelativeLayout.LayoutParams
只是在代碼中控制相對布局管理器時需要設(shè)置一些規(guī)則,也就是我們上面看到的layout_toRightOf和layout_below等,下面來看一下代碼:
- package org.ourpioneer;
- import android.app.Activity;
- import android.os.Bundle;
- import android.view.ViewGroup;
- import android.widget.EditText;
- import android.widget.RelativeLayout;
- public class RelativeLayoutDemoActivity extends Activity {
- @Override
- public void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- super.setContentView(R.layout.main);// 讀取已有的布局管理器
- RelativeLayout relativeLayout = (RelativeLayout) super
- .findViewById(R.id.rLayout);// 獲取相對布局管理器rLayout
- RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(
- ViewGroup.LayoutParams.FILL_PARENT,
- ViewGroup.LayoutParams.FILL_PARENT);// 設(shè)置布局管理器參數(shù)
- params.addRule(RelativeLayout.BELOW, R.id.btn);// 設(shè)置放置規(guī)則
- EditText edit = new EditText(this);// 創(chuàng)建EditText組件
- relativeLayout.addView(edit,params);
- }
- }
編寫代碼之前,我們需要在main.xml中為我們的布局管理器添加ID屬性,也就是rLayout,之后我們可以在代碼中對它進(jìn)行控制,這里我們在已有 的布局管理器之中繼續(xù)添加組件,也就是要往按鈕下放置一個編輯框,那么我們設(shè)置布局管理器參數(shù)都為FILL_PARENT,就是要填充整個屏幕,然后規(guī)則 定位在btn的下側(cè),之后往布局管理器中添加組件,運行程序,我們就可以看到: