在设计过程中，我们经常会遇到这样的需求：
把一条线3控制，左对齐左控制，右侧控制右对齐，中间控制，以填补剩余空间。
或者一列内放3个控件，上面的与顶部对齐，以下的沉在最底部，中间控件是弹性的。充满剩余空间。
情况一：水平布局
图示:
这是第一种情形。因为涉及到ImageView。想保持图片原比例不便使用LinearLayout的weight属性。
解决的方法：
1.外层套一个RelativeLayout
2.三个控件分别装进3个LinearLayout中。假如id分别为leftlayout，midlayout，rightlayout
leftlayout属性：android:layout_width="wrap_content"
rightlayout属性：android:layout_width="wrap_content"
midlayout属性： android:layout_width="match_parent"
android:layout_toLeftOf="@+id/rightlayout"
android:layout_toRightOf="@+id/leftlayout"
这样就能够达到两端控件分别左右对齐。中部控件填充剩余空间的效果。
上图效果的布局图示：
上图效果的代码：
<?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="34dp"
android:background="#FFFFFF"
android:orientation="horizontal" >
<LinearLayout
android:id="@+id/choosetags_listview_item_leftlayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true">
<ImageView
android:id="@+id/taglistview_item_ico"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_gravity="center_vertical"
android:layout_marginBottom="2dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginTop="2dp"
android:contentDescription="@string/app_name"
android:src="@drawable/tag_ico_movie" />
</LinearLayout>
<LinearLayout
android:id="@+id/choosetags_listview_item_midlayout"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_centerVertical="true"
android:layout_toLeftOf="@+id/choosetags_listview_item_rightlayout"
android:layout_toRightOf="@+id/choosetags_listview_item_leftlayout" >
<com.coolletter.util.MarqueeTextView
android:id="@+id/taglistview_item_name"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical"
android:checkMark="?android:attr/textCheckMark"
android:ellipsize="marquee"
android:focusableInTouchMode="true"
android:gravity="center_vertical"
android:marqueeRepeatLimit="marquee_forever"
android:paddingEnd="5dp"
android:paddingStart="5dp"
android:scrollHorizontally="true"
android:singleLine="true"
android:textColor="#000000"
android:textSize="15dp" />
</LinearLayout>
<LinearLayout
android:id="@+id/choosetags_listview_item_rightlayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true" >
<TextView
android:id="@+id/taglistview_item_newnum"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="253"
android:textColor="#000000" >
</TextView>
</LinearLayout>
</RelativeLayout>
情形二：垂直布局
图示：
垂直布局方案：
1.外层放一个RealtiveLayout
2.内部三个控件分别装进3个LinearLayout中，id设为topayout。midlayout，bottomlayout
toplayout属性：android:layout_width="wrap_content"
bottomlayout属性：android:layout_width="wrap_content"
midlayout属性： android:layout_width="match_parent"
android:layout_below="@+id/toplayout"
android:layout_above="@+id/bottomlayout"
布局：
代码：
<?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:background="#DCDCDC"
android:orientation="vertical" >
<LinearLayout
android:id="@+id/letter_newtext_toplayout"
android:layout_width="fill_parent"
android:layout_height="45dp"
android:layout_alignParentTop="true"
android:background="#FFFAF0"
android:orientation="horizontal" >
<TextView
android:id="@+id/letter_newtext_cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_weight="1"
android:gravity="center_horizontal"
android:text="Cancel"
android:textColor="#000000"
android:textSize="16dp" />
<TextView
android:id="@+id/letter_newtext_submit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_weight="1"
android:gravity="center_horizontal"
android:text="Submit"
android:textColor="#000000"
android:textSize="16dp" />
</LinearLayout>
<LinearLayout
android:id="@+id/letter_newtext_mainlayout"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_above="@+id/letter_newtext_deliver"
android:layout_below="@+id/letter_newtext_toplayout"
android:orientation="vertical"
>
<EditText
android:id="@+id/letter_newtext_content"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="5dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginTop="5dp"
android:background="@drawable/corners_bg"
android:gravity="top"
android:inputType="textMultiLine"
android:textColor="#000000" />
</LinearLayout>
<View
android:id="@+id/letter_newtext_deliver"
android:layout_above="@+id/letter_newtext__bottomlayout"
android:layout_width="fill_parent"
android:layout_height="0.5dp"
android:background="#00BFFF" />
<LinearLayout
android:id="@+id/letter_newtext__bottomlayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:gravity="bottom"
android:orientation="horizontal" >
<ImageView
android:id="@+id/letter_newtext_ico_tag"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginLeft="5dp"
android:background="@drawable/letter_new_ico_maintag" />
<TextView
android:id="@+id/letter_newtext_tag_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:textColor="#000000"
android:textSize="15dp" />
</LinearLayout>
</RelativeLayout>
当这样的情况中间的控件是一个ScrollView时，也使用这样的办法。
就能实现ScrollView充满上下两个控件中间的区域。
版权声明：本文博客原创文章。博客，未经同意，不得转载。
【Android开发日记】妙用 RelativeLayout 实现3
段布局
时间： 2024-10-11 11:38:35