UIView border with fade or blur effect

前端 未结 5 1617
悲哀的现实
悲哀的现实 2020-12-13 03:17

I\'m looking for method to add gradually fading or maybe blured border (I don\'t exactly know how to name this effect) to arbitrary UIView. I don\'t need animated effect, I

5条回答
  •  执笔经年
    2020-12-13 03:37

    I'll say this first, iKiR's answer was more than enough for me. I copied the code as it is, and with little experience from my side, I was able to make it work effortlessly (on a UITableView).

    1. Create a new UIView subclass, I'll call it MaskingView
    2. import QuartzCore framework!
    3. Paste the code below in the init. (initWithCoder: and/or initWithFrame: as appropriate)
    4. Add the view that you want to apply the opacity feathering on within the MaskingView. (In Interface Builder, user Editor -> Embed In -> View. Then, choose the class of the new superview as MaskingView)
    5. Give all credit to iKiR, cause I srsly have no idea how the code works, but it simply does work!

    NOTES:

    • I am developing a universal app, and the code below works as it is on both devices! (iPhone/iPad)
    • When using Embed In -> UIView, the new view will be a bit bigger than the subview. You have to make it exactly fit the subview. But, before resizing it, make sure you uncheck autoresize subviews.

    The Code:

    CALayer *viewLayer = [self layer];
    CALayer* maskLayer = [CALayer layer];
    
    maskLayer.bounds = viewLayer.bounds;
    
    [maskLayer setPosition:CGPointMake(CGRectGetWidth(viewLayer.frame)/2.0, CGRectGetHeight(viewLayer.frame)/2.0)];     
    
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGContextRef context = CGBitmapContextCreate (NULL, viewLayer.bounds.size.width, viewLayer.bounds.size.height, 8, 0, colorSpace, kCGImageAlphaPremultipliedLast);     
    
    CGFloat colors[] = {
        0.5, 0.5, 0.5, 0.0, //BLACK
        0.0, 0.0, 0.0, 1.0, //BLACK
    };     
    
    CGGradientRef gradient = CGGradientCreateWithColorComponents(colorSpace, colors, NULL, sizeof(colors)/(sizeof(colors[0])*4));     
    CGColorSpaceRelease(colorSpace);     
    
    NSUInteger gradientH = 20;
    NSUInteger gradientHPos = 0;
    
    CGContextSetFillColorWithColor(context, [UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:1.0].CGColor);
    CGContextFillRect(context, CGRectMake(0, gradientHPos + gradientH, CGRectGetWidth(maskLayer.frame), CGRectGetHeight(maskLayer.frame)));     
    
    CGContextSetFillColorWithColor(context, [UIColor colorWithRed:0.5 green:0.5 blue:0.5 alpha:0.0].CGColor);
    CGContextFillRect(context, CGRectMake(0, 0, 320, gradientHPos));
    
    CGContextDrawLinearGradient(context, gradient, CGPointMake(160, gradientHPos), CGPointMake(160, gradientHPos + gradientH), 0);     
    CGGradientRelease(gradient);     
    
    CGImageRef contextImage = CGBitmapContextCreateImage(context);
    CGContextRelease(context);     
    
    [maskLayer setContents:(__bridge id)contextImage];
    
    CGImageRelease (contextImage);
    
    viewLayer.masksToBounds = YES;
    viewLayer.mask = maskLayer;
    

提交回复
热议问题