自定義色值RGB轉(zhuǎn)HSV

最近在開(kāi)發(fā)中遇到一個(gè)自定義色值的需求眷蜈,界面如下:

效果圖

原理就是:HSV與RGB的轉(zhuǎn)化過(guò)程

概述部分

1. HSV(六角錐形體模型):

H - 色調(diào)
S - 飽和度
V - 明度
電視驶忌、顯示器顯示的顏色模式。

2. 確定HSV后惕耕,效果圖功能:
· 色相(下半部分)- hue

色相

色相組成:過(guò)渡色值幸海,選擇確定hue,純色值坡脐。
(255泄私,0, 0)- > (255, 0, 255) - > (0, 0, 255) - > (0, 255, 255) - > (0, 255, 0) - > (255, 255, 0) - > (255, 0, 0)

· 色板(上半部分)- sat备闲、val

看成坐標(biāo)系的話晌端,
S = 1, V = 1原色,純色
S = 0, V = x顏色最淺恬砂,被描述為灰色(即為黑白兩色)咧纠,H無(wú)意義。
V = 0, S = x顏色都是黑色泻骤,無(wú)亮度漆羔,H、S均無(wú)意義狱掂。


色板

代碼部分

1. 下邊這段代碼是:已知RGB換算出HSV演痒,進(jìn)而在效果圖中確定選中點(diǎn)。
此處說(shuō)明下符欠,剛開(kāi)始使用了系統(tǒng)API嫡霞,得到的hsv值有問(wèn)題,所以使用了自定義獲取方法希柿,使用后OK诊沪。

//系統(tǒng)
- (BOOL)getHue:(nullable CGFloat *)hue saturation:(nullable CGFloat *)saturation brightness:(nullable CGFloat *)brightness alpha:(nullable CGFloat *)alpha API_AVAILABLE(ios(5.0));
// 自定義: rgb -> hsv
- (MyHSV)getHSVWithRGB:(MyColor)color{
    MyHSV hsv;
    CGFloat var_R = (color.r/255.0);                     //RGB from 0 to 255
    CGFloat var_G = (color.g/255.0);
    CGFloat var_B = (color.b/255.0);

    CGFloat var_Min = MIN(var_R, MIN(var_G, var_B));    //Min. value of RGB
    CGFloat var_Max = MAX(var_R, MAX(var_G, var_B));  //Max. value of RGB
    CGFloat del_Max = var_Max - var_Min;             //Delta RGB value

    hsv.v = var_Max;

    if ( del_Max == 0 ){                     //This is a gray, no chroma...{
        hsv.h = 0;                                //HSV results from 0 to 1
        hsv.s = 0;
    }else{                                    //Chromatic data...
    
        hsv.s = del_Max / var_Max;

        CGFloat del_R = ( ( ( var_Max - var_R ) / 6.0 ) + ( del_Max / 2.0 ) ) / del_Max;
        CGFloat del_G = ( ( ( var_Max - var_G ) / 6.0 ) + ( del_Max / 2.0 ) ) / del_Max;
        CGFloat del_B = ( ( ( var_Max - var_B ) / 6.0 ) + ( del_Max / 2.0 ) ) / del_Max;

        if( var_R == var_Max ){
            hsv.h = del_B - del_G;
        }else if ( var_G == var_Max ){
            hsv.h = ( 1 / 3.0 ) + del_R - del_B;
        }else if (var_B == var_Max) {
            hsv.h = ( 2 / 3.0 ) + del_G - del_R;
        }

        if ( hsv.h < 0 )  {
            hsv.h += 1;
        }else if (hsv.h > 1){
            hsv.h -= 1;
        }
    }
    return hsv;
}

2. 下邊兩段代碼是根據(jù)色相、色板(hsv)確定RGB
色相(顏色條)手勢(shì)

- (void)touchBarWithPoint:(CGPoint)point flag:(short)flag{
    //改變指示器位置
    CGRect frame = self.barPoint.frame;
    frame.origin.x = point.x - 7;
    self.barPoint.frame = frame;
    
    //顏色計(jì)算器部分
    int r,g,b;
    int n = 1530 * [self check: point.x / self.colorBar.frame.size.width];
    //初始化顏色顯示(1曾撤,0端姚, 0)- > (1, 0, 1) - > (0, 0, 1) - > (0, 1, 1) - > (0, 1, 0) - > (1, 1, 0) - > (1, 0, 0)
    switch (n/255) {
        case 0: r = 255; g = 0; b = n; break;
        case 1: r = 255 - (n % 255); g = 0; b = 255; break;
        case 2: r = 0; g = n % 255; b = 255; break;
        case 3: r = 0; g = 255; b = 255 - (n % 255); break;
        case 4: r = n % 255; g = 255; b = 0; break;
        case 5: r = 255; g = 255 - (n % 255); b = 0; break;
        default: r = 255; g = 0; b = 0; break;
    }
         
    self.colora = [self setMyColorWithR:r G:g B:b A:1];
    self.brightImageView.backgroundColor = [self transformMyColorToUIColor:self.colora];
    [self touchBrightWithPoint:CGPointMake(0, 0) flag:-1];
}

色板手勢(shì)

- (void)touchBrightWithPoint:(CGPoint)point flag:(short)flag{
   if(flag == -1)
   {
       point = self.brightPoint.frame.origin;
       point.x += 7;
       point.y += 7;
   }
   //改變指示器位置
   CGRect frame = self.brightPoint.frame;
   frame.origin.x = point.x - 7;
   frame.origin.y = point.y - 7;
   self.brightPoint.frame = frame;
   
   int r,g,b;
   double xrate = [self check: point.x / self.brightImageView.frame.size.width];
   double yrate = 1 - [self check: point.y / self.brightImageView.frame.size.height];
   
   // sv圖 - 左側(cè)焦點(diǎn)
   MyColor tempa = [self setMyColorWithR:255 * yrate G:255 * yrate B:255 * yrate A:1];
   
   r = self.colora.r * yrate;
   g = self.colora.g * yrate;
   b = self.colora.b * yrate;
   // sv圖 - 右側(cè)焦點(diǎn)
   MyColor tempb = [self setMyColorWithR:r G:g B:b A:1];
   r = tempb.r + (1 - xrate) * (tempa.r - tempb.r);
   g = tempb.g + (1 - xrate) * (tempa.g - tempb.g);
   b = tempb.b + (1 - xrate) * (tempa.b - tempb.b);
   MyColor tempColor = [self setMyColorWithR:r G:g B:b A:1];
   NSString *xColor = [NSString stringWithFormat:@"#%02x%02x%02x", tempColor.r, tempColor.g, tempColor.b];
   if ([xColor isKindOfClass:[NSString class]]) {
       [self.valueLabel showColor:xColor.uppercaseString];
       if (_tempBlock) {
           if (_selAlpha < 1) {
               _tempBlock([CommUtls getRGBAcolorWithHexString:xColor colorAlpha:_selAlpha]);
           }else{
               _tempBlock(xColor);
           }
       }
   }
}
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市挤悉,隨后出現(xiàn)的幾起案子渐裸,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 219,589評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件昏鹃,死亡現(xiàn)場(chǎng)離奇詭異尚氛,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)洞渤,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,615評(píng)論 3 396
  • 文/潘曉璐 我一進(jìn)店門(mén)阅嘶,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人载迄,你說(shuō)我怎么就攤上這事讯柔。” “怎么了护昧?”我有些...
    開(kāi)封第一講書(shū)人閱讀 165,933評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵魂迄,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我惋耙,道長(zhǎng)捣炬,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,976評(píng)論 1 295
  • 正文 為了忘掉前任怠晴,我火速辦了婚禮遥金,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘蒜田。我一直安慰自己稿械,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,999評(píng)論 6 393
  • 文/花漫 我一把揭開(kāi)白布冲粤。 她就那樣靜靜地躺著美莫,像睡著了一般。 火紅的嫁衣襯著肌膚如雪梯捕。 梳的紋絲不亂的頭發(fā)上厢呵,一...
    開(kāi)封第一講書(shū)人閱讀 51,775評(píng)論 1 307
  • 那天,我揣著相機(jī)與錄音傀顾,去河邊找鬼襟铭。 笑死,一個(gè)胖子當(dāng)著我的面吹牛短曾,可吹牛的內(nèi)容都是我干的寒砖。 我是一名探鬼主播,決...
    沈念sama閱讀 40,474評(píng)論 3 420
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼嫉拐,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼哩都!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起婉徘,我...
    開(kāi)封第一講書(shū)人閱讀 39,359評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤漠嵌,失蹤者是張志新(化名)和其女友劉穎咐汞,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體儒鹿,經(jīng)...
    沈念sama閱讀 45,854評(píng)論 1 317
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡化撕,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,007評(píng)論 3 338
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了挺身。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片侯谁。...
    茶點(diǎn)故事閱讀 40,146評(píng)論 1 351
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡锌仅,死狀恐怖章钾,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情热芹,我是刑警寧澤贱傀,帶...
    沈念sama閱讀 35,826評(píng)論 5 346
  • 正文 年R本政府宣布,位于F島的核電站伊脓,受9級(jí)特大地震影響府寒,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜报腔,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,484評(píng)論 3 331
  • 文/蒙蒙 一株搔、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧纯蛾,春花似錦纤房、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 32,029評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至碰煌,卻和暖如春舒岸,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背芦圾。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,153評(píng)論 1 272
  • 我被黑心中介騙來(lái)泰國(guó)打工蛾派, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人个少。 一個(gè)月前我還...
    沈念sama閱讀 48,420評(píng)論 3 373
  • 正文 我出身青樓洪乍,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親稍算。 傳聞我的和親對(duì)象是個(gè)殘疾皇子典尾,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,107評(píng)論 2 356

推薦閱讀更多精彩內(nèi)容