一、在大学期间,看到机智云开源的这个rgb灯,蛮好奇的,这么漂亮的颜色采集,并且可以同步到设备rbg灯颜色,甚是不解!这个谜团一直在心中困惑。 越是...

Android自定义View之七色环颜色采集器:续我未完的大学梦!!

一、前言。

在大学期间,看到机智云开源的这个rgb灯,蛮好奇的,这么漂亮的颜色采集,并且可以同步到设备rbg灯颜色,甚是不解!这个谜团一直在心中困惑。
越是好奇,越是扬起袖子就是干!于是乎,自己结合自己的开发经验和网上开源的代码,进一步的剖析原理,把分析过程一一展现给大家。
标题为啥是续我未完的大学梦呢?因为大学对这个界面“一见钟情”,相信这个也是大家所好奇的。为什么手机的颜色可以同步设备rbg灯的颜色,那本文主要讲怎么绘制这么一个界面,具体的同步颜色到设备的原理,我不一一分析了,当然了,会透漏一点点。
下面的是我练手项目一个工程的一个设备控制界面,到时候会开源出来滴:

二、绘图步骤:

绘图原理:
绘图步骤:
第一步:先画圆环和内部圆。
具体的自定义画圆的步骤大家都熟悉。画笔、测量。
画笔初始化不必多说,强调下渐变色环画笔的stytle属性;还有渐变色环通过SweepGradient类实现。
Paint.Style.STROKE : 只绘制图形轮廓(描边),通常的圆环设置这个属性。
Paint.Style.FILL : 只绘制图形内容 。
Paint.Style.FILL_AND_STROKE : 既绘制轮廓也绘制内容。
//circleX 渲染中心点x坐标,circleY渲染中心y点坐标;mCircleColors为渐变颜色内容 Shader s =new SweepGradient(circleX, circleY, mCircleColors,null); paintCircleRing.setShader(s);测量:取整个父布局的view的宽和高,对比取最小一个,保证了半径可以被整个view包裹。//圆环的画笔private Paint paintCircleRing;//最里面的圆的画笔,默认是绿色private Paint paintInnerColor;//渐变色环参数:红、紫、蓝、绿、黄、橙、红privatefinalint[] mCircleColors =newint[]{0xFFFF0000,0xFFFF00FF,0xFF0000FF,0xFF00FFFF,0xFF00FF00,0xFFFFFF00,0xFFFF0000};//初始化画笔,构造方法调用。privatevoidinit() {// 渐变色环参数 paintCircleRing =new Paint(Paint.ANTI_ALIAS_FLAG); paintCircleRing.setAntiAlias(true); paintCircleRing.setStyle(Paint.Style.STROKE); paintCircleRing.setStrokeWidth(30);//内圆参数 paintInnerColor =new Paint(); paintInnerColor.setColor(Color.GREEN); paintInnerColor.setAntiAlias(true); paintInnerColor.setStrokeWidth(5); }
效果:
三、画圆形图片选择器。
1、 已知圆环的半径outerRadius和原点的坐标(circleX , circleY),通过博文的第一个原理图可得选择器坐标://选择器x坐标 markPointX = (float) (circleX + outerRadius * Math.sin(angle * Math.PI /180));//选择器y坐标 markPointY = (float) (circleY - outerRadius * Math.cos(angle * Math.PI /180));2、 画圆点选择器(下图的左边):
frameRadius 半径就是外圆半径减去OC的长度除于2;canvas.drawCircle(markPointX, markPointY, frameRadius, paintSelecter);
四、颜色求角度。
毋庸置疑,当先从颜色十六进制拿出R、G、B颜色和色环的颜色对比得到结论。privatefloat fromColor2Degree(intcolor) {float degree =0;int diff =360 / (mCircleColors.length -1);int r = Color.red(color);int g = Color.green(color);int b = Color.blue(color);int[] mColor = {b, g, r};// 把最大的,置0xFF,最小的,置0intmin = findMin(b, g, r);intmax = findMax(b, g, r);int temp = (0xff