Android中常用布局简介

作者: Ma_小鹏 | 来源:发表于2019-02-24 17:10 被阅读17次

    今天复习Android系统中为我们提供的五大布局:LinearLayout(线性布局)、RelativeLayout(相对布局)、FrameLayout(帧布局)、AbsoluteLayout(绝对布局)、TablelLayout(表格布局)其中最常用的的是LinearLayout、TablelLayout和RelativeLayout。这些布局都可以嵌套使用。

    一、布局介绍

    布局 介绍/特点 应用场景
    LinerLayout(线性布局) 控件排列方式 = 线性的垂直/水平 布局内控件按照线性垂直/水平排列
    RelativeLayout (相对布局) 根据参照物(某个控件id)来确定控件的位置 控件之间存在位置上的联系
    FrameLayout(帧布局) 放入的控件都被放在左上角且后加入的控件会重叠覆盖在之前加入的控件上面 控件相互叠加
    TableLayout(表格布局) 通过表格形式布局控件位置 控件之间存在固定的位置关系
    AbsoluteLayout(绝对布局) 采用坐标的方式定位控件,左上角时(0,0)往右X轴递增往下Y轴递增 已过时

    二、布局属性

    1、公有属性

    即各个布局都存在的属性

    属性 介绍 使用
    layout_width 、layout_height 设置布局的宽/高 android:layout_width="wrap_content"//所需的最小尺寸 <p>android:layout_height="match_parent"//充满父布局 <p>android:layout_width="65dp"//固定宽高
    layout_margin+方位 设置控件边缘相对于父控件的边距 layout_margin="10dp"//设置四面边距<p>layout_marginTop="10dp"//设置上边距<p>layout_marginBottom="10dp"//设置下边距<p>layout_marginLeft="10dp"//设置左边距<p>layout_marginRight="10dp"//设置右边距<p>
    padding +方位 设置控件内容的边缘相对于控件的边距 layout_padding="10dp"//设置四面边距<p>layout_paddingTop="10dp"//设置上边距<p>layout_paddingBottom="10dp"//设置下边距<p>layout_paddingLeft="10dp"//设置左边距<p>layout_paddingRight="10dp"//设置右边距<p>
    layout_gravity 控件相对父控件的位置 android:layout_gravity="center"//居中<p>android:layout_gravity="center_horizontal"//水平居中<p>android:layout_gravity="center_vertival"//垂直居中
    gravity 控件内容相对控件的位置 android:layout_gravity="center"//居中<p>android:layout_gravity="center_horizontal"//水平居中<p>android:layout_gravity="center_vertival"//垂直居中
    2、特有属性
    布局 特有属性 用法
    LinerLayout(线性布局) orientation(设置控件的排列方式)<p>layout_weight(根据设置的权重,将布局控件按比例分配,主要设置在布局内的控件中) android:orientation="horizontal"//水平<p>android:orientation="vertical"//垂直<p> android:layout_weight="1.0"//设置权重
    RelativeLayout(相对布局) layout_alignParentXXX(当前控件对齐父控件的X方位)<p> android:layout_alignParentTop="true"<p>//当前控件顶端对齐父控件顶端 android:layout_alignParentBottom="true"//当前控件底端对齐父控件底端<p>android:layout_alignParentLeft="true"//当前控件左端对齐父控件左端<p>android:layout_alignParentRight="true"//当前控件右端对齐父控件右端<p>android:layout_centerInParent="true"//当前控件位于父控件正居中的位置<p>android:layout_centerVertival="true"//当前控件位于父控件垂直居中的位置<p>android:layout_centerHorizontal="true"//当前控件位于父控件水平居中的位置
    RelativeLayout(相对布局) layout_X(当前控件位于某个控件的X方位) android:layout_above="@id/text"//当前控件位于text控件的上方<p>android:layout_below="@id/text"//当前控件位于text控件的下方<p>android:layout_toLeftOf="@id/text"//当前控件位于text控件的左方<p>android:layout_toRightOf="@id/text"//当前控件位于text控件的右方<p> android:layout_alignTop="@id/text"//当前控件的顶部 对齐 text控件的顶部<p>android:layout_alignRight(End)="@id/text"//当前控件的右部 对齐 text控件的右部<p>android:layout_alignBottom="@id/text"//当前控件的底部 对齐 text控件的底部<p>android:layout_alignLeft(Start)="@id/text"//当前控件的左部 对齐 text控件的左部<p>
    AbsoluteLayout(绝对布局) layout_x(指定控件的x坐标)<p>layout_y(指定控件的Y坐标) android:layout_x="50dp"<p>android:layout_y="50dp"
    TableLayout(表格布局) TableLayout的行TableRow = 一个水平排列的线性布局<p> 继承自线性布局故具备线性布局的全部属性
    FrameLayout 只具备基础属性

    5个布局元素可相互嵌套使用,从而实现各种不同的效果

    三、选择器(selector)

    1.作用

    通过设置选择器(selector)可使控件 在不同操作下(默认、点击等) 显示不同样式

    通过 xml编写 = selector.xml
    
    2.属性
    XML属性 说明
    android:drawable 放一个drawable资源
    android:state_pressed 按下状态,如一个按钮触摸或者点击。
    android:state_focused 取得焦点状态,比如用户选择了一个文本框。android:state_hovered 光标悬停状态,通常与focused state相同,它是4.0的新特性
    android:state_selected 选中状态
    android:state_enabled 能够接受触摸或者点击事件
    android:state_checked 被checked了,如:一个RadioButton可以被check了。
    android:state_enabled 能够接受触摸或者点击事件

    注:上述所有属性的取值 : boolean属性 = true、false

    3.实例说明

    在drawable添加 selector.xml 资源文件
    button_selector.xml:

    <?xml version="1.0" encoding="UTF-8"?>
    < selector xmlns:android="http://schemas.android.com/apk/res/android">
    
     < !-- 指定按钮按下时的图片 -->
     <item android:state_pressed="true"  
           android:drawable="@drawable/start_down"
     />
    
     < !-- 指定按钮松开时的图片 --> 
     <item android:state_pressed="false"
           android:drawable="@drawable/start"
     />
    
    < /selector>
    

    在布局文件main.xml中控件的属性设置:

    <Button
      android:id="@+id/startButton"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:background="@drawable/button_selector" 
    />
    

    四、布局形状(Shape)

    • 作用:设置布局的颜色、边框线

    • 使用:通过 xml编写 = shape.xml

    • 具体使用

    <shape xmlns:android="http://schemas.android.com/apk/res/android">
    
    //默认颜色
    <solid android:color="#876543"/>
    //哪个方向有边框线
      <padding
            android:bottom="0dp"
            android:left="1dp"
            android:right="1dp"
            android:top="1dp" />
         //边框线颜色、大小
        <stroke
            android:width="1dp"
            android:color="#000000" />
    

    在布局文件main.xml中控件的属性设置:

    <Button
      android:id="@+id/startButton"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:background="@drawable/layout_shape"/>
    

    写在最后: 本系列的文章旨在学习过程中的总结,如果对你也有帮助,荣幸之至。

    相关文章

      网友评论

        本文标题:Android中常用布局简介

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