Android嵌套布局初步(一)

来源:互联网 发布:密码生成器软件 编辑:程序博客网 时间:2024/06/13 08:40

一、概述

Android布局使用layout中的xml文件实现,排版逻辑大体类似于div+css结构。通常在布局中,特别是手机应用的布局中,我们希望能够大块垂直分布,块内灵活布局。这样就可以使用LinearLayout的嵌套实现局部块的布局,在LinearLayout中嵌套RelativeLayout实现块内灵活布局。

二、LinearLayout

属性 解释 adroid:layout_width=”match_parent” 本层linearlayout的宽 android:layout_height=”match_parent” 本层linearlayout的高 android:orientation=”vertical” 本层linearlayout中元素的排布方式,垂直和水平 android:layout_gravity 拥有本属性控件相对于父控件的位置 ,类似于margin android:gravity 拥有本属性控件内部元素的位置,类似于padding


在LinearLayout中,可以通过上层linearlayout的orientation和下层linearlayout中的宽高来控制大块的位置。

三、RelativeLayout

第一类:属性值为true或false

属性 解释 android:layout_centerHrizontal 水平居中 android:layout_centerVertical 垂直居中 android:layout_centerInparent 相对于父元素完全居中 android:layout_alignParentBottom 贴紧父元素的下边缘 android:layout_alignParentLeft 贴紧父元素的左边缘 android:layout_alignParentRight 贴紧父元素的右边缘 android:layout_alignParentTop 贴紧父元素的上边缘 android:layout_alignWithParentIfMissing 如果对应的兄弟元素找不到的话就以父元素做参照物


第二类:属性值必须为id的引用名“@id/id-name”

属性 解释 android:layout_below 在指定id元素的下方 android:layout_above 在指定id元素的上方 android:layout_toLeftOf 在指定id元素的左边 android:layout_toRightOf 在指定id元素的右边 android:layout_alignTop 本元素的上边缘和指定id元素的上边缘对齐 android:layout_alignLeft 本元素的左边缘和指定id元素的左边缘对齐 android:layout_alignBottom 本元素的下边缘和指定id元素的下边缘对齐 android:layout_alignRight 本元素的右边缘和指定id元素的右边缘对齐


第三类:属性值为具体的像素值,如30dip,40px

属性 解释 android:layout_marginBottom 离某元素底边缘的距离 android:layout_marginLeft 离某元素左边缘的距离 android:layout_marginRight 离某元素右边缘的距离 android:layout_marginTop 离某元素上边缘的距离


RelativeLayout的布局方式还是很灵活,甚至比div+css还好用,直接导致的问题就是。。个人感觉比div+css复杂,还要考虑到不同机型的适配问题,如果整个页面都是RelativeLayout,不知道会有多麻烦,比如中间加个控件什么的 ,改id改到蛋疼。。这还只是一个简单小项目的感受。

把RelativeLayout用在最小的范围内,就像筋和肉一样,而LinearLayout用做骨架,这样的搭配应该是最合理的。。至少目前我是这么认为的。

四、嵌套

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    android:paddingBottom="@dimen/activity_vertical_margin"    android:paddingLeft="@dimen/activity_horizontal_margin"    android:paddingRight="@dimen/activity_horizontal_margin"    android:paddingTop="@dimen/activity_vertical_margin" >    <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_weight="1"        android:background="#ffff00"        android:orientation="vertical" >        <RelativeLayout            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:background="#ff6600" >            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="呵呵" />        </RelativeLayout>        <RelativeLayout            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:background="#ff6600" >            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="呵呵" />        </RelativeLayout>    </LinearLayout>    <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_weight="1"        android:background="#ff0000"        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:layout_weight="1"                android:background="#66ff00"                android:gravity="center_horizontal"                android:text="呵呵" />            <!-- android:layout_gravity 控件相对于父控件的位置 ,类似于margin -->            <!-- android:gravity 控件内部元素的位置,类似于padding -->            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_weight="1"                android:background="#66ff00"                android:gravity="center_horizontal"                android:text="呵呵" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_weight="1"                android:background="#66ff00"                android:gravity="center_horizontal"                android:text="呵呵" />        </LinearLayout>    </LinearLayout></LinearLayout>

差不多就是下面这个图的样子
排版1

0 0