美文网首页
根据给定颜色定位到彩色圆上的位置

根据给定颜色定位到彩色圆上的位置

作者: 水煮杰尼龟 | 来源:发表于2017-10-28 17:20 被阅读28次

    项目中有这样的需求,获取到的某一种颜色,将button 定位到彩色圆上的位置。
    这里需要用到HSB的概念了。

    色相H( Hue ):在0~360°的标准色环上,按照角度值标识。比如红是0°、橙色是30°等。
    饱和度S( saturation ):是指颜色的强度或纯度。饱和度表示色相中彩色成分所占的比例,用从0%(灰色)~100%(完全饱和)的百分比来度量。在色立面上饱和度是从内向外逐渐增加。
    亮度B( brightness ):是颜色的明暗程度,通常是从0(黑)~100%(白)的百分比来度量的,在色立面中从上至下逐渐递减,上边线为100%,下边线为0% 。

    既然是0~360°,红色的是0°. 根据角度来定位。
    当然这是一种思路而已,大屌绕道。
    举个我这边的例子:我这边是根据一张彩色的图片来的

        UIImageView *imgView=[[UIImageView alloc]initWithImage:[UIImage imageNamed:@"Combined Shape"]];
        imgView.frame=CGRectMake(70, 74, 235, 235);
        imgView.userInteractionEnabled=YES;
        [self.view addSubview:imgView];
        self.imgView=imgView;
        
        UIButton *btn=[UIButton buttonWithType:UIButtonTypeCustom];
        btn.layer.cornerRadius=11.5;
        btn.backgroundColor=[UIColor clearColor];
        btn.layer.borderColor=[UIColor whiteColor].CGColor;
        btn.layer.borderWidth=2;
        btn.size=CGSizeMake(23, 23);
        btn.center=CGPointMake(imgView.frame.size.width/2, imgView.frame.size.height/2-107);
        [imgView addSubview:btn];
        self.sliderBtn=btn;
        
        [[[UIColor redColor] neoToHSL] getHue:&_hue saturation:&_saturation brightness:&_luminosity alpha:&_alpha];
        [self positionHue];
    
    - (void) positionHue {
        CGFloat angle = M_PI * 2 * _hue+M_PI*1/3;
        CGFloat cx = 107 * cos(angle) + self.imgView.frame.size.width/2 ;
        CGFloat cy = 107 * sin(angle) + self.imgView.frame.size.width/2 ;
        CGRect frame = self.sliderBtn.frame;
        frame.origin.x = cx;
        frame.origin.y = cy;
        self.sliderBtn.center = CGPointMake(cx, cy);
    }
    
    

    如上代码得到的效果就是这样:

    1.png

    可以看出定位在红色位置了, 我这边因为是红色并不在0度的位置,所以+M_PI*1/3的角度,这个自行调整。

    颜色是先转成HSL的Color了再获取到饱和度。
    位置就根据角度来算了,考验数学能力了。
    其他就根据自身需求做一些调整,修改咯。

    最后摆一个转HSL的分类:

    - (UIColor *) neoToHSL {
        CGFloat h, s, l, w, a;
        if ([self getHue:&h saturation:&s brightness:&l alpha:&a]) {
            return self;
        } else if ([self getWhite:&w alpha:&a]) {
            return [UIColor colorWithHue:0 saturation:0 brightness:w alpha:a];
        } else {
            CGFloat r, g, b;
            [self getRed:&r green:&g blue:&b alpha:&a];
            CGFloat min, max, delta;
            min = MIN(MIN(r, g), b);
            max = MAX(MAX(r, g), b);
            delta = max - min;
            l = (max + min) / 2;
            if (delta == 0) {
                h = 0;
                s = 0;
            } else {
                if (l < 0.5 ) {
                    s = max / ( max + min );
                } else {
                    s = max / ( 2 - max - min );
                }
                
                CGFloat dR, dG, dB;
                
                dR = (((max - r) / 6.0) + (max / 2)) / max;
                dG = (((max - g) / 6) + (max / 2)) / max;
                dB = (((max - b) / 6) + (max / 2)) / max;
    
                if (r == max) {
                    h = dB - dG;
                } else if (g == max) {
                    h = 1/3 + dR - dB;
                } else if (b == max) {
                    h = 2/3 + dG - dR;
                }
                
                if (h < 0) h += 1;
                if (h > 1) h -= 1;
            }
            return [UIColor colorWithHue:h saturation:s brightness:l alpha:a];
        }
    }
    

    相关文章

      网友评论

          本文标题:根据给定颜色定位到彩色圆上的位置

          本文链接:https://www.haomeiwen.com/subject/kwrspxtx.html