Android布局之相对布局——RelativeLayout

此博文主要是相对布局xml属性的解析及实例。

android:layout_above:此控件底部的边缘位于设定ID控件的上方

    <Button
        android:id="@+id/btn1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hello "
        android:layout_above="@+id/btn2" />    //<<<<------
    <Button
        android:id="@+id/btn2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="world"
        android:layout_centerVertical="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

显示结果:

    

android:layout_below:此控件顶部的边缘位于设定ID控件的下方

    <Button
        android:id="@+id/btn1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hello " />
    <Button
        android:id="@+id/btn2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="world"
        android:layout_below="@+id/btn1"    //<<<<<<-------
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

显示结果:

android:layout_alignBaseline:将此控件内容的基线与给定ID控件内容的基线对齐。

    <Button
        android:id="@+id/btn1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hello "
        />
    <Button
        android:id="@+id/btn2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="world"
        android:layout_alignBaseline="@+id/btn1"  //<<<<<------
        android:textSize="56sp"
        android:layout_toRightOf="@+id/btn1"

此属性没加时显示效果:                

此属性加了之后的显示效果(此示例会超出布局,具体情况请自己多加练习):

android:layout_alignBottom:将此控件的底部边缘与给定ID的控件底部边缘对齐。

    <Button
        android:id="@+id/btn1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hello "
        />
    <Button
        android:id="@+id/btn2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="world"
        android:textSize="34sp"     android:layout_alignBottom="@+id/btn1"    //<<<<----     android:layout_toRightOf="@+id/btn1" />

此属性没加时显示效果:

添加后显示的效果:

android:layout_alignEnd:将此控件与给定ID控件的末端对齐。以下的例子,很容易懂

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button"
        android:layout_alignParentTop="true"
        android:layout_alignParentStart="true" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New"
        android:id="@+id/button2"
        android:layout_alignEnd="@+id/button"    //<<<<<--------
        android:layout_below="@+id/button" />

此属性未添加时的显示结果:

当添加此属性时的显示结果:

android:layout_alignLeft:将此控件的左边缘与给定ID控件的左边缘对齐

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true" />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New"
        android:id="@+id/button2"
        android:layout_alignLeft="@+id/button"    //<<<<<------
        android:layout_below="@+id/button" />

未添加此属性时显示效果:

添加此属性之后显示效果:

android:layout_alignParentBottom:如果设置为true,那么就将此控件的底部边缘与父容器的底部边缘匹配。

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button"
        android:layout_alignParentBottom="true" />    //<<<<<------

未添加此属性显示效果:

添加后:

android:layout_alignParentEnd:如果设置为true,那么此控件的末边缘与父容器匹配

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button"
        android:layout_alignParentEnd="true" />    //<<<<<<-------

未加此属性之前:

加了之后:

android:layout_alignParentLeft:如果设置为true,那么此控件的左边缘与父容器的左边缘匹配。这个属性可以用到的时候再用,这里可以参考layout_alignParentBottom属性,只是这个在左部而已。

android:layout_alignParentRight:如果设置为true,那么此控件的右边缘与父容器的右边缘匹配。此属性效果和 android:layout_alignParentEnd 属性效果差不多,显示效果参照 android:layout_alignParentEnd 的图

android:layout_alignParentStart:如果设置为true,那么此控件的开始边缘与父容器的开始边缘匹配。这个属性和android:layout_alignParentEnd 属性应该有别的用法,虽然在此例子中与left和right那两个属性显示效果差不多一样......

android:layout_alignParentTop:如果设置为true,那么此控件的顶部边缘与父容器的顶部边缘匹配。与layout_alignParentBottom相对。

android:layout_alignRight:将此控件的右边缘与给定ID控件的右边缘对齐。

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button"
        android:layout_alignParentStart="true" />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hello"
        android:layout_below="@+id/button"
        android:layout_alignRight="@+id/button"/>    //<<<<<------

未添加此属性时显示的效果:

添加后:

android:layout_alignStart:将此控件的开始边缘与给定ID控件的开始边缘对齐。和android:layout_alignLeft作用差不多感觉。

android:layout_alignTop:将此控件的顶部边缘与给定ID控件的顶部边缘对齐。

android:layout_toEndof:将此控件的开始边缘与给定ID控件的结束边缘对齐。

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button"
        android:layout_alignParentStart="true" />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hello"
        android:layout_below="@+id/button"
        android:layout_toEndOf="@+id/button" />    //<<<<<<-----

未添加此属性时显示效果:

添加后显示效果:

android:layout_toLeftof:将此控件的右边缘与给定ID控件的左边缘对齐。

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true" />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hello"
        android:layout_below="@+id/button"
        android:layout_toLeftOf="@+id/button"/>    //<<<<<<------

未添加此属性时显示结果:

添加后显示结果:

android:layout_toRightof:将此控件的左边缘与给定ID控件的右边缘对齐。

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true" />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hello"
        android:layout_below="@+id/button"
        android:layout_toRightOf="@+id/button" />    //<<<<<<<-------

未添加显示效果:

添加后显示效果:

android:layout_toStartof:将此控件的末边缘与给定ID控件的开始边缘对齐。和android:layout_toLeftof属性的显示效果一样。

android:layout_centerHorizontal:如果设置为true,此控件将设置为水平居中

在这一条绿线上都是范围

android:layout_centerVertical:如果设置为true,此控件将设置为垂直居中

android:layout_centerInParent:如果设置为true,则此控件在他的父容器的中心位置。

android:layout_alignWithParentIfMissing:如果设置为true,当控件的 layout_toLeftOf、layout_toRightOf、等等 属性找不到时,就以父元素作为参考。

------------------------------------------------------------------------

android:padding:指定控件中的内容与到此控件的四边缘的距离

android:layout_margin:设置此控件的四边缘与其他控件的距离

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:textSize="36sp"
        android:id="@+id/button"
        android:background="@android:color/holo_green_dark"
        android:layout_alignParentTop="true"
        android:padding="50dp"                //<<<<<<-------
        android:layout_alignParentStart="true" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button2"
        android:textSize="36sp"
        android:background="@android:color/holo_green_dark"
        android:layout_margin="20dip"            //<<<<<<--------
        android:layout_below="@+id/button" />

显示效果:

android:paddingBottom:设置控件内容与控件下边缘的距离

android:paddingTop:设置控件内容与控件上边缘的距离

android:paddingLeft:设置控件内容与控件左边缘的距离

android:paddingRight:设置控件内容与控件右边缘的距离

android:layout_marginBottom:设置此控件的下边缘与其他控件的距离

android:layout_marginTop:设置此控件的上边缘与其他控件的距离

android:layout_marginLeft:设置此控件的左边缘与其他控件的距离

android:layout_marginRight:设置此控件的右边缘与其他控件的距离

时间: 2024-10-24 10:06:14

Android布局之相对布局——RelativeLayout的相关文章

Android五种布局方式——LinearLayout、RelativeLayout、TableLayout....(四)

Android五种布局方式--LinearLayout.RelativeLayout .TableLayout.... Android使用XML声明界面布局 将程序的表现层和控制层分离 修改用户界面时,无需更改程序的源代码 可视化工具设计用户界面 Android五种布局方式 LinearLayout线性布局 AbsoluteLayout坐标布局 RelativeLayout相对布局 FrameLayout帧布局 TableLayout表格布局 GridLayout 1.LinearLayout线

浅谈Android五大布局(二)——RelativeLayout和TableLayout

在浅谈Android五大布局(一)中已经描述了LinearLayout(线性布局).FrameLayout(单帧布局)和AbsoulteLayout(绝对布局)三种布局结构,剩下的两种布局RelativeLayout(相对布局)和TableLayout(表格布局)相对之前布局结构稍显复杂一点,所以这里另起篇幅进行介绍. RelativeLayout: RelativeLayout按照各子元素之间的位置关系完成布局.在此布局中的子元素里与位置相关的属性将生效.例如android:layout_be

Android五大布局之一相对布局(RelativeLayout)

一.RelativeLayout(相对布局)重点: 在没有指点位置的情况下,RelativeLayout会默认生成控件的位置是左上角 所以必须需要添加属性android:id="@+id/name"定义控件的名称,其他控件就可以通过@id/name找到它进行相对布局 二.RelativeLayout(相对布局)相关的属性: 三.例子 1.首先先创建一个RelativeLayout的XML文件 代码如下: 1 <?xml version="1.0" encodi

浅谈Android五大布局(二)——RelativeLayout和TableLayout【转】

http://www.cnblogs.com/wisekingokok/archive/2011/08/24/2152004.html 在浅谈Android五大布局(一)中已经描述了LinearLayout(线性布局).FrameLayout(单帧布局)和AbsoulteLayout(绝对布局)三种布局结构,剩下的两种布局RelativeLayout(相对布局)和TableLayout(表格布局)相对之前布局结构稍显复杂一点,所以这里另起篇幅进行介绍. RelativeLayout: Relat

Android精通:TableLayout布局,GridLayout网格布局,FrameLayout帧布局,AbsoluteLayout绝对布局,RelativeLayout相对布局

在Android中提供了几个常用布局: LinearLayout线性布局 RelativeLayout相对布局 FrameLayout帧布局 AbsoluteLayout绝对布局 TableLayout表格布局 GridLayout网格布局 TableLayout表格布局 TableLayout的介绍 TableLayout是将子类向分别排列成行和列的布局视图容器,TableLayout是由许多TableRow对象组成的,表格布局以行列的形式管理子控件,每一个单元是一个TableRow或者Vie

android界面设计之布局管理

谈到android界面设计,各种布局样式不得不提!传统的布局方式有6种,我们会一一介绍. 在android studio2.2版本之后出现了一款超棒的布局方式,真正意义上的所见即所得,后面我们也会讲到! 1.LinearLayout:线性布局:线性布局又有两种,"垂直布局"和"水平布局". 垂直布局每一行只能有一个控件(自己嵌套的不算): 水平布局只有一行,所有的控件依次从左向右排列: linearLayout中有一个重要的属性 android:layout_wei

Android开发-之五大布局

在html中大家都知道布局是什么意思了,简单来说就是将页面划分模块,比如html中的div.table等.那么Android中也是这样的.Android五大布局让界面更加美化,开发起来也更加方便.当然布局方式不一样应用的地方也不一样,当然了有的布局方式也是可以相互转换和嵌套使用的.它们都各有各的优缺点,具体页面要怎么布局还是得看开发需求,但是用的最多的还是相对布局.线性布局以及相对布局和线性布局的嵌套使用.当然,我说的是安卓,并没有指定是安卓手机,比如平板.智能家居(电视...)很多都是Andr

android中的五大布局和过程流向

1.首先说明android中的五大布局: 1.绝对布局:AbsoluteLayout(按照绝对坐标来布局组件) 2.相对布局:RelativeLayout(相对其它组件的布局方式) 3.线性布局:LinearLayout(按照垂直或者水平方向布局的组件,通                        过"android:orientation"属性可以设置线性布局的方向. 属性值有垂直(vertical)和水平(horizontal)两种. android:orientation:可

Android仿微信UI布局视图(圆角布局的实现)

圆角按钮,或布局可以在xml文件中实现,但也可以使用图片直接达到所需的效果,以前版本的微信就使用了这种方法. 实现效果图:    不得不说,这种做法还是比较方便的. 源代码: MainActivity(没写任何代码,效果全在布局文件中实现): package com.android_settings; import android.app.Activity; import android.os.Bundle; public class MainActivity extends Activity

android界面设计之布局

一.线性布局 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orie