美文网首页
【四】Android五大布局及属性详解

【四】Android五大布局及属性详解

作者: 晴天ccc | 来源:发表于2018-03-06 12:49 被阅读0次


一、Android中常用的5大布局方式有以下几种:

1.线性布局(LinearLayout):按照垂直或者水平方向布局的组件;。

2.帧布局(FrameLayout) :组件从屏幕左上方(0,0)布局组件。

3.相对布局 (RelativeLayout) :相对其它组件的布局方式。

4.表格布局 (TableLayout) :按照行列方式布局组件。

5.绝对布局 (AbsoluteLayout):按照绝对坐标来布局组件(不常用,了解即可)。

二、介绍

1、线性布局(Linear Layout)

按照垂直或者水平的顺序依次排列子元素,每一个子元素都位于前一个元素之后。

如果是垂直排列,那么将是一个N行单列的结构,每一行只会有一个元素,而不论这个元素的宽度为多少。

如果是水平排列,那么将是一个单行N列的结构。

如果搭建两行两列的结构,通常的方式是先垂直排列两个元素,每一个元素里再包含一个LinearLayout进行水平排列。

LinearLayout中的子元素属性android:layout_weight生效,它用于描述该子元素在剩余空间中占有的大小比例。

加入一行只有一个文本框,那么它的默认值就为0,如果一行中有两个等长的文本框,那么他们的android:layout_weight值可以是同为1。

如果一行中有两个不等长的文本框,那么他们的android:layout_weight值分别为1和2,那么第一个文本框将占据剩余空间的三分之二,第二个文本框将占据剩余空间中的三分之一。

android: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">

        android:layout_width="match_parent"

        android:layout_height="90dp"

        android:orientation="horizontal"

        android:layout_weight="1"

      android:id="@+id/lw1">

        android:layout_width="wrap_content"

        android:layout_height="fill_parent"

        android:text="red"

        android:gravity="center_horizontal"

        android:background="#aa0000"

        android:layout_weight="1" />

        android:layout_width="wrap_content"

        android:layout_height="fill_parent"

        android:background="#008080"

        android:text="teal"

        android:gravity="center_horizontal"

        android:layout_weight="1"/>

    android:orientation="vertical"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:layout_below="@+id/lw1"

    android:layout_weight="1">

        android:text="row one"

        android:background="#aa0000"

        android:textSize="25sp"

    android:layout_width="fill_parent"

        android:layout_height="wrap_content"

        android:layout_weight="1" />

        android:text="row two"

        android:background="#dda0dd"

        android:layout_width="fill_parent"

        android:layout_height="wrap_content"

        android:layout_weight="1" />

</LinearLayout>

2.帧布局(FrameLayout)

五大布局中最简单的一个布局,从坐标(0,0)开发。

在这个布局中,整个界面被当成一块空白备用区域,所有的子元素都不能被指定放置的位置,它们统统放于这块区域的左上角,并且后面的子元素直接覆盖在前面的子元素之上,将前面的子元素部分和全部遮挡。

3.相对布局 (RelativeLayout)

按照各子元素之间的位置关系完成布局。在此布局中的子元素里与位置相关的属性将生效。

RelativeLayout用到的一些重要的属性:

<!--相对布局:按照组件的相对位置来布局-->

    <TextView

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:id="@+id/tev"

        android:text="please type here:"/>

    <EditText

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:layout_below="@id/tev"

        android:id="@+id/tex"/>

    <Button

        android:orientation="horizontal"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:id="@+id/btn1"

        android:layout_below="@id/tex"

        android:text="确定"

        />

    <Button

        android:layout_marginLeft="100dp"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:id="@+id/btn2"

        android:layout_below="@id/tex"

        android:layout_marginRight="30dp"

        android:text="取消"/>

4.表格布局 (TableLayout)

此布局为表格布局,适用于N行N列的布局格式。一个TableLayout由许多TableRow组成,一个TableRow就代表TableLayout中的一行。

TableRow是LinearLayout的子类,它的android:orientation属性值恒为horizontal,并且它的android:layout_width和android:layout_height属性值恒为MATCH_PARENT和WRAP_CONTENT。所以它的子元素都是横向排列,并且宽高一致的。这样的设计使得每个TableRow里的子元素都相当于表格中的单元格一样。在TableRow中,单元格可以为空,但是不能跨列。

<!--1.表格布局: 一个viewgroup以表格显示它的子视图(view)元素,

                即行和列标识一个视图的位置-->

    <TableRow

        android:layout_width="wrap_content"

        android:layout_height="100dp">

        <Button

            android:text="button1"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content" />

        <Button

            android:text="button2"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content" />

        <Button

            android:text="button3"

            android:layout_width="match_parent" />

    </TableRow>

    <TableRow

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_marginTop="140dp">

        <Button

            android:text="button4"/>

        <Button

            android:layout_span="2"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="button5"/>

    </TableRow>

5.绝对布局 (AbsoluteLayout)

在此布局中的子元素的android:layout_x和android:layout_y属性将生效,用于描述该子元素的坐标位置。

屏幕左上角为坐标原点(0,0),第一个0代表横坐标,向右移动此值增大,第二个0代表纵坐标,向下移动,此值增大。

在此布局中的子元素可以相互重叠。

在实际开发中,通常不采用此布局格式,因为它的界面代码过于刚性,以至于有可能不能很好的适配各种终端。故了解一下就可以。

三、常用布局属性

第一类:属性值为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 在某元素的下方

android:layout_above 在某元素的的上方

android:layout_toLeftOf 在某元素的左边

android:layout_toRightOf 在某元素的右边

android:layout_alignTop 本元素的上边缘和某元素的的上边缘对齐

android:layout_alignLeft 本元素的左边缘和某元素的的左边缘对齐

android:layout_alignBottom 本元素的下边缘和某元素的的下边缘对齐

android:layout_alignRight 本元素的右边缘和某元素的的右边缘对齐

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

android:layout_marginBottom 离某元素底边缘的距离

android:layout_marginLeft 离某元素左边缘的距离

android:layout_marginRight 离某元素右边缘的距离

android:layout_marginTop 离某元素上边缘的距离

第四类:其他属性值

EditText的android:hint 设置EditText为空时输入框内的提示信息。

android:gravity  

对该view 内容的限定.比如一个button 上面的text. 你可以设置该text 在view的靠左,靠右等位置.以button为例,android:gravity="right"则button上面的文字靠右

android:layout_gravity    

用来设置该view相对与起父view 的位置.比如一个button 在linearlayout里,你想把该button放在靠左、靠右等位置就可以通过该属性设置.以button为例,android:layout_gravity="right"则button靠右

android:scaleType:

 控制图片如何resized/moved来匹对ImageView的size。

第五类:imageview属性值

ImageView.ScaleType / android:scaleType值的意义区别:

CENTER /center 按图片的原来size居中显示,当图片长/宽超过View的长/宽,则截取图片的居中部分显示

CENTER_CROP / centerCrop 按比例扩大图片的size居中显示,使得图片长(宽)等于或大于View的长(宽)

CENTER_INSIDE / centerInside 将图片的内容完整居中显示,通过按比例缩小或原来的size使得图片长/宽等于或小于View的长/宽

FIT_CENTER / fitCenter 把图片按比例扩大/缩小到View的宽度,居中显示

FIT_END / fitEnd 把图片按比例扩大/缩小到View的宽度,显示在View的下部分位置

FIT_START / fitStart 把图片按比例扩大/缩小到View的宽度,显示在View的上部分位置

FIT_XY / fitXY 把图片�不按比例扩大/缩小到View的大小显示

MATRIX / matrix 用矩阵来绘制,动态缩小放大图片来显示。

相关文章

网友评论

      本文标题:【四】Android五大布局及属性详解

      本文链接:https://www.haomeiwen.com/subject/bteffftx.html