Android下的布局

来源：互联网发布：pc蛋蛋幸运28算法公式编辑：程序博客网时间：2024/06/03 09:26

控件的相对位置

需求：在屏幕上写一个十字型的button

一：通过属性控制布局和窗体的位置关系（前提：layout_width和layout_height 至少有一个为warp_content）

代码：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:layout_gravity="center"//这里可以设置为：center left right等表现为①②③    android:orientation="vertical" >    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="十字型button" />    <LinearLayout         android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="center_horizontal"        >       <Button         android:layout_width="wrap_content"        android:layout_height="wrap_content" />            </LinearLayout>    <LinearLayout         android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="center_horizontal">        <Button         android:layout_width="wrap_content"        android:layout_height="wrap_content"        />        <Button         android:layout_width="wrap_content"        android:layout_height="wrap_content"        />        <Button         android:layout_width="wrap_content"        android:layout_height="wrap_content"        /></LinearLayout><LinearLayout         android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="center_horizontal">    <Button         android:layout_width="wrap_content"        android:layout_height="wrap_content"        /></LinearLayout></LinearLayout>

//具体表现如下①②③

二通过设定值确定与边框的位置关系

android:layout_marginLeft指该控件距离边父控件的边距，

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="fill_parent"    android:layout_height="match_parent"    android:layout_marginLeft="30dip"//用数值方法设置与边缘的位置关系    android:layout_marginTop="70dip"        android:orientation="vertical" >    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="十字型button" />

控件中元素的位置

android:paddingLeft指该控件内部内容，如文本距离该控件的边距。

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="控件的相对位置" />    <LinearLayout         android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="center_horizontal"        >       <Button         android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="4" />       </LinearLayout>    <LinearLayout    android:layout_width="fill_parent"    android:layout_height="wrap_content" >        <Button         android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginLeft="1dip"        android:text="1"/>        <Button            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_marginLeft="277px"            android:text="2"/></LinearLayout><LinearLayout    android:layout_width="wrap_content"    android:layout_height="wrap_content"     android:layout_gravity="center_horizontal"    ><Button    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:gravity="left"    android:text="3" /></LinearLayout></LinearLayout>

控件中内容的相对位置2

below 属性的使用

 <RelativeLayout         android:layout_width="fill_parent"        android:layout_height="wrap_content">        <Button             android:layout_width="wrap_content"        android:layout_height="wrap_content"            android:text="12"/>        <Button             android:layout_width="wrap_content"        android:layout_height="wrap_content"            android:text="13"            android:layout_alignParentRight = "true" />        <Button             android:id="@+id/bt5"            android:layout_centerHorizontal="true"            android:layout_width="wrap_content"        android:layout_height="wrap_content"            android:text="14"/>        <Button             android:layout_below="@id/bt5"            android:layout_centerHorizontal="true"//如果没有设置居中属性的话控件会放在左边            android:layout_width="wrap_content"        android:layout_height="wrap_content"            android:text="15"/>         </RelativeLayout>

paddingLeft和marginLeft

android:paddingLeft="80px"按钮上设置的内容（例如图片）离按钮左边边界80个像素android:layout_marginLeft="80px"整个按钮离左边设置的内容80个像素

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content" >        <EditText             android:layout_marginLeft="80dip"            android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="请输入姓名"        android:background="#ff0000"            />    </LinearLayout>    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content" >        <EditText             android:paddingLeft="80dip"            android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="请输入电话"        android:background="#ff0000"                    />    </LinearLayout>

layout_weight

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >    <LinearLayout         android:layout_width="match_parent"    android:layout_height="wrap_content"    android:orientation="horizontal">        <TextView             android:layout_width="wrap_content"    android:layout_height="wrap_content"            android:text="1"            android:layout_weight="1"             android:background="#ffccbb"            />        <TextView             android:layout_width="wrap_content"    android:layout_height="wrap_content"            android:text="2"            android:layout_weight="2"             android:background="#ff0000"            />        <TextView             android:layout_width="wrap_content"    android:layout_height="wrap_content"            android:text="3"            android:layout_weight="3"             android:background="#ffeeee"            />            </LinearLayout>    <LinearLayout         android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:orientation="horizontal">        <TextView             android:layout_width="wrap_content"    android:layout_height="wrap_content"            android:text="4"            android:layout_weight="1"             android:background="#ffccbb"            />        <TextView             android:layout_width="wrap_content"    android:layout_height="wrap_content"            android:text="5"            android:layout_weight="2"             android:background="#ff0000"            />        <TextView             android:layout_width="wrap_content"    android:layout_height="wrap_content"            android:text="6"            android:layout_weight="3"             android:background="#ffeeee"            />            </LinearLayout><LinearLayout         android:layout_width="fill_parent"    android:layout_height="wrap_content"    android:orientation="horizontal">        <TextView             android:layout_width="fill_parent"    android:layout_height="wrap_content"            android:text="7"            android:layout_weight="1"             android:gravity="center_horizontal"            android:background="#ffccbb"            />        <TextView             android:layout_width="fill_parent"    android:layout_height="wrap_content"            android:text="8"            android:layout_weight="2"             android:gravity="left"            android:background="#ff0000"            />        <TextView             android:layout_width="fill_parent"    android:layout_height="wrap_content"            android:text="9"            android:layout_weight="3"             android:gravity="left"            android:background="#ffeeee"            />    </LinearLayout></LinearLayout>

三个文本框的都是 layout_width=“wrap_content ”时，width显示的比例为1:2:3

layout_width=“fill_parent”时，width显示的比例是：

系统先给3个textview分配他们所要的宽度fill_parent，也就是说每一都是填满他的父控件

那么这时候的剩余空间=1个parent_width-3个parent_width=-2个parent_width (parent_width指的是屏幕宽度 )

那么第7个TextView的实际所占宽度应该=fill_parent的宽度,即parent_width + 他所占剩余空间的权重比列1/6 * 剩余空间大小（-2 parent_width）=2/3parent_width

同理第8个TextView的实际所占宽度=parent_width + 2/6*(-2parent_width)=1/3parent_width;

第9个TextView的实际所占宽度=parent_width + 3/6*(-2parent_width)=0parent_width；所以就是2:1:0的比列显示了。第三个就直接没有空间了。

0 0