首页 > os > android > > 正文

Android布局RelativeLayout(相对布局)详解

发布人:zhoulujun@live.cn    点击:

相对布局管理器是基于一个参考点而言的布局管理器。就像Web开发中的相对路径的概念,是基于一定的参考点而创建的。本文附带图片示例,详解相对布局管理器RelativeLayout

相对布局管理器是基于一个参考点而言的布局管理器。就像Web开发中的相对路径的概念,是基于一定的参考点而创建的。在Android中的相对布局管理器就是在一个参考点的四周(上,下,左,右)布局的管理器。 下面来看一下RelativeLayout的文档:
Android布局RelativeLayout(相对布局)详解
设置布局里面所有组件的对其方式:

android:gravity:设置容器内各个子组件的对齐方式

android:ignoreGravity:如果为哪个组件设置了这个属性的话,那么该组件不受gravity属性的影响

根据父容器来定位:

想位于哪,哪个属性就设置为true

左对齐:android:layout_alighParentLeft

右对齐:android:layout_alighParentRight

顶端对齐:android:layout_alighParentTop

底部对齐:android:layout_alighParentBottom

水平居中:android:layout_centerHorizontal

垂直居中:android:layout_centerVertical

中央位置:android:layout_centerInParent

比较简单,就不给出代码了,画个草图帮助大家了解下

\

 

右面的属性值为兄弟组件的id

左边:android:layout_toLeftOf

右边:android:layout_toRightOf

上方:android:layout_above

下方:android:layout_below

对齐上边界:android:layout_alignTop

对齐下边界:android:layout_alignBottom

对齐左边界:android:layout_alignLeft

对齐右边界:android:layout_alignRight

例子:
TextView
    android:id="@+id/firstView"
    android:text="第一个TextView"
 
TextView
    android:id="@+id/secondView"
    android:text="第二个TextView"
    android:layout_toRightOf="@id/firstView"
 
给第二个TextView控件添加toRightOf属性,并把第一个TextView控件的id赋值给它,作用 让第二个TextView处于第一个TextView控件的右方.
 
android <wbr>相对布局RelativeLayout中的一些属性的使用和实例
android相对布局RelativeLayout中的一些属性的使用和实例

 

这里演示一个比较典型的例子:

梅花布局:

\

代码如下:
 


这个很简单,读者慢慢摸索下就懂了

最后还有两个比较常用的

Margin和Padding属性

Margin:设置组件与父容器(通常是布局)的边距

有以下五个

android:layout_margin: 指定控件的四周的外部留出一定的边距
android:layout_marginLeft: 指定控件的左边的外部留出一定的边距
android:layout_marginTop: 指定控件的上边的外部留出一定的边距
android:layout_marginRight: 指定控件的右边的外部留出一定的边距
android:layout_marginBottom: 指定控件的下边的外部留出一定的边距

Padding:设置组件内部元素间的边距(可以理解为填充)

也是有以下五个

android:padding :指定控件的四周的内部留出一定的边距
android:paddingLeft: 指定控件的左边的内部留出一定的边距
android:paddingTop: 指定控件的上边的内部留出一定的边距
android:paddingRight: 指定控件的右边的内部留出一定的边距
android:paddingBottom: 指定控件的下边的内部留出一定的边距

这两个后面都跟着一个参数,通常用dp作为单位,eg:android:margin = "10dp"

用法比较简单,这里就夸张地演示下分别使用两个的效果

效果图如下:

\

贴下代码:
 

    
    
    
	

代码解释:

这个代码很简单,就是写了两个按钮的组合,

第一个组合的第二个按钮设置了paddingleft = "100dp:,结果按钮被拉伸了100dp,因为里面的元素间距填充了100dp

第二个组合的第二个按钮设置了marginleft = "100dp",结果按钮向右平移了100dp