Android渲染点击色

先来看一个需求:

我们的深紫色过时了,我们改主题色为浅紫色吧!

开始

分析

这个需求看起来没啥事,改个色值就行了
仔细一查,我靠,所有的图片都是切图,然后,所有的图片命名都很规范,但是设计MM给的图片都是中文的,而且看起来很随心所欲..
然后略微数了下:加点击色,200多张切图

解决

这种工作明显不应该我们码农来做嘛,尤其是下一次再来个更浅的紫色我们岂不是要再改200张?
这就是要玩死我们的节奏嘛!
这个时候我们想着可以通过一种程序员的方式来解决问题
图片给我,我来渲染他的正常颜色,点击色,包括不能点击的颜色,UI只需要给我们一个色值就ok了,以后要改,只需要修改一下style,甚至还能完成换皮肤功能,听起来很好,就这么愉快的决定了

修改

首先,这需要我们自定义控件嘛,定义一个

我这里使用kotlin,建议用java的人了解下kotlin语法,真的不错,我生产环境用了2个多月了,感觉良好

package cn.sxw365.base.mvp.ui.customview

import android.content.Context
import android.graphics.*
import android.support.v7.widget.AppCompatImageView
import android.util.AttributeSet
import cn.sxw365.base.R
import com.kikt.mylibrary.util.ViewUtils

/**
 * Created by cai on 2017/6/1.
 */
class MainImageView(context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0)
    : AppCompatImageView(context, attrs, defStyleAttr) {

    constructor(context: Context, attributeSet: AttributeSet) : this(context = context, attrs = attributeSet)

    private var pressedFilter: ColorFilter? = null
    private var normalFilter: ColorFilter? = null

    var pressedColor: Int = Color.WHITE  //默认是白色
        set(value) {
            field = value
            pressedFilter = PorterDuffColorFilter(value, PorterDuff.Mode.SRC_IN)
        }

    init {

        if (attrs != null) {
            val a = context.obtainStyledAttributes(attrs, R.styleable.MainImageView)
            pressedColor = a.getColor(R.styleable.MainImageView_pressed_color, Color.WHITE)
            a.recycle()
        }
    }

    override fun onDraw(canvas: Canvas?) {
        if (isPressed) {
            drawable.colorFilter = pressedFilter
            super.onDraw(canvas)
        } else {
            drawable.clearColorFilter()
            super.onDraw(canvas)
        }
    }

}

核心代码分析

定义一个filter,用于处理色值的问题pressedFilter = PorterDuffColorFilter(value, PorterDuff.Mode.SRC_IN)
这个就代表了pressed以后的颜色,SRC_IN是一个bitmap的XferMode中的一种,我之前看到过的帖子
Android Paint Xfermode
可以去看看,这里就不详细说了

在onDraw中判断isPressed 这个是kotlin中的属性,代表了isPressed()方法,
设置 相当于java中的getDrawable().setColorFilter(pressedFilter)
这样就完成了按下状态时的渲染颜色

后续如果有别的需求,比如判断isEnable() 或者 isSelected()
中分别渲染不同的颜色,都是可以做到的

后记

代码很简单,但是其中包含了bitmap的mode,自定义view等相关的知识,也算是抛砖引玉吧
另外建议大家