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

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. WPF Window对象

    户通过窗口与 Windows Presentation Foundation (WPF) 独立应用程序进行交互.窗口的主要用途是承载可视化数据并使用户可以与数据进行交互的内容.独立 WPF 应用程序使 ...

  2. css3:user-select属性

    一.user-select简介 这是在css3 UI规范中新增的一个功能,用来控制内容的可选择性 二.user-select:值 auto——默认值,用户可以选中元素中的内容 none——用户不能选择 ...

  3. 共享式以太网与交换式以太网的性能比较(OPNET网络仿真实验)

      一.实验目的 比较共享式以太网和交换式以太网在不同网络规模下的性能. 二.实验方法 使用opnet来创建和模拟网络拓扑,并运行分析其性能. 三.实验内容 3.1   实验设置(网络拓扑.参数设置. ...

  4. C#(MVC) Word 替换,填充表格,导出并下载PDF文档

    近期做一个关于C# 操作 Word 模板 文档的功能模块,查阅资料,最终完美完成任务,记录下来,以便后面还会用到.

  5. Asm.js: Javascript的编译目标

    正如许多开发者一样,我也为Asm.js的前景而感到兴奋不已.最近的新闻——Asm.js正 在被Firefox支持——引起了我的兴趣.同样感兴趣的还有Mozilla和Epic声明(mirror)他们已经 ...

  6. Solr总结

    http://www.cnblogs.com/guozk/p/3498831.html Solr调研总结 开发类型 全文检索相关开发 Solr版本 4.2 文件内容 本文介绍solr的功能使用及相关注 ...

  7. 单片机Keil软件仿真与调试技巧

    一.引言 单片机软件开发过程中,软件调试遇到的各种问题常令初学者感到不知所措.实际上.各种仿真开发软件的程序调试基本方法和技巧大同小异,掌握正确的程序调试基本技巧.对于排查这些程序错误问题可以起到举一 ...

  8. log4j将日志输出到控制台,文件,邮件

    #将日志写到文件 log4j.appender.file=org.apache.log4j.DailyRollingFileAppender log4j.appender.file.File=e\:\ ...

  9. xlslib安装, aclocal-1.13: command not found, 安装升级autoconf-2.65.tar.gz, automake-1.13.tar.gz两个文件

    问题1: $ make CDPATH="${ZSH_VERSION+.}:" && cd . && aclocal-1.13 -I m4 /bin/ ...

  10. configure: error: cannot find protoc, the Protocol Buffers compiler

    centos 6 安装mosh 1.2 2012-05-07 17:21:41标签:centos mosh 关于mosh(引用于) 芬兰研究员Tatu Ylönen于1995年设计出最早的SSH协议, ...