您当前的位置: 首页 >  ui

Kevin-Dev

暂无认证

  • 0浏览

    0关注

    544博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文

【Android -- UI 开发】六大布局

Kevin-Dev 发布时间:2016-11-23 16:04:42 ,浏览量:0

网上有人比喻的很好:布局好比是建筑里的框架,组件按照布局的要求依次排列,就组成了用于看见的漂亮界面了。

一、布局类型

布局类型

1. LinearLayout (线性布局)

LinearLayout 是最常用的布局方式,在 XML 文件中使用 标记。它会将容器里的 UI 组件一个一个挨着排列起来。但是 LinearLayout 不会换行,当 UI 组件超出屏幕之后,则不会被显示出来。 LinearLayout 有两个重要的 XML 属性:android:gravity(对齐方式);android:orientation(排列方式)。

android:orientation(排列方式),设定了 LinearLayout 中包含的 UI 组件的排列方式,有两个选项vertical(竖向)、horizontal(横向,默认值)

android:gravity(对齐方式),设定 LinearLayout 中包含 UI 组件的对齐方式,其选项很多,常用上(top)、下(bottom)、左(left)、右(right)。

  • 示例代码:

    
        
        
        
        
        
        
        
        
    
2. RelativeLayout (相对布局)

RelativeLayout,其内子组件的位置总是相对兄弟UI组件、父亲容器来决定的。比如UI组件A相对于UI组件B的位置进行定位,那么UI组件B需要在UI组件A之前定义。

相对布局用到的主要属性:

  • android:layout_below:在某元素的下方。
  • android:layout_above:在某元素的上方。
  • android:layout_toLeftOf:在某元素的左边。
  • android:layout_toRightOf:在某元素的右边。
  • android:layout_alignXxx:控制与某元素的边界对其方式。
  • 示例代码:


    
    
    
    

3. TableLayout (表格布局)

表格布局,采用行、列的形式来管理UI组件,TableLayout 通过 TableRow、其他UI组件来控制表格的行数和列数。

每次向 TableLayout 中添加一个 TableRow,该 TableRow 就是一个表格行,TableRow 也是容器,因此它也可以不断添加其他组件,没添加一个子组件,该表格就增加一列。如果直接向 TableLayout 中添加组件,那么这个组件将直接占用一行。

TableLayout支持的XML属性:

  • android:collapseColumns:设置需要被隐藏的列序号。
  • android:shrinkColumns:设置需要被收缩的列序号。
  • android:stretchColumns:设置需要被拉伸的列序号。 注意:TableLayout中所谓的序列号是从0开始计算的。

示例代码(计算器):




    
        

        
    

    

    
        
            

            

            

            

        

        

            

            

            

            
        

        

            

            

            

            
        

        

            

            

            

            
        

        

            

            

            
        

    



4. FrameLayout (框架布局)
  • 放入的所有控件都被放置在最左上的区域;
  • 无法为控件指定一个确切的位置;
  • 下一个子控件会重叠覆盖上一个子控件。
5. AbsoluteLayout (绝对布局)
  • 采用坐标轴的方式定位控件;
  • 左上角是(0,0)点,往右X轴递增,往下Y轴递增;
  • 定位属性: android:layout_x、android:layout_y
6. ConstraintLayout (约束布局)
  • ConstraintLayout是Android Studio 2.2中主要的新增功能之一;
  • ConstraintLayout非常适合使用可视化的方式来编写界面;
  • ConstraintLayout 可以有效地解决布局嵌套过多的问题。 目前,Android Studio 是 2.2或以上版本默认布局文件首选就是 ConstraintLayout。

基本使用请参考:Android新特性介绍,ConstraintLayout完全解析

7.选择器(Selector)

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

7.2 属性

名称说明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了。

7.3 实例 button_selector.xml


< selector xmlns:android="http://schemas.android.com/apk/res/android">

 < !-- 指定按钮按下时的图片 -->
 
 < !-- 指定按钮松开时的图片 --> 
 
< /selector>

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


关注
打赏
1658837700
查看更多评论
立即登录/注册

微信扫码登录

0.0563s