安卓ui

2016-07-25 fishedee 前端

1 概述

安卓ui

2 基础空间

2.1 ImageView

留意scaleType的用法

  • center，将当前的image直接贴到imageview上，不拉伸也不压缩，如果image太大了，就贴image的中心，如果image太小了，就直接贴到imageview的中心
  • fitCenter，保证image所有的内容都能放到imageview上，然后另一条边按比例放到ImageView的中心。就是，center＋缩小
  • centerCrop，保证image具体的内容放在imageview上，然后另一条边剪中心放到ImageView上。就是，center+放大

注意adjustViewBounds的用法，一般用来在控制ImageView的某条边是固定的，另外一边根据Image的比例来控制，只需要设置adjustViewBounds为true就可以了。

3 布局控件

3.1 盒模型

在安卓中，padding属于width与height里面，增加或减少padding，不会影响总的width与height。而margin是子控件在父控件中的布局控制属性。

要注意的是，padding属于点击区域，margin不属于点击区域，如果控件是需要点击的，尽量用padding来实现控件间的距离，而不是margin，否则会让用户很难触摸到控件。

3.2 LinearLayout

线性布局，非常好用。

父控件布局属性

  • orientaion控制排列的方向
  • gravity控制子控件整体在父控件中布局方式，left，right，center

子控件布局属性

  • layout_width,layout_height控制子控件占用区域的大小
  • layout_weight控制当多个子控件都是0dp时，这些子控件按照什么比例来获取空间，一般用来平分控件空间。注意，layout_weight跟你想的不太一样
  • layout_gravity控制本个单个子控件相对于父控件的布局方式。

3.3 FrameLayout

多个子控件叠加在同一层的布局方式，一般用来做tab模型，或者按需显示控件的布局，很简单。

3.4 Space

建立一个Space空间来占位，比用空View占位来省资源

3.5 FAQ

3.5.1 空隙平分控件

问：假设有3个控件在同一行，这三个控件总宽度是屏幕宽度，每个控件的宽度是固定的，要求这三个控件之间的空隙是动态平分剩余空隙的。

答：解决办法很简单，将空隙也看成一个view，然后将view的layout_width设置为match_parent，layout_weight都是1，即可。

4 列表控件

4.1 ListView

4.2 RecycleView

4.3 优化

文档1

文档2

文档3

  • 重用view
  • 利用viewholder减少findViewById
  • 异步加载view的数据
  • 滚动停顿加载view的数据
  • 减少单独列表捆绑事件

5 样式

5.1 边框，圆角，渐变背景

在html中，这几种都是有自己的独特的属性的。而在android，全部都归到background的范畴。

<shape android:shape="rectangle">
      <stroke
          android:width="1dp"
          android:color="#d2d2d2" />
      <solid
          android:color="#ffffff"/>
</shape>

简单定义一个边框，和背景色

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:bottom="-1dp"
        android:top="-1dp"
        android:right="-1dp">
        <shape android:shape="rectangle">
            <stroke
                android:width="1dp"
                android:color="#d2d2d2" />
            <solid
                android:color="#ffffff"/>
        </shape>
    </item>
</layer-list>

要定义单边边框的话，安卓中很麻烦，要用layer-list来偏移背景来实现。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid
        android:color="#ffffff"/>
    <padding
        android:bottom="10dp"/>
    <corners
        android:radius="15dp"/>
</shape>

定义一个带有圆角的shape

6 自定义view

在安卓中，你可以全用代码来绘ui，也可以用xml来结合写ui，很明显，后面的方式，写起来容易，维护性也很好。

6.1 基本步骤

  • 先写一个view，例如，LinearLayout
  • 定义一个layout，然后将LayoutInflator将布局设置进view中
  • 用findViewById来获取布局里的小view，用来做自定义view的动态控制

6.2 layoutinflator

public View inflate(int resource, ViewGroup root, boolean attachToRoot)

  • attachToRoot为true时，会将生成的view放入到root下，并返回rootView。
  • attachToRoot为false时，会将生成的view不放入到root下，并返回生成的view。

public View inflate(int resource, ViewGroup root)

  • ViewGroup传入null，凭空生成一个View

6.3 merge

merge标签是用来优化自定义view的，由于自定义view的顶层已经是一个控件了，layoutinflator又生成了一个同样的顶层的父控件，造成实例化时有多余的标签生成。merge标签能优化这种问题，但要注意的是，merge标签的属性不会嵌入到父控件上，请不要在merge标签上定义属性，那是没有用的。

7 常用组件

7.1 下拉刷新

Android-Ultra-Pull-To-Refresh，如其名，简单暴力，功能强大。

7.2 Gif图片

安卓的ImageView默认是不能显示Gif图片的，一般用Glide来补充实现。

7.3 顶部状态条

StatusBarUtil，用来统一设置各种机型的顶部状态栏样式，用来实现沉浸式状态栏。

注意，使用了这个控件后，需要留意以下几点：

  • 务必顶层控件是继承于ViewGroup的容器控件，不然在部分机型有崩溃问题
  • 顶层控件在首次设定了以后，就不要再更改了，也就是setContentView只能调用一次。因为该控件为了配合顶部状态栏样式，会在顶层控件设置fitSystemWindow参数，如果重新再调用一次setContentView，那么新的顶层控件就会丢失fitSystemWindow参数，造成页面控件的部分元素压在了系统状态栏下方

相关文章