//轉載請註明http://blog.csdn.net/zzzqqq111222 支援原創哦

在色彩領域計算機常用的模型是rgb色彩模型，但對顏色更直觀的表述卻是hsb（又稱hsv 我猜是為了和rgb的b區別所以叫的hsv）模型（不懂的百度）。我要實現的效果如圖1。

圖1.

解釋一下哈 外圍的環用於 顏色的選擇（就是hsb中的h--色相）內三角形用於其他兩個引數s,b的選擇。

看了一下外圍的圓圈比較好實現就是畫個圓環再獲取在觸控事件再根據座標計算出角度，angle ,h=angle/360; (注hsb都小於1 的)這樣圓環就完成 了；

附根據座標算角度的原始碼：

<pre name="code" class="objc">/**計算點所在角度的
@Parameter p1 中心點
@Parameter p2 
@return 0-360 度數
	
#define SQR（x ） (x)*(x)
#define ToDeg(rad)		( (180.0 * (rad)) / M_PI )
*/
static inline float AngleFromNorth(CGPoint p1, CGPoint p2) {
	//將座標軸移動到中心點
    CGPoint v = CGPointMake(p2.x-p1.x,p2.y-p1.y);
	 //算出距原點的距離
    float vmag = sqrt(SQR(v.x) + SQR(v.y)), result = 0;
	
    v.x /= vmag;
    v.y /= vmag;
	//根據座標 三角正切公式 算角度
    double radians = atan2(v.y,v.x);
	//轉化
    result = ToDeg(radians);
    return (result >=0  ? 360 - result : -result );
}
 

接下來 主要的就是三角形了 要能隨圓環給的h值來變化就要弄清變化的規律。 規律是這樣的（經過的多年的研究。。。）:

首先定義最上邊的頂點為A,最下的頂點為B最右的頂點為C

1.在C點s，b值為最大1 . 

2.  三角形上的點的p, 將p與C連線，延長線與線AB交與點D，那麼此點的顏色b值=BD/AB; 而s值為Dp/DA;

接下來分析好了就是實現它了；

外圍的環就用一張靜態圖就可以了

三角形得用畫素點繪圖生成圖片再貼上去的方式了，還有IOS上有HSB這樣表示顏色的類極大方便了我。

繪製這個三角形是個麻煩事

三角形動態繪製的原始碼：

-(CGImageRef)triangleImg
{
    unsigned int* data = malloc((int)inner_radius*(int)inner_radius*sizeof(int)*4);
	unsigned int* count = data;
	for(int j=0;j<(int)inner_radius*2;j++){
        for(int i=0;i<(int)inner_radius*2;i++){
            
            if([self isInThisTriangle:i+outside_radius-inner_radius+PADDING :j+outside_radius-inner_radius+PADDING]){
             //座標系變幻把三角形瓣正 方便計算//
			 
                float J_x = i - inner_radius;
                float J_y = j - inner_radius;
         
                const float *x = CGColorGetComponents([self pointToColor:J_x :J_y].CGColor );
                unsigned int r=x[0]*255;
                unsigned int g=x[1]*255;
                unsigned int b=x[2]*255;
                unsigned int a=x[3]*255;
				
                *count++ = a|b<<8|g<<16|r<<24 ;
                
            }else{
                *count++ = 0;
            }
     
        
        }
    }
    
	CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
	CGBitmapInfo bitmapInfo = kCGImageAlphaPremultipliedLast | kCGBitmapByteOrder32Little;
	CGContextRef ctx = CGBitmapContextCreate(data, (int)inner_radius*2, (int)inner_radius*2, 8, (int)inner_radius*8, colorSpace, bitmapInfo);
    
	CGColorSpaceRelease(colorSpace);
	CGImageRef img = CGBitmapContextCreateImage(ctx);
	CGContextRelease(ctx);
	free(data);
	return img;
}
 

原始碼 還是要給點分的 地址：http://download.csdn.net/detail/zzzqqq111222/7937425點選開啟連結