<?xml version="1.0" encoding="utf-8"?> <FrameLayout android:id="@+id/FrameLayout01" android:layout_width="fill_parent" android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android"> <ImageView android:id="@+id/ImageView01" android:src="@drawable/p1" android:layout_width="wrap_content" android:layout_height="wrap_content"></ImageView> <ImageView android:id="@+id/ImageView02" android:src="@drawable/p2" android:layout_width="wrap_content" android:layout_height="wrap_content"></ImageView> <ImageView android:id="@+id/ImageView03" android:src="@drawable/p3" android:layout_width="wrap_content" android:layout_height="wrap_content"></ImageView> </FrameLayout>
下面看一个LinearLayout的例子:别被例子的长度吓住,仔细看一下其实就是一个LinearLayout中放5个TextView标签而已,TextView相当于Html标签中的Label。
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_horizontal" > <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="给小宝宝起个名字:" android:textSize="20px" android:textColor="#0ff" android:background="#333" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="遥遥是男孩的小名" android:textSize="20px" android:textColor="#0f0" android:background="#eee" android:layout_weight="3" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="瑶瑶是女孩的小名" android:textColor="#00f" android:textSize="20px" android:background="#ccc" android:layout_weight="1" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="海因是男孩的大名" android:textColor="#f33" android:textSize="20px" android:background="#888" android:layout_weight="1" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="海音是女孩的大名" android:textColor="#ff3" android:textSize="20px" android:background="#333" android:layout_weight="1" /> </LinearLayout>
<?xml version="1.0" encoding="utf-8"?> <AbsoluteLayout android:id="@+id/AbsoluteLayout01" android:layout_width="fill_parent" android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android" android:background="#fff"> <ImageView android:src="@drawable/android" android:layout_y="40dip" android:layout_width="wrap_content" android:layout_x="35dip" android:id="@+id/ImageView01" android:layout_height="wrap_content"> </ImageView> <TextView android:layout_height="wrap_content" android:layout_width="fill_parent" android:id="@+id/TextView01" android:text="Android2.2 学习指南" android:textColor="#0f0" android:textSize="28dip" android:layout_y="330dip" android:layout_x="35dip"> </TextView> <TextView android:layout_height="wrap_content" android:layout_width="fill_parent" android:id="@+id/TextView02" android:text="图文并茂,理论清晰,操作性强" android:textColor="#333" android:textSize="18dip" android:layout_y="365dip" android:layout_x="35dip"> </TextView> </AbsoluteLayout>
下面我们用相对布局再做一次上面的例子,首先放置一个图片,其它两个文本分别相对上一个元素定位:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout android:id="@+id/RelativeLayout01" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="#fff" xmlns:android="http://schemas.android.com/apk/res/android"> <ImageView android:id="@+id/ImageView01" android:src="@drawable/android" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginTop="40dip" > </ImageView> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/TextView01" android:text="Android2.2 学习指南" android:textColor="#0f0" android:textSize="28dip" android:layout_below="@id/ImageView01" android:layout_centerHorizontal="true" android:layout_marginTop="10dip"> </TextView> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/TextView02" android:text="图文并茂,理论清晰,操作性强" android:textColor="#333" android:textSize="18dip" android:layout_below="@id/TextView01" android:layout_centerHorizontal="true" android:layout_marginTop="5dip"> </TextView> </RelativeLayout>
我们再把上面的例子重新做一遍,这一次多放一些属性在里面,大家试验一下:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout android:id="@+id/RelativeLayout01" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="#cfff" 色彩的设置是argb,第一个c是透明度 xmlns:android="http://schemas.android.com/apk/res/android"> <ImageView android:id="@+id/ImageView01" android:src="@drawable/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="40dip" android:layout_centerHorizontal="true"> </ImageView> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/TextView01" android:text="Android2.2 学习指南" android:textColor="#0f0" android:textSize="28dip" android:layout_below="@id/ImageView01" android:layout_centerHorizontal="true" android:layout_marginTop="10dip"> </TextView> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/TextView02" android:text="图文并茂,理论清晰,操作性强" android:textColor="#333" android:textSize="18dip" android:layout_below="@id/TextView01" android:layout_centerHorizontal="true" android:layout_marginTop="5dip"> </TextView> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/TextView03" android:text="alignTop" android:textColor="#333" android:textSize="18dip" android:layout_alignTop="@id/ImageView01" 和ImageView01上边缘对齐 android:layout_centerHorizontal="true"> </TextView> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/TextView04" android:text="alignLeft" android:textColor="#333" android:textSize="18dip" android:layout_alignLeft="@id/ImageView01" android:layout_centerHorizontal="true"> </TextView> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/TextView05" android:text="alignRight" android:textColor="#333" android:textSize="18dip" android:layout_alignRight="@id/ImageView01" android:layout_centerHorizontal="true"> </TextView> <TextView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/TextView06" android:text="alignBottom" android:textColor="#333" android:textSize="18dip" android:layout_alignBottom="@id/ImageView01" android:layout_centerHorizontal="true"> </TextView> </RelativeLayout>