带Progress的Image

作者: Stark_Dylan | 来源:发表于2015-08-16 11:16 被阅读323次

    闲来无事, 来写这个玩玩, 首先看一下效果。


    效果图

    通过下边滑杆的变化, 可以使上边的图片慢慢的从左往右, 用有色的图覆盖掉灰色的图。

    1. 这是图片的扩展

    UIImage+ProgressImage.h

    
    #import <UIKit/UIKit.h>
    
    typedef NS_OPTIONS(NSUInteger, DLProgressImageDirection) {
        
        DLProgressImageDirectionRightToLeft = 1UL << 0,
        DLProgressImageDirectionLeftToRight = 1UL << 1,
        DLProgressImageDirectionTopToBottom = 1UL << 2,
        DLProgressImageDirectionBottomToTop = 1UL << 3
    };
    
    @interface UIImage (ProgressImage)
    
    /*!
     *  创建进度样式的图片
     *
     *  @param progress  进度 0 - 1
     *  @param isShow    是否显示灰色的原图, 然后慢慢覆盖彩色图
     *  @param direction 进度绘制方向
     *
     *  @return 返回新的图片
     */
    - (UIImage *)createImageForCurrentProgress: (CGFloat)progress
                                    showGrayBG: (BOOL)isShow
                                     direction: (DLProgressImageDirection)direction;
    
    @end
    

    UIImage+ProgressImage.m

    - (UIImage *)createImageForCurrentProgress: (CGFloat)progress
                                    showGrayBG: (BOOL)isShow
                                     direction: (DLProgressImageDirection)direction {
        
        const int ALPHA = 0;
        const int RED = 1;
        const int GREEN = 2;
        const int BLUE = 3;
        
        CGRect imageRect = CGRectMake(0, 0, self.size.width * self.scale, self.size.height * self.scale);
        
        int width = imageRect.size.width;
        int height = imageRect.size.height;
        
        uint32_t *pixels = (uint32_t *) malloc(width * height * sizeof(uint32_t));
        
        memset(pixels, 0, width * height * sizeof(uint32_t));
        
        CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
        
        CGContextRef context = CGBitmapContextCreate(pixels, width, height, 8, width * sizeof(uint32_t), colorSpace, kCGBitmapByteOrder32Little | kCGImageAlphaPremultipliedLast);
        
        CGContextDrawImage(context, CGRectMake(0, 0, width, height), self.CGImage);
        
        // 计算一下progress, 根据方向产生转变约束区间
        int xFrom = 0;
        int xTo = width;
        int yFrom = 0;
        int yTo = height;
        
        switch (direction) {
            case DLProgressImageDirectionBottomToTop:
                    yTo = height * (1 - progress);
                break;
                
            case DLProgressImageDirectionLeftToRight:
                    xFrom = width * progress;
                break;
                
            case DLProgressImageDirectionRightToLeft:
                    xTo = width * (1 - progress);
                break;
                
            case DLProgressImageDirectionTopToBottom:
                    yFrom = height * progress;
                break;
                
            default:
                    xFrom = width * progress;
                break;
        }
        
        for (int x = xFrom; x < xTo; x++) {
            for (int y = yFrom; y < yTo; y++) {
                // 获得像素值
                uint8_t *rgbaPixel = (uint8_t *) &pixels[y * width + x];
                // 转变
                if (isShow) {
                    // luma 编码转为灰色数值
                    uint32_t gray = 0.3 * rgbaPixel[RED] + 0.59 * rgbaPixel[GREEN] + 0.11 * rgbaPixel[BLUE];
                    // 灰色
                    rgbaPixel[RED] = gray;
                    rgbaPixel[GREEN] = gray;
                    rgbaPixel[BLUE] = gray;
                } else {
                    // 无色阶
                    rgbaPixel[RED] = 0;
                    rgbaPixel[GREEN] = 0;
                    rgbaPixel[BLUE] = 0;
                    rgbaPixel[ALPHA] = 0;
                }
            }
        }
        
        // 通过最新的context创建imageRef, 为了生成新的Image
        CGImageRef image = CGBitmapContextCreateImage(context);
        
        CGContextRelease(context);
        CGColorSpaceRelease(colorSpace);
        free(pixels);
        
        UIImage *resultUIImage = [UIImage imageWithCGImage:image scale:self.scale orientation:UIImageOrientationUp];
        
        CGImageRelease(image);
        
        return resultUIImage;
    }
    
    • 具体使用

    import "UIImage+ProgressImage.h"

    使用方法

    @CopyRight Dylan 2015.8.16

    相关文章

      网友评论

      • 叶舞清风:没有达到预期效果,图片直接不见
        Stark_Dylan:@叶舞清风 你可以把代码发到我邮箱里 13301051937@163.com 我看一下。
        叶舞清风:@WildDylan 嗯,直接不见了
        Stark_Dylan:@叶舞清风 图片 不见啦?
      • 叶舞清风:不错的功能,就是不明白他的用途
        Stark_Dylan:@叶舞清风 做进度条啊 哈哈

      本文标题:带Progress的Image

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