iOS获取图片区域主色的方法

之前的项目有这样的需求,有一个页面可以检索一块区域内图片的主色。效果图如图所示

下面是如何获取区域主色的实现思路:
首先,我们需要从相册,或者相机去获取图片;
其次,得到图片需要截取区域图片;
然后,获取截取图片的主色。
理想中是这样的,但是有很多阻碍,得到的图片需要自适应imageView(imageView的宽高是固定的),截图的得到的区域不是自己想要的区域。这里需要将图片等比例缩放,按照ImageView的宽高。

那现在就直接上代码吧!

首先我们需要等比例缩放Image:

/**
 *  缩放图片
 *
 *  @param img  image
 *  @param size 缩放后的大小
 *
 *  @return image
 */
+ (UIImage *)scaleToSize:(UIImage *)img size:(CGSize)size{
    // 创建一个bitmap的context
    CGFloat width = CGImageGetWidth(img.CGImage);
    CGFloat height = CGImageGetHeight(img.CGImage);

    CGFloat max = width >= height ? width:height;
    CGSize originSize;
    if (max <= 0) {
        return nil;
    }
    if (width >= height) {
        originSize = CGSizeMake(size.width, (size.width * height)/width);
    }else{
        originSize = CGSizeMake((size.height * width)/height, size.height);
    }
    // 并把它设置成为当前正在使用的context
    UIGraphicsBeginImageContext(size);
    // 绘制改变大小的图片
    [img drawInRect:CGRectMake((size.width - originSize.width)/2, (size.height - originSize.height)/2, originSize.width, originSize.height)];
    // 从当前context中创建一个改变大小后的图片
    UIImage* scaledImage = UIGraphicsGetImageFromCurrentImageContext();
    // 使当前的context出堆栈
    UIGraphicsEndImageContext();
    // 返回新的改变大小后的图片
    return scaledImage;
}

之后就是截取区域图片,这理解去10*10的方块:

// 裁剪图片
+ (UIImage *)imageFromImage:(UIImage *)image inRect:(CGRect)rect {
    CGImageRef sourceImageRef = [image CGImage];
    CGImageRef newImageRef = CGImageCreateWithImageInRect(sourceImageRef, rect);
    UIImage *newImage = [UIImage imageWithCGImage:newImageRef];
    CGImageRelease(newImageRef);
    return newImage;
}

然后获取图片的主色:

/**
 *  获取图片的主色
 *
 *  @param image image
 *  @param scale 精准度0.1~1
 *
 *  @return 图片的主要颜色
 */
+ (NSDictionary *)mostColor:(UIImage *)image scale:(CGFloat)scale{

#if __IPHONE_OS_VERSION_MAX_ALLOWED > __IPHONE_6_1
    int bitmapInfo = kCGBitmapByteOrderDefault | kCGImageAlphaPremultipliedLast;
#else
    int bitmapInfo = kCGImageAlphaPremultipliedLast;
#endif
    if (scale <= 0.1) {
        scale = 0.1;
    }else if(scale >= 1){
        scale = 1;
    }

    //第一步 先把图片缩小 加快计算速度. 但越小结果误差可能越大
        CGSize thumbSize=CGSizeMake([image size].width * scale, [image size].height * scale);
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGContextRef context = CGBitmapContextCreate(NULL,
                                                 thumbSize.width,
                                                 thumbSize.height,
                                                 8,//bits per component
                                                 thumbSize.width*4,
                                                 colorSpace,
                                                 bitmapInfo);

    CGRect drawRect = CGRectMake(0, 0, thumbSize.width, thumbSize.height);
    CGContextDrawImage(context, drawRect, image.CGImage);
    CGColorSpaceRelease(colorSpace);

    //第二步 取每个点的像素值
    unsigned char* data = CGBitmapContextGetData (context);

    if (data == NULL){
        CGContextRelease(context);
        return nil;
    }

    NSCountedSet *cls=[NSCountedSet setWithCapacity:thumbSize.width*thumbSize.height];

  for (int x=0; x<thumbSize.height; x++) {
        for (int y=0; y<thumbSize.width; y++) {

            int offset = 4*(x*thumbSize.width + y);
            int red = data[offset];
            int green = data[offset+1];
            int blue = data[offset+2];
            int alpha =  data[offset+3];

            NSArray *clr=@[@(red),@(green),@(blue),@(alpha)];
            [cls addObject:clr];

        }
    }
    CGContextRelease(context);

    //第三步 找到出现次数最多的那个颜色
    NSEnumerator *enumerator = [cls objectEnumerator];
    NSArray *curColor = nil;

    NSArray *MaxColor=nil;
    NSUInteger MaxCount=0;

    while ( (curColor = [enumerator nextObject]) != nil )
    {
        NSUInteger tmpCount = [cls countForObject:curColor];

        if ( tmpCount < MaxCount ) continue;

        MaxCount=tmpCount;
        MaxColor=curColor;

    }
    //返回三原色色值
    NSMutableDictionary *dic = [[NSMutableDictionary alloc] initWithCapacity:0];
    [dic setValue:@([MaxColor[0] intValue]/255.0f) forKey:@"red"];
    [dic setValue:@([MaxColor[1] intValue]/255.0f) forKey:@"green"];
    [dic setValue:@([MaxColor[2] intValue]/255.0f) forKey:@"blue"];
    return dic;
}

其实获取图片区域的主要颜色就是这么简单,线面附上获取单点的颜色:

/**
 *  获取图片上一个点的颜色
 *
 *  @param point 点击的点的位置
 *  @param image image
 *
 *  @return 返回点击点的颜色
 */
+ (UIColor *)colorAtPixel:(CGPoint)point UIImage:(UIImage *)image CGRect:(CGRect)rect{
    // Cancel if point is outside image coordinates
    if (!CGRectContainsPoint(CGRectMake(0.0f, 0.0f,rect.size.width, rect.size.height), point)) {
        return nil;
    }

    NSInteger pointX = trunc(point.x);
    NSInteger pointY = trunc(point.y);
    CGImageRef cgImage = image.CGImage;
    NSUInteger width = image.size.width;
    NSUInteger height = image.size.height;
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    int bytesPerPixel = 4;
    int bytesPerRow = bytesPerPixel * 1;
    NSUInteger bitsPerComponent = 8;
    unsigned char pixelData[4] = { 0, 0, 0, 0 };
    CGContextRef context = CGBitmapContextCreate(pixelData,
                                                 1,
                                                 1,
                                                 bitsPerComponent,
                                                 bytesPerRow,
                                                 colorSpace,
                                                 kCGImageAlphaPremultipliedLast | kCGBitmapByteOrder32Big);
    CGColorSpaceRelease(colorSpace);
    CGContextSetBlendMode(context, kCGBlendModeCopy);

    // Draw the pixel we are interested in onto the bitmap context
    CGContextTranslateCTM(context, -pointX, pointY-(CGFloat)height);
    CGContextDrawImage(context, CGRectMake(0.0f, 0.0f, (CGFloat)width, (CGFloat)height), cgImage);
    CGContextRelease(context);

    // Convert color values [0..255] to floats [0.0..1.0]
    CGFloat red   = (CGFloat)pixelData[0] / 255.0f;
    CGFloat green = (CGFloat)pixelData[1] / 255.0f;
    CGFloat blue  = (CGFloat)pixelData[2] / 255.0f;
    CGFloat alpha = (CGFloat)pixelData[3] / 255.0f;
    return [UIColor colorWithRed:red green:green blue:blue alpha:alpha];
}

最终就实现如上图的想过,页面丑了点,但是效果是实现了,又不真确的地方,请留言。

项目源码

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

时间: 2021-06-14

iOS实现文字转化成彩色文字图片

本文写了个将文字转化为多彩图片的功能,输入文字将文字转化为彩色的文字图片,可选择不同的字体,渐变,先看看效果. 实现主要用CAGradientLayer渐变,先看看上部展示实现代码: -(void)setupContentView { UIView *contentView = [[UIView alloc] initWithFrame:CGRectMake(0, 44, ScreenWidth, ScreenHight - 44 -300)]; [self.view addSubview:co

改变iOS应用中UITableView的背景颜色与背景图片的方法

改变UITableView的header.footer背景颜色 改变UITableView的header.footer背景颜色,这是个很常见的问题.之前知道的一般做法是,通过实现tableView: viewForHeaderInSection:返回一个自定义的View,里面什么都不填,只设背景颜色.但是今天发现一个更简洁的做法: 对于iOS 6及以后的系统,实现这个新的delegate函数即可: 复制代码 代码如下: - (void)tableView:(UITableView *)table

iOS去除图片背景颜色的方法

实际项目场景:去除图片的纯白色背景图,获得一张透明底图片用于拼图功能 介绍两种途径的三种处理方式(不知道为啥想起了孔乙己),具体性能鶸并未对比,如果有大佬能告知,不胜感激. Core Image Core Graphics/Quarz 2D Core Image Core Image是一个很强大的框架.它可以让你简单地应用各种滤镜来处理图像,比如修改鲜艳程度,色泽,或者曝光. 它利用GPU(或者CPU)来非常快速.甚至实时地处理图像数据和视频的帧.并且隐藏了底层图形处理的所有细节,通过提供的AP

python通过pil为png图片填充上背景颜色的方法

本文实例讲述了python通过pil为png图片填充上背景颜色的方法.分享给大家供大家参考.具体分析如下: png图片有些是没有背景颜色,如果希望以单色(比如白色)填充背景,可以使用下面的代码,这段代码将当前目录下的 jb51.net.png图片填充了白色背景. 使用指定的颜色的背景色即可,然后把该图片用alpha通道填充到该单色背景上.  比如下面使用白色背景: im = Image.open('jb51.net.png') x,y = im.size try: # 使用白色来填充背景 fro

Android编程实现设置按钮背景透明与半透明及图片背景透明的方法

本文实例讲述了Android编程实现设置按钮背景透明与半透明及图片背景透明的方法.分享给大家供大家参考,具体如下: Button或者ImageButton的背景设为透明或者半透明: 半透明 复制代码 代码如下: <Button android:background="#e0000000" ... /> 透明 复制代码 代码如下: <Button android:background="#00000000" ... /> 颜色和不透明度 (al

JS实现在页面随时自定义背景颜色的方法

本文实例讲述了JS实现在页面随时自定义背景颜色的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <HTML> <HEAD> <TITLE>JS实现在页面随时自定义背景颜色</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- Begin //以下代码将输入框及其所在的层写进窗口. document.writeln('<div align="cente

JS实现点击颜色块切换指定区域背景颜色的方法

本文实例讲述了JS实现点击颜色块切换指定区域背景颜色的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <head> <title>JS实现点击颜色块切换指定区域的背景颜色</title> </head> <body> <div align="center"> <table bgcolor=#F8F8F8 border="0" width=&q

JS修改iframe页面背景颜色的方法

本文实例讲述了JS修改iframe页面背景颜色的方法.分享给大家供大家参考.具体如下: 下面的代码演示了如何在网页里通过JS代码修改嵌入的iframe的网页背景颜色 <!DOCTYPE html> <html> <head> <script> function changeStyle() { var x=document.getElementById("myframe"); var y=(x.contentWindow || x.cont

JavaScript动态修改背景颜色的方法

本文实例讲述了JavaScript动态修改背景颜色的方法.分享给大家供大家参考.具体如下: <html> <head> <title>Background Color Changer</title> <script language = JavaScript> <!-- function BG_yellow() { document.bgColor = 0xFFFF00 } function BG_thistle() { document.

js随机生成网页背景颜色的方法

本文实例讲述了js随机生成网页背景颜色的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <HTML> <HEAD> <TITLE>随机生成网页背景颜色的JS特效</TITLE> <STYLE> .30pt{font-size:30pt;color:#de3076} </STYLE> <SCRIPT LANGUAGE="JavaScript"> <!-- color=new A

php读取flash文件高宽帧数背景颜色的方法

本文实例讲述了php读取flash文件高宽帧数背景颜色的方法.分享给大家供大家参考. 具体实现方法如下: 复制代码 代码如下: <?php /* 示例:   $file = '/data/ad_files/5/5.swf';   $flash = new flash();   $flash = $flash->getswfinfo($file);   echo " 文件的宽高是:".$flash["width"].":".$info[

php检测图片主要颜色的方法

本文实例讲述了php检测图片主要颜色的方法.分享给大家供大家参考.具体实现方法如下: $i = imagecreatefromjpeg("image.jpg"); for ($x=0;$x<imagesx($i);$x++) { for ($y=0;$y<imagesy($i);$y++) { $rgb = imagecolorat($i,$x,$y); $r = ($rgb >> 16) & 0xFF; $g = ($rgb >> &