版权声明:本文为博主原创文章,未经博主允许不得转载。

Android 颜色选择器之ColorPickerDialog剖析

有这样一个需求,可以让用户自定义背景颜色,这就需要提供一个颜色选择器给用户.

在Android 中,如何实现这样的功能呢,遇到这种需求是,先查看一下ApiDemos,是否已经有相关的实例,果然,找到了一个可以参考的demo:ColorPickerDialog

我已经把apidemos导入到eclipse中,请看截图:

我们要找的就是这个ColorPickerDialog,在com.example.android.apis.graphics目录下,是一个颜色选择器对话框,在哪个demo中使用的呢,References下之后,发现是在

FingerPaint,也就是涂鸦的例子中:

接下来还是直接看代码:

  1. package com.example.android.apis.graphics;
  2. import android.os.Bundle;
  3. import android.app.Dialog;
  4. import android.content.Context;
  5. import android.graphics.*;
  6. import android.view.MotionEvent;
  7. import android.view.View;
  8. public class ColorPickerDialog extends Dialog {
  9. public interface OnColorChangedListener {
  10. void colorChanged(int color);
  11. }
  12. private OnColorChangedListener mListener;
  13. private int mInitialColor;
  14. private static class ColorPickerView extends View {//颜色选择器自定义View
  15. private Paint mPaint;<span><span></span><span class="comment">//渐变色环画笔</span><span> </span></span>
  16. private Paint mCenterPaint;<span><span></span><span class="comment">//中间圆画笔</span><span>  </span></span>
  17. private final int[] mColors;<span><span></span><span class="comment">//渐变色环颜色</span><span></span></span>
  18. private OnColorChangedListener mListener;//颜色改变回调
  19. ColorPickerView(Context c, OnColorChangedListener l, int color) {
  20. super(c);
  21. mListener = l;
  22. mColors = new int[] {//渐变色数组
  23. 0xFFFF0000, 0xFFFF00FF, 0xFF0000FF, 0xFF00FFFF, 0xFF00FF00,
  24. 0xFFFFFF00, 0xFFFF0000
  25. };
  26. Shader s = new SweepGradient(0, 0, mColors, null);
  27. //初始化渐变色画笔
  28. mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
  29. mPaint.setShader(s);
  30. mPaint.setStyle(Paint.Style.STROKE);
  31. mPaint.setStrokeWidth(32);
  32. //初始化中心园画笔
  33. mCenterPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
  34. mCenterPaint.setColor(color);
  35. mCenterPaint.setStrokeWidth(5);
  36. }
  37. private boolean mTrackingCenter;
  38. private boolean mHighlightCenter;
  39. @Override
  40. protected void onDraw(Canvas canvas) {
  41. float r = CENTER_X - mPaint.getStrokeWidth()*0.5f;
  42. //移动中心
  43. canvas.translate(CENTER_X, CENTER_X);
  44. //画出色环和中心园
  45. canvas.drawOval(new RectF(-r, -r, r, r), mPaint);
  46. canvas.drawCircle(0, 0, CENTER_RADIUS, mCenterPaint);
  47. if (mTrackingCenter) {
  48. int c = mCenterPaint.getColor();
  49. mCenterPaint.setStyle(Paint.Style.STROKE);
  50. if (mHighlightCenter) {
  51. mCenterPaint.setAlpha(0xFF);
  52. } else {
  53. mCenterPaint.setAlpha(0x80);
  54. }
  55. canvas.drawCircle(0, 0,
  56. CENTER_RADIUS + mCenterPaint.getStrokeWidth(),
  57. mCenterPaint);
  58. mCenterPaint.setStyle(Paint.Style.FILL);
  59. mCenterPaint.setColor(c);
  60. }
  61. }
  62. @Override
  63. protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
  64. setMeasuredDimension(CENTER_X*2, CENTER_Y*2);
  65. }
  66. private static final int CENTER_X = 100;
  67. private static final int CENTER_Y = 100;
  68. private static final int CENTER_RADIUS = 32;
  69. private int floatToByte(float x) {
  70. int n = java.lang.Math.round(x);
  71. return n;
  72. }
  73. private int pinToByte(int n) {
  74. if (n < 0) {
  75. n = 0;
  76. } else if (n > 255) {
  77. n = 255;
  78. }
  79. return n;
  80. }
  81. private int ave(int s, int d, float p) {
  82. return s + java.lang.Math.round(p * (d - s));
  83. }
  84. private int interpColor(int colors[], float unit) {
  85. if (unit <= 0) {
  86. return colors[0];
  87. }
  88. if (unit >= 1) {
  89. return colors[colors.length - 1];
  90. }
  91. float p = unit * (colors.length - 1);
  92. int i = (int)p;
  93. p -= i;
  94. // now p is just the fractional part [0...1) and i is the index
  95. int c0 = colors[i];
  96. int c1 = colors[i+1];
  97. int a = ave(Color.alpha(c0), Color.alpha(c1), p);
  98. int r = ave(Color.red(c0), Color.red(c1), p);
  99. int g = ave(Color.green(c0), Color.green(c1), p);
  100. int b = ave(Color.blue(c0), Color.blue(c1), p);
  101. return Color.argb(a, r, g, b);
  102. }
  103. private int rotateColor(int color, float rad) {
  104. float deg = rad * 180 / 3.1415927f;
  105. int r = Color.red(color);
  106. int g = Color.green(color);
  107. int b = Color.blue(color);
  108. ColorMatrix cm = new ColorMatrix();
  109. ColorMatrix tmp = new ColorMatrix();
  110. cm.setRGB2YUV();
  111. tmp.setRotate(0, deg);
  112. cm.postConcat(tmp);
  113. tmp.setYUV2RGB();
  114. cm.postConcat(tmp);
  115. final float[] a = cm.getArray();
  116. int ir = floatToByte(a[0] * r +  a[1] * g +  a[2] * b);
  117. int ig = floatToByte(a[5] * r +  a[6] * g +  a[7] * b);
  118. int ib = floatToByte(a[10] * r + a[11] * g + a[12] * b);
  119. return Color.argb(Color.alpha(color), pinToByte(ir),
  120. pinToByte(ig), pinToByte(ib));
  121. }
  122. private static final float PI = 3.1415926f;
  123. @Override
  124. public boolean onTouchEvent(MotionEvent event) {
  125. float x = event.getX() - CENTER_X;
  126. float y = event.getY() - CENTER_Y;
  127. boolean inCenter = java.lang.Math.sqrt(x*x + y*y) <= CENTER_RADIUS;
  128. switch (event.getAction()) {
  129. case MotionEvent.ACTION_DOWN:
  130. mTrackingCenter = inCenter;
  131. if (inCenter) {//是否则中心园
  132. mHighlightCenter = true;
  133. invalidate();
  134. break;
  135. }
  136. case MotionEvent.ACTION_MOVE:
  137. if (mTrackingCenter) {
  138. if (mHighlightCenter != inCenter) {
  139. mHighlightCenter = inCenter;
  140. invalidate();
  141. }
  142. } else {
  143. float angle = (float)java.lang.Math.atan2(y, x);
  144. // need to turn angle [-PI ... PI] into unit [0....1]
  145. float unit = angle/(2*PI);
  146. if (unit < 0) {
  147. unit += 1;
  148. }
  149. mCenterPaint.setColor(interpColor(mColors, unit));
  150. invalidate();
  151. }
  152. break;
  153. case MotionEvent.ACTION_UP:
  154. if (mTrackingCenter) {
  155. if (inCenter) {
  156. mListener.colorChanged(mCenterPaint.getColor());
  157. }
  158. mTrackingCenter = false;    // so we draw w/o halo
  159. invalidate();
  160. }
  161. break;
  162. }
  163. return true;
  164. }
  165. }
  166. public ColorPickerDialog(Context context,
  167. OnColorChangedListener listener,
  168. int initialColor) {
  169. super(context);
  170. mListener = listener;
  171. mInitialColor = initialColor;
  172. }
  173. @Override
  174. protected void onCreate(Bundle savedInstanceState) {
  175. super.onCreate(savedInstanceState);
  176. OnColorChangedListener l = new OnColorChangedListener() {
  177. public void colorChanged(int color) {
  178. mListener.colorChanged(color);
  179. dismiss();
  180. }
  181. };
  182. setContentView(new ColorPickerView(getContext(), l, mInitialColor));
  183. setTitle("Pick a Color");
  184. }
  185. }

当然,目前的这个例子还有一定的局限,比如无黑白色,只能选择大概的颜色区间(后续会讲解). 当然只要把这个demo研究好后,具体的改进不是问题.

另附上ApiDemos下载地址: http://download.csdn.net/detail/t12x3456/6007883

如有转载,请声明出处: 时之沙: http://blog.csdn.net/t12x3456

Android 颜色渲染(一) 颜色选择器 ColorPickerDialog剖析的更多相关文章

  1. Android 颜色渲染(二) 颜色区域划分原理与实现思路

    版权声明:本文为博主原创文章,未经博主允许不得转载. 上一篇讲到颜色选择器,该demo不能选择黑白或者具体区间颜色,这是为什么呢,还是要从原理部分讲起,首先看一下两张图:            图1 ...

  2. NeHe OpenGL教程 第三课:颜色渲染

    转自[翻译]NeHe OpenGL 教程 前言 声明,此 NeHe OpenGL教程系列文章由51博客yarin翻译(2010-08-19),本博客为转载并稍加整理与修改.对NeHe的OpenGL管线 ...

  3. Android 颜色渲染(九) PorterDuff及Xfermode详解

    版权声明:本文为博主原创文章,未经博主允许不得转载. Android 颜色渲染(九)  PorterDuff及Xfermode详解 之前已经讲过了除ComposeShader之外Shader的全部子类 ...

  4. Android 颜色渲染(十) ComposeShader组合渲染

    版权声明:本文为博主原创文章,未经博主允许不得转载. 目录(?)[+] Android 颜色处理(十) ComposeShader组合渲染 public ComposeShader(Shader sh ...

  5. Android 颜色渲染(八) SweepGradient扫描/梯度渲染

    版权声明:本文为博主原创文章,未经博主允许不得转载. 目录(?)[+] Android 颜色处理(八) SweepGradient 扫描/梯度渲染 为什么什么叫扫描渲染呢?  相信大家都看过雷达扫描的 ...

  6. Android 颜色渲染(三) Shader颜色渲染

    版权声明:本文为博主原创文章,未经博主允许不得转载. 相信看过在上一篇中提到的三篇文章后,大家已经对颜色处理方面有更深的体会. 之前讲到颜色渐变的效果, 具体怎么做呢,这就需要应用颜色渲染. 首先要介 ...

  7. Android特效专辑(二)——ViewPager渲染背景颜色渐变(引导页)

    Android特效专辑(二)--ViewPager渲染背景颜色渐变(引导页) 首页:http://blog.csdn.net/qq_26787115/article/details/50439020 ...

  8. Android background tint颜色渲染

    该篇文章主要是讲Android颜色渲染,首先先来看看PorterDuff,对绘图非常重要. PorterDuff的由来: 相信大多数人看到这个ProterDuff单词很奇怪了吧,这肿么个意思呢,然后就 ...

  9. Android 仿PhotoShop调色板应用(四) 不同区域颜色选择的颜色生成响应

    版权声明:本文为博主原创文章,未经博主允许不得转载.  Android 仿PhotoShop调色板应用(四) 不同区域颜色选择的颜色生成响应  上一篇讲过了主体界面的绘制,这里讲解调色板应用中的另外一 ...

随机推荐

  1. 轻松使用px为单位开发移动端页面

    研究移动端页面已经有许久了,一直执着于rem来开发,不谈性能怎么样,单从工作效率上看影响了不少,首先要固定设计稿的宽度,一般都是固定在640px,然后在根据根目录的字体大小来计算出每个元素的rem的值 ...

  2. QNetworkRequest 请求类

    QNetworkRequest Class Header:    #include <QNetworkRequest>qmake:     QT += networkSince:     ...

  3. Mongodb在Windows下安装及配置 【转】

    1.下载mongodb的windows版本,有32位和64位版本,根据系统情况下载,下载地址:http://www.mongodb.org/downloads 2.解压缩至E:/mongodb即可 3 ...

  4. 最常用的动态sql语句梳理——分享给使用Mybatis的小伙伴们!

    公司项目中一直使用Mybatis作为持久层框架,自然,动态sql写得也比较多了,最常见的莫过于在查询语句中使用if标签来动态地改变过滤条件了.Mybatis的强大特性之一便是它的动态sql,免除了拼接 ...

  5. struts.enable.DynamicMethodInvocation = true 动态方法调用

    default.properties 在Struts 2的核心jar包-struts2-core中,有一个default.properties的默认配置文件.里面配置了一些全局的信息,比如: stru ...

  6. In machine learning, is more data always better than better algorithms?

    In machine learning, is more data always better than better algorithms? No. There are times when mor ...

  7. NEURAL NETWORKS, PART 2: THE NEURON

    NEURAL NETWORKS, PART 2: THE NEURON A neuron is a very basic classifier. It takes a number of input ...

  8. Jqgrid动态拖拽

    //注册事件 jQuery("#list1").jqGrid('setGridParam', { gridComplete : function() { $("#_emp ...

  9. 【UVA10829】 L-Gap Substrings (后缀数组)

    Description If a string is in the form UVU, where U is not empty, and V has exactly L characters, we ...

  10. Delphi_OD_代码_调试_Delphi反调试技术(以OD为例附核心原代码)

    1.程序窗口[chuang kou]句柄[ju bing]检测原理:用FindWindow函数[han shu]查找[cha zhao]具有相同窗口[chuang kou]类名和标题的窗口[chuan ...