• Android UI布局


    Android中有五种布局方式:LinearLayout(线性布局),RelativeLayout(相对布局),FrameLaout(框架布局、帧布局),TableLayout(表格布局),AbsoluteLayout(绝对布局,已废弃),一般情况下,线性布局和相对布局应用的比较多。

    一、LinearLayout

        线性布局,按照水平或者垂直的方向布局组件,里面的android:orientation=vertical|horizontal属性可以设置布局是垂直显示还是水平显示,还有一个属性weight,权重,weight值越大代表占得比例越大。

    常用属性:

    android:orientation:设置布局的方向

    android:gravity:用来控制组件的对齐方式

    android:weight:控制各个组件在布局中的相对大小

    二、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 在某元素的下方 
    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 离某元素上边缘的距离

    android:layout_gravity:用来设置该view相对与起父view 的位置.right|left

     三、框架布局(帧布局)

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

    四、表格布局

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

    TableLayout是LinearLayout的子类,TableLayout不需要明确的声明包含多少航、多少列,而是通过TableRow,以及其他组件来控制表格的行数和列数,TableRow也是容器,因此可以向TableRow里面添加其他组件,每添加一个组件该表格就增加一列。

  • 相关阅读:
    网络七层模型
    border-radius 50% 和100%
    数据绑定
    前端一些基础的重要的知识2
    用 ul 和 li 模拟select控件
    两列布局
    盒子的水平垂直居中几种方法
    TCP时间戳
    帧聚合
    skb buff数据结构
  • 原文地址:https://www.cnblogs.com/chhom/p/4704907.html
Copyright © 2020-2023  润新知