IOS圖像處理（5）填充模式

時間 2019-11-16

原文原文鏈接

以前咱們設置過填充色，可是純色的填充色略顯單調，咱們能夠使用更加絢麗的填充模式，漸變填充以及模式填充數組

漸變填充函數

漸變有兩種：線性漸變以及圓形漸變spa

線性漸變code

- (void)drawRect:(CGRect)rect
{
    //獲取圖像上下文對象
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    //使用RGB模式的顏色空間（在Quartz 2D中凡是使用帶有Create或者Copy關鍵字方法建立的對象，在使用後必定要使用對應的方法釋放）
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    //顏色空間，若是使用了RGB顏色空間則4個數字一組表示一個顏色，下面的數組表示3個顏色
    CGFloat colors[] = {1,1,0,1,0,1,1,1,1,0,1,0};
    //locations表明3個顏色的分佈區域（0~1），若是須要均勻分佈只須要傳入NULL
    CGFloat locations[3]={0,0.3,1};
    
    CGGradientRef gradient = CGGradientCreateWithColorComponents(colorSpace, colors, locations, 3);
    
    //須要釋放顏色空間
    CGColorSpaceRelease(colorSpace);
    
    //第三個參數表示起始點，第四個參數表示結束點
    //最後一個參數若是設置kCGGradientDrawsAfterEndLocation表示結束點後面的區域使用漸變填充，設置kCGGradientDrawsBeforeStartLocation表示起始點前面的區域使用漸變填充，設置爲0表示只填充起始點和結束點之間的區域
    CGContextDrawLinearGradient(context, gradient, CGPointMake(0, 100), CGPointMake(0, 150), 0);

CGGradientRelease(gradient);component

圓形漸變orm

- (void)drawRect:(CGRect)rect
{
    //獲取圖像上下文對象
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    //使用RGB模式的顏色空間
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    //顏色空間，若是使用了RGB顏色空間則4個數字一組表示一個顏色，下面的數組表示3個顏色
    CGFloat colors[] = {1,1,0,1,0,1,1,1,1,0,1,0};
    //locations表明3個顏色的分佈區域（0~1），若是須要均勻分佈只須要傳入NULL
    CGFloat locations[3]={0,0.3,1};
    
    CGGradientRef gradient = CGGradientCreateWithColorComponents(colorSpace, colors, locations, 3);
    
    //須要釋放顏色空間
    CGColorSpaceRelease(colorSpace);
    
    //第三個參數表示起始中心點，第四個參數表示起始半徑
    //第五個參數表示結束中心點，第六個參數表示結束半徑
    //最後一個參數若是設置kCGGradientDrawsAfterEndLocation表示結束點後面的區域使用漸變填充，設置kCGGradientDrawsBeforeStartLocation表示起始點前面的區域使用漸變填充，設置爲0表示只填充起始點和結束點之間的區域
    CGContextDrawRadialGradient(context, gradient, CGPointMake(160, 300), 50, CGPointMake(160, 300), 100, 0);
}

使用漸變色填充對象

- (void)drawRect:(CGRect)rect
{
    //獲取圖像上下文對象
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    UIRectClip(CGRectMake(20, 20, 250, 250));
    
    
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGFloat colors[] = {1,1,0,1,0,1,1,1,1,0,1,0};
    CGGradientRef gradient = CGGradientCreateWithColorComponents(colorSpace, colors, NULL, 3);
    CGColorSpaceRelease(colorSpace);
    

    CGContextDrawLinearGradient(context, gradient, CGPointMake(0, 0), CGPointMake(300, 300), kCGGradientDrawsAfterEndLocation);
}

模式填充 blog

模式填充有兩種：有顏色填充以及無顏色填充ip

有顏色填充的主要步驟以下回調函數

1：建立一個符合CGPatternDrawPatternCallback(void *,CGContextRef)簽名的方法函數生產用來填充的瓷磚

2：使用CGPatternCreate建立CGPatterRef

3：使用CGColorSpaceCreatePattern建立顏色空間CGColorSpaceRef，這個顏色空間跟前面繪製漸變的顏色空間不太同樣，前面建立漸變使用的顏色空間是設備無關的，咱們須要基於這個顏色空間建立一個顏色空間專門用於填充（注意對於有顏色填充建立填充顏色空間參數爲NULL，不用基於設備無關的顏色空間建立）

4：使用CGPatternRef和CGColorSpaceRef，經過CGColorCreateWitPattern建立填充顏色CGColorRef

5：將填充色設置爲以前得到的CGColorRef而後進行繪製

void drawTile(void *info,CGContextRef context) {
    CGContextSetFillColorWithColor(context, [UIColor redColor].CGColor);
    CGContextFillRect(context, CGRectMake(0, 0, 30, 30));
    CGContextSetFillColorWithColor(context, [UIColor grayColor].CGColor);
    CGContextFillRect(context, CGRectMake(0, 30, 30, 30));
    CGContextSetFillColorWithColor(context, [UIColor blueColor].CGColor);
    CGContextFillRect(context, CGRectMake(30, 0, 30, 30));
    CGContextSetFillColorWithColor(context, [UIColor purpleColor].CGColor);
    CGContextFillRect(context, CGRectMake(30, 30, 30, 30));
}

- (void)drawRect:(CGRect)rect
{
    //獲取圖像上下文對象
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    
    //填充模式回調函數結構體
    CGPatternCallbacks callback = {0,drawTile,NULL};
    //設置磚塊樣式
    //void *infoCGRect  瓷磚繪製函數的第一個參數
    //bounds    每塊瓷磚的大小
    //CGAffineTransform matrix     變換矩陣，若是不用變換能夠傳入CGAffineTransformIdentity
    //CGFloat xStep, CGFloat yStep  指定瓷磚塊橫向和縱向的間距，若是大於瓷磚大小，瓷磚間會有間隙
    // CGPatternTiling tiling  平鋪模式
    //bool isColored    是否指定了顏色
    //const CGPatternCallbacks *callbacks   回調函數結構體
    CGPatternRef pattern = CGPatternCreate(NULL, CGRectMake(0, 0, 60, 60), CGAffineTransformMakeRotation(-45 * M_PI/180), 60, 60, kCGPatternTilingNoDistortion, true, &callback);
    
    
    //設置顏色空間
    //設備無關的顏色空間 CGColorSpaceCreateDeviceRGB();
    //模式填充顏色空間,注意對於有顏色填充模式，這裏傳NULL
    CGColorSpaceRef colorSpace = CGColorSpaceCreatePattern(NULL);
    
    //經過前兩項設置顏色
    CGFloat alpha = 1;
    CGColorRef color = CGColorCreateWithPattern(colorSpace, pattern, &alpha);
    CGColorSpaceRelease(colorSpace);
    CGPatternRelease(pattern);
    
    //繪製
    CGContextSetFillColorWithColor(context, color);
    CGContextFillRect(context, CGRectMake(0, 20, 155, 155));
    
    CGContextSetStrokeColorWithColor(context, color);
    CGContextStrokeRectWithWidth(context, CGRectMake(165,20, 155, 155), 5);
    
}

也能夠不建立CGColorRef，直接使用CGPatternRef和CGColorSpaceRef來進行有顏色填充

void drawTile(void *info,CGContextRef context) {
    CGContextSetFillColorWithColor(context, [UIColor redColor].CGColor);
    CGContextFillRect(context, CGRectMake(0, 0, 30, 30));
    CGContextSetFillColorWithColor(context, [UIColor grayColor].CGColor);
    CGContextFillRect(context, CGRectMake(0, 30, 30, 30));
    CGContextSetFillColorWithColor(context, [UIColor blueColor].CGColor);
    CGContextFillRect(context, CGRectMake(30, 0, 30, 30));
    CGContextSetFillColorWithColor(context, [UIColor purpleColor].CGColor);
    CGContextFillRect(context, CGRectMake(30, 30, 30, 30));
}

- (void)drawRect:(CGRect)rect
{
    //獲取圖像上下文對象
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    
    //填充模式回調函數結構體
    CGPatternCallbacks callback = {0,drawTile,NULL};
    //設置磚塊樣式
    //void *infoCGRect  瓷磚繪製函數的第一個參數
    //bounds    每塊瓷磚的大小
    //CGAffineTransform matrix     變換矩陣，若是不用變換能夠傳入CGAffineTransformIdentity
    //CGFloat xStep, CGFloat yStep  指定瓷磚塊橫向和縱向的間距，若是大於瓷磚大小，瓷磚間會有間隙
    // CGPatternTiling tiling  平鋪模式
    //bool isColored    是否指定了顏色
    //const CGPatternCallbacks *callbacks   回調函數結構體
    CGPatternRef pattern = CGPatternCreate(NULL, CGRectMake(0, 0, 60, 60), CGAffineTransformMakeRotation(-45 * M_PI/180), 60, 60, kCGPatternTilingNoDistortion, true, &callback);
    
    
    //設置顏色空間
    //設備無關的顏色空間 CGColorSpaceCreateDeviceRGB();
    //模式填充顏色空間,注意對於有顏色填充模式，這裏傳NULL
    CGColorSpaceRef colorSpace = CGColorSpaceCreatePattern(NULL);
    CGContextSetFillColorSpace(context, colorSpace);
    CGContextSetStrokeColorSpace(context, colorSpace);
    
    
    float alpha = 1;
    ////最後一個參數對於有顏色瓷磚指定爲透明度的參數地址，對於無顏色瓷磚則指定當前顏色空間對應的顏色數組
    CGContextSetFillPattern(context, pattern, &alpha);
    CGContextSetStrokePattern(context, pattern, &alpha);
    
    //繪製
    CGContextFillRect(context, CGRectMake(0, 20, 155, 155));
    CGContextStrokeRectWithWidth(context, CGRectMake(165,20, 155, 155), 5);
    
}

結果和前一個例子同樣

以上兩個例子都是有顏色填充，在建立瓷磚的同時已經肯定了瓷磚的樣色，咱們也能夠建立瓷磚時只設定瓷磚的形狀而不設置瓷磚的顏色，當使用瓷磚填充時再設定顏色

void drawTile(void *info,CGContextRef context) {
    CGContextFillRect(context, CGRectMake(0, 0, 30, 30));
    CGContextFillRect(context, CGRectMake(30, 30, 30, 30));
}

- (void)drawRect:(CGRect)rect
{
    //獲取圖像上下文對象
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    
    //填充模式回調函數結構體
    CGPatternCallbacks callback = {0,drawTile,NULL};
    //設置磚塊樣式
    //void *infoCGRect  瓷磚繪製函數的第一個參數
    //bounds    每塊瓷磚的大小
    //CGAffineTransform matrix     變換矩陣，若是不用變換能夠傳入CGAffineTransformIdentity
    //CGFloat xStep, CGFloat yStep  指定瓷磚塊橫向和縱向的間距，若是大於瓷磚大小，瓷磚間會有間隙
    // CGPatternTiling tiling  平鋪模式
    //bool isColored    是否指定了顏色
    //const CGPatternCallbacks *callbacks   回調函數結構體
    CGPatternRef pattern = CGPatternCreate(NULL, CGRectMake(0, 0, 60, 60), CGAffineTransformIdentity, 60, 60, kCGPatternTilingNoDistortion, false, &callback);
    
    
    //設備無關的顏色空間
    CGColorSpaceRef baseColorSpace = CGColorSpaceCreateDeviceRGB();
    //模式填充顏色空間
    CGColorSpaceRef colorSpace = CGColorSpaceCreatePattern(baseColorSpace);
    CGContextSetFillColorSpace(context, colorSpace);
    CGContextSetStrokeColorSpace(context, colorSpace);
    
    
    CGFloat components[]={250/255.0,100/255.0,150/255.0,1.0};
    ////最後一個參數對於無顏色填充模式指定爲當前顏色空間顏色數據
    CGContextSetFillPattern(context, pattern, components);
    CGContextSetStrokePattern(context, pattern, components);
    
    //繪製
    CGContextFillRect(context, CGRectMake(0, 20, 155, 155));
    CGContextStrokeRectWithWidth(context, CGRectMake(165,20, 155, 155), 5);
    
    
}