提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  移动开发

当前栏目

【Android 应用开发】Paint 滤镜原理 之 颜色矩阵 ( 颜色模式 | 颜色通道 | 颜色矩阵 | 矩阵运算 | 矩阵乘法 | 矩阵加法 | 颜色矩阵深入解析 )

Android应用模式原理开发 深入 解析 运算
2023-06-13 09:17:41 时间

文章目录

颜色模式

颜色模式 : 将 某种颜色 表现为 数字形式 的模型 , 即记录图像颜色的方式 ; 下面是 所有的 颜色模式 :

  • 1.RGB 模式 : Red ( 红 ) , Green ( 绿 ) , Blue ( 蓝 ) , 三种颜色可组合成任意颜色 , 即 三原色原理 ;
  • 2.CMYK 模式 : 印刷模式 , Cyan ( 青 ) , Magenta ( 洋红 ) , Yellow ( 黄 ) , Black ( 黑 ) , 代表油墨的 4 种颜色 , 可以组合成任意颜色 ;
  • 3.HSB 模式 : Hue ( 色泽 ) , Saturation ( 饱和度 ) , Brightness ( 亮度 ) , 该模式基于人对于颜色的心里感受 ;
    • ① RGB 转 HSB 过程 : 其由 RGB 三原色转为 Lab 模式 , 在 Lab 模式基础上加入人对颜色的心理感受转换成的 ;
  • 4.Lab 模式 : Luminance ( 发光率 ) 和 ( a, b ) 两个颜色轴组成 , 由 RGB 三原色转换而来 ;
    • ① 转换中介 : RGB 转成 HSB 和 CMYK 都需要先转成 Lab 模式 , 然后转成对应的颜色模式 ;
  • 5.位图模式 : 用两种颜色 ( 黑 或 白 ) 表示图像像素 ;
    • ① 黑白图像 : 位图模式的图像也叫做黑白图像 ;
    • ② 位深度 : 其 位深度 为 1 , 又叫做 一位图像 ;
    • ③ 尺寸最小 : 在相同 宽度 , 高度 , 分辨率 情况下 , 位图模式尺寸最小 ;
    • ④ 转换不可逆 : 其它模式的图像转为位图图像 , 会丢失大量细节信息 , 因此该转换不可逆 ;
  • 6.灰度模式 : 像素由亮度值表示 , 取值范围 0 ( 黑色 ) 到 255 ( 白色 ) 之间 , 有 256 个级别的灰度值 ;
  • 7.索引颜色模式 : 每个像素 256 种可取值颜色 , 像素使用颜色的索引值来表示 ;
    • ① 转换过程 : RGB 转为索引颜色时 , 将每个像素的颜色值使用索引表示 ,
    • ② 替代方案 : 如果索引中没有该颜色 , 那么选一个近似的索引值代表这个颜色 ;
    • ③ 主要作用 : 能极大降低图片占用空间 ;
    • ④ 颜色表 : 存放颜色及对应的索引 , 颜色表可以在转换过程中定义 , 也可以在转换完成后修改 ;
  • 8.双色调模式 : 采用 2 ~ 4 种 色彩 , 创建 双色调 , 三色调 , 四色调 混合色阶 组成图像 ;
    • ① 灰度图像 转 双色调 : 该过程中 , 对色调进行编辑 , 产生彩色效果 ;
    • ② 目的 : 减少印刷成本 , 印刷时颜色越少 , 成本越低 ;
  • 9.多通道模式 : 主要用于特殊打印要求的图像 , 在保证 正确的图像颜色 基础上 减少印刷成本 ;

这里只做简单介绍 , 详细介绍需要为每个模式单开一篇博客讲解 ;

颜色通道

颜色通道简介 :

  • 1.颜色通道 : 保存图像的颜色信息的通道 , 称为颜色通道 ;
  • 2.颜色通道数量 : 每个图像都有 1 个 或 多个 颜色通道 , 其数量 取决于图像采用的颜色模式 ;
  • 3.颜色通道数量示例 :
    • ① 位图模式 , 灰度模式 , 索引颜色模式 , 双色调模式 : 1 个通道 ;
    • ② RGB , Lab 模式 : 3 个通道 ;
    • ③ CMYK 模式 : 4 个通道 ;

通道可以理解成一个数据 , 即图像的某个像素点数据结构的部分数据 , 如 RGB 图片 , 每个像素点都由 RGB 三个颜色数据组成 , 每个颜色就是一个通道 ;

Android 中的颜色矩阵

Android 中的颜色矩阵 :

  • 1.Android 颜色模式 : RGBA 4 通道 颜色模式 , Red ( 红 ) , Green ( 绿 ) , Blue ( 蓝 ) , Alpha ( 透明度 ) ;
  • 2.ColorMatrix 颜色矩阵 : 该矩阵是一个
4\times5

的矩阵 , 用于将图像像素的颜色值 , 具体就是修改图像像素值的 RGBA 颜色通道值 ;

M=\begin{pmatrix} a&b& c& d& e \\ f & g& h& i& j \\ k& l& m& n& o \\ p&q& r& s& t \\ \end{pmatrix}
  • 3.矩阵在代码中的表示方式 : 在 Android 代码中 , 使用一个一维 float 数组表示该矩阵为 :
float matrix[] = { 
		a, b, c, d, e,
  		f, g, h, i, j,
  		k, l, m, n, o,
  		p, q, r, s, t };
  • 4.矩阵作用 : 该矩阵 与 RGBA 像素颜色值 , 进行计算 , 会得到一个新的 RGBA 颜色值 ;
  • 5.涉及的矩阵 :
M=\begin{pmatrix} a&b& c& d& e \\ f & g& h& i& j \\ k& l& m& n& o \\ p&q& r& s& t \\ \end{pmatrix}

矩阵 与

C_1=\begin{pmatrix} R_1 \\ G_1 \\ B_1 \\ A_1\\ \end{pmatrix}

矩阵 , 经过指定的矩阵运算 , 得到矩阵

C_2=\begin{pmatrix} R_2 \\ G_2 \\ B_2 \\ A_2\\ \end{pmatrix}
  • 6.新矩阵值的计算方式 : 下面是 计算 新的像素值的公式 ;
R_2 = a*R_1 + b*G_1 + c*B_1 + d*A_1 + e
G_2 = f*R_1 + g*G_1 + h*B_1 + i*A_1 + j
B_2 = k*R_1 + l*G_1 + m*B_1 + n*A_1 + o
A_2 = p*R_1 + q*G_1 + r*B_1 + s*A_1 + t
  • 7.新矩阵计算公式总结 : 将 矩阵
M=\begin{pmatrix} a&b& c& d& e \\ f & g& h& i& j \\ k& l& m& n& o \\ p&q& r& s& t \\ \end{pmatrix}

拆分成

M_1=\begin{pmatrix} a&b& c& d\\ f & g& h& i \\ k& l& m& n \\ p&q& r& s\\ \end{pmatrix}

和

M_2=\begin{pmatrix} e \\ j \\ o \\ t \\ \end{pmatrix}

, 与

C_1=\begin{pmatrix} R_1 \\ G_1 \\ B_1 \\ A_1\\ \end{pmatrix}

进行计算 , 得到矩阵

C_2=\begin{pmatrix} R_2 \\ G_2 \\ B_2 \\ A_2\\ \end{pmatrix}

, 计算公式 如下 :

M_1 \times C_1 + M_2 = C_2

下面会简单讲解矩阵乘法 和 加法的原理 , 深入学习的话 , 去找本线性代数的书学习 , 建议大家学习图形 , 图像 , 音视频处理等技术时 , 把 线性代数 和 矩阵论 相关数学知识也学习一下 ;

矩阵乘法运算

矩阵乘法 :

  • 1.矩阵表示方法 :
m

行 ( Row )

n

列 ( Column ) 的矩阵 , 表示成

m \times n

矩阵 ; ( 矩阵表示时 , 行数在前 , 列数在后 )

  • 2.矩阵乘法可执行的前提 :
    • ①
    A

    矩阵 :

    m_a \times n_a

    矩阵 , 即

    m_a

    行

    n_a

    列矩阵 ;

    • ②
    B

    矩阵 :

    m_b \times n_b

    矩阵 , 即

    m_b

    行

    n_b

    列矩阵 ;

    • ③ 满足前提 : 两个矩阵进行乘法运算
    A \times B

    , 前一个矩阵

    A

    的列数

    n_a

    必须 与 后一个矩阵

    B

    的行数

    m_b

    相等 ;

  • 3.矩阵乘法计算方法 :
    • ① 矩阵乘法计算结果行列数 :
      • 1> 结果行列数 : 上述矩阵
      A \times B

      得到的是一个

      m_a

      行 ,

      n_b

      列的矩阵

      C

      ;

      • 2>取值来源 : 即 结果的行数 等于 矩阵
      A

      的行数 , 结果的列数 , 等于矩阵

      B

      的列数 ;

    • ② 某位置的具体值 :
      • 1> 讨论矩阵 :
      C

      矩阵是一个

      m_a \times n_b

      矩阵 ;

      • 2> 索引范围 : 讨论 其中 第
      i

      (

      1 \leq i \leq m_a

      ) 行第

      j

      (

      1 \leq j \leq n_b

      ) 列位置的值 ;

      • 3> 对应值大小 : 是
      A

      矩阵第

      i

      行的元素 ( 有

      n_a

      个 ) 与

      B

      矩阵 第

      j

      ( 有

      m_b

      个

      n_a=m_b

      ) 列的元素按照对应位置逐个相乘 , 最后将所有

      n_a

      个相乘结果相加即可得到

      i行j列

      元素的值 ;

  • 4.简单示例 : 矩阵
A=\begin{pmatrix} a_{1, 1}&a_{1, 2}& a_{1, 3}\\ a_{2, 1}&a_{2, 2}& a_{2, 3} \end{pmatrix}

和矩阵

B=\begin{pmatrix} b_{1, 1}&b_{1, 2}\\ b_{2, 1}&b_{2, 2}\\ b_{3, 1}&b_{3, 2}\\ \end{pmatrix}

相乘 , 其结果是

\\ \\ C=A\times B= \begin{pmatrix} a_{1, 1}b_{1, 1} + a_{1, 2}b_{2, 1} + a_{1, 3}b_{3, 1}& a_{1, 1}b_{1, 2} + a_{1, 2}b_{2, 2} + a_{1, 3}b_{3, 2}\\ a_{2, 1}b_{1, 1} + a_{2, 2}b_{2, 1} + a_{2, 3}b_{3, 1}& a_{2, 1}b_{1, 2} + a_{2, 2}b_{2, 2} + a_{2, 3}b_{3, 2}\\ \end{pmatrix} \\ \\

滤镜中的矩阵乘法运算

滤镜中对应的矩阵乘法 :

  • 1.矩阵 1 :
M_1=\begin{pmatrix} a&b& c& d\\ f & g& h& i \\ k& l& m& n \\ p&q& r& s\\ \end{pmatrix}

, 代表 修改像素值的 颜色矩阵 的部分 拆分结果 ;

  • 2.矩阵 2 :
C_1=\begin{pmatrix} R_1 \\ G_1 \\ B_1 \\ A_1\\ \end{pmatrix}

, 代表 RGB 颜色值和 A 透明度值 ;

  • 3.矩阵大小说明 :
M_1

矩阵是

4 \times 4

矩阵 ,

C_1

矩阵是

4 \times 1

矩阵 ;

  • 4. 矩阵相乘判定 :
M_1

矩阵的列数 等于

C_1

矩阵的行数 , 两个矩阵可以进行乘法运算 ;

  • 5. 矩阵运算结果 :
M_1

矩阵 与

C_1

矩阵相乘的结果是一个

4\times1

的矩阵, 计算过程如下 :

\begin{array}{lcl}M_1 \times C_1 &=& \begin{pmatrix} a&b& c& d\\ f & g& h& i \\ k& l& m& n \\ p&q& r& s\\ \end{pmatrix} \times \begin{pmatrix} R_1 \\ G_1 \\ B_1 \\ A_1\\ \end{pmatrix}\\ \\ &=&\begin{pmatrix} a*R_1 + b*G_1 + c*B_1 + d*A_1\\ f*R_1 + g*G_1 + h*B_1 + i*A_1\\ k*R_1 + l*G_1 + m*B_1 + n*A_1\\ p*R_1 + q*G_1 + r*B_1 + s*A_1 \end{pmatrix} \\ \end{array}

矩阵加法运算

矩阵加法 :

  • 1.矩阵加法前提 : 进行加法运算的两个矩阵 , 其大小必须相同 , 即 行列数 都要相同才可以 ;
  • 2.矩阵加法运算 : 将两个矩阵对应的位置相加 ;
  • 3.简单示例 : 矩阵
A=\begin{pmatrix} a_{1, 1}&a_{1, 2}\\ a_{2, 1}&a_{2, 2} \end{pmatrix}

和矩阵

B=\begin{pmatrix} b_{1, 1}&b_{1, 2}\\ b_{2, 1}&b_{2, 2}\\ \end{pmatrix}

相加 ; 其结果是

\\ \\ C=A + B= \begin{pmatrix} a_{1, 1} + b_{1, 1}& a_{1, 2} + b_{1, 2}\\ a_{2, 1}+b_{2, 1} & a_{2, 2} + b_{2, 2} \\ \end{pmatrix} \\ \\

滤镜中的矩阵乘法运算

在上述

M_1

矩阵 与

C_1

矩阵相乘的结果是一个

4\times1

的矩阵, 计算过程如下 :

\begin{array}{lcl}M_1 \times C_1 &=& \begin{pmatrix} a&b& c& d\\ f & g& h& i \\ k& l& m& n \\ p&q& r& s\\ \end{pmatrix} \times \begin{pmatrix} R_1 \\ G_1 \\ B_1 \\ A_1\\ \end{pmatrix}\\ \\ &=&\begin{pmatrix} a*R_1 + b*G_1 + c*B_1 + d*A_1\\ f*R_1 + g*G_1 + h*B_1 + i*A_1\\ k*R_1 + l*G_1 + m*B_1 + n*A_1\\ p*R_1 + q*G_1 + r*B_1 + s*A_1 \end{pmatrix} \\ \end{array}

上述

4 \times 1

矩阵 在加上一个

M_2=\begin{pmatrix} e \\ j \\ o \\ t \\ \end{pmatrix}

矩阵 , 即可得到新的像素值 矩阵 ;

两个矩阵都是 4 行 1 列的

4\times 1

的矩阵 , 因此将对应位相加即可 :

\begin{pmatrix} a*R_1 + b*G_1 + c*B_1 + d*A_1\\ f*R_1 + g*G_1 + h*B_1 + i*A_1\\ k*R_1 + l*G_1 + m*B_1 + n*A_1\\ p*R_1 + q*G_1 + r*B_1 + s*A_1 \end{pmatrix} + \begin{pmatrix} e \\ j \\ o \\ t \\ \end{pmatrix} = \begin{pmatrix} a*R_1 + b*G_1 + c*B_1 + d*A_1 + e\\ f*R_1 + g*G_1 + h*B_1 + i*A_1 + j\\ k*R_1 + l*G_1 + m*B_1 + n*A_1 + o\\ p*R_1 + q*G_1 + r*B_1 + s*A_1 + t \end{pmatrix}

滤镜运算原理 ( 总结 )

① Android 显示图片方法 : 在 Android 手机中 , 一张图片 , 加载到内存中显示出来 , 其中 Android 中使用的颜色模式是 RGBA 模式 , 其有 4 个通道 ;

② RGBA 通道含义 : 在 Android 中每个像素点都包含 RGBA 四个通道信息, 分别是 Red ( 红 ) , Green ( 绿 ) , Blue ( 蓝 ) , Alpha ( 透明度 ) ;

③ 表示方法 : Android 中使用矩阵表示一个像素点的信息 , 如

C_1=\begin{pmatrix} R_1 \\ G_1 \\ B_1 \\ A_1\\ \end{pmatrix}

, 该矩阵表示一个像素点的信息 ;

④ 引入滤镜 : 颜色通道中的信息是可以修改的 , 即可以修改一个图片中像素点的颜色值 , 这个修改的方法就是使用滤镜进行修改 ;

⑤ 通道过滤矩阵 : Android 中定义了一个 过滤矩阵

M

, 专门用于计算每个像素点的颜色值的 , 将原来的颜色值矩阵

C_1

与 过滤矩阵

M

进行计算 , 得到一个新的颜色值

C_2

, 将图片中所有的像素点都使用该矩阵计算一遍 , 这个过程就是使用滤镜处理图片的原理 ;

⑥ 过滤矩阵说明 : 过滤矩阵是一个

4\times5

的矩阵 , 其有 4 行 5 列 , 如 :

M=\begin{pmatrix} a&b& c& d& e \\ f & g& h& i& j \\ k& l& m& n& o \\ p&q& r& s& t \\ \end{pmatrix}

;

⑦ 过滤矩阵拆分 : 过滤矩阵可以分为两部分 , 一部分是一个

4 \times 4

的颜色矩阵

M_1=\begin{pmatrix} a&b& c& d\\ f & g& h& i \\ k& l& m& n \\ p&q& r& s\\ \end{pmatrix}

, 另一部分是 一个

4\times1

的颜色增量值矩阵 ,

M_2=\begin{pmatrix} e \\ j \\ o \\ t \\ \end{pmatrix}

;

⑧

M_1

拆分矩阵的作用 :

M_1

矩阵主要是让像素点的 ARGB 四个通道的值 翻倍 , 指定一个 浮点型的 倍数 , 进行计算 ; ( 详细原理请看下面的 实际滤镜理论示例 )

⑨

M_2

拆分矩阵的作用 :

M_2

矩阵主要是让像素点的 ARGB 四个通道的值 进行增量修改 , 指定一个 浮点型的 数 , 进行计算 ; ( 详细原理请看下面的 实际滤镜理论示例 )

⑩ 计算过程 :

C_2

是需要计算的新的像素值 , 公式为

M_1 \times C_1 + M_2 = C_2

;

\begin{array}{lcl}M_1 \times C_1 + M_2 &=& \begin{pmatrix} a&b& c& d\\ f & g& h& i \\ k& l& m& n \\ p&q& r& s\\ \end{pmatrix} \times \begin{pmatrix} R_1 \\ G_1 \\ B_1 \\ A_1\\ \end{pmatrix} + \begin{pmatrix} e \\ j \\ o \\ t \\ \end{pmatrix}\\ \\ &=&\begin{pmatrix} a*R_1 + b*G_1 + c*B_1 + d*A_1\\ f*R_1 + g*G_1 + h*B_1 + i*A_1\\ k*R_1 + l*G_1 + m*B_1 + n*A_1\\ p*R_1 + q*G_1 + r*B_1 + s*A_1 \end{pmatrix} + \begin{pmatrix} e \\ j \\ o \\ t \\ \end{pmatrix} \\ \\ &=&\begin{pmatrix} a*R_1 + b*G_1 + c*B_1 + d*A_1 + e\\ f*R_1 + g*G_1 + h*B_1 + i*A_1 + j\\ k*R_1 + l*G_1 + m*B_1 + n*A_1 + o\\ p*R_1 + q*G_1 + r*B_1 + s*A_1 + t \end{pmatrix} \\ \end{array}

实际滤镜理论示例

实际滤镜理论示例 :

  • 1.颜色矩阵示例 :
4 \times 5

的颜色过滤矩阵

M=\begin{pmatrix} 1&0& 0& 0& 0 \\ 0& 1& 0& 0& 0 \\ 0& 0& 1& 0& 0 \\ 0&0& 0& 1& 0 \\ \end{pmatrix}

, 该 过滤矩阵 与

C_1=\begin{pmatrix} R_1 \\ G_1 \\ B_1 \\ A_1\\ \end{pmatrix}

颜色矩阵计算后的结果还是

C_1

;

  • 2.该过滤矩阵对于颜色值的影响 :
    • 红色 : 第
    1

    行 第

    1

    列 代表 Red 通道信息 ;

    • 绿色 : 第
    2

    行 第

    2

    列 代表 Green通道信息 ,

    • 蓝色 : 第
    3

    行 第

    3

    列 代表 Blue 通道信息 ,

    • 透明度 : 第
    4

    行 第

    4

    列 代表 Alpha 通道信息 ;

  • 3.将某种颜色值翻倍 : 假如使用
M=\begin{pmatrix} 2&0& 0& 0& 0 \\ 0& 1& 0& 0& 0 \\ 0& 0& 1& 0& 0 \\ 0&0& 0& 1& 0 \\ \end{pmatrix}

矩阵 , 此时 Red ( 红色 ) 的通道值会翻倍 , 像素中红色的颜色值会增加一倍 ;

  • 4.将某种颜色值增加 : 假如使用
M=\begin{pmatrix} 1&0& 0& 0& 50 \\ 0& 1& 0& 0& 0 \\ 0& 0& 1& 0& 0 \\ 0&0& 0& 1& 0 \\ \end{pmatrix}

矩阵 , 此时 Red ( 红色 ) 的通道值会增加 50 ;

相关文章