UIBezierPath и градиент iOS

Question

У меня есть путь со значениями, и я хочу сделать этот градиент.

Вот код:

CGContextRef context = UIGraphicsGetCurrentContext(); 

    CGContextSetStrokeColorWithColor(context, [[UIColor colorWithRed:245.0/255.0 green:245.0/255.0 blue:171.0/255.0 alpha:0.6] CGColor]); 
    CGContextSetFillColorWithColor(context, [[UIColor colorWithRed:245.0/255.0 green:245.0/255.0 blue:171.0/255.0 alpha:0.6] CGColor]); 



    UIBezierPath *aPath = [UIBezierPath bezierPath]; 
    [aPath moveToPoint:CGPointMake(30.0, 100.0)]; 


    [aPath addLineToPoint:CGPointMake(200.0, 120.0)]; 
    [aPath addLineToPoint:CGPointMake(300, 210)]; 
    [aPath addLineToPoint:CGPointMake(300, 420)]; 
    [aPath addLineToPoint:CGPointMake(30, 420.0)]; 
    [aPath addLineToPoint:CGPointMake(30, 100.0)]; 

    [aPath closePath]; 
    [aPath fill]; 

Все указатели, чтобы выяснить проблему с этим кодом?

Answer 1

Во-первых - я создал простую стрелу с Безье путь:

UIBezierPath* bezierPath = [UIBezierPath bezierPath]; 
[bezierPath moveToPoint: CGPointMake(24.5, 1.5)]; 
[bezierPath addLineToPoint: CGPointMake(2.5, 14.5)]; 
[bezierPath addLineToPoint: CGPointMake(24.5, 28.5)]; 
[bezierPath addLineToPoint: CGPointMake(24.5, 1.5)]; 
[bezierPath closePath]; 
[[UIColor blackColor] setStroke]; 
bezierPath.lineWidth = 1; 
[bezierPath stroke]; 

Тогда я нарисовал простой линейный градиент от черного к белому:

CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB(); 
CGContextRef context = UIGraphicsGetCurrentContext(); 

NSArray* simpleLinearGradientColors = [NSArray arrayWithObjects: 
             (id)[UIColor blackColor].CGColor, 
             (id)[UIColor whiteColor].CGColor, nil]; 
CGFloat simpleLinearGradientLocations[] = {0, 1}; 
CGGradientRef simpleLinearGradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef)simpleLinearGradientColors, simpleLinearGradientLocations); 


// Bezier Drawing 
UIBezierPath* bezierPath = [UIBezierPath bezierPath]; 
[bezierPath moveToPoint: CGPointMake(24.5, 1.5)]; 
[bezierPath addLineToPoint: CGPointMake(2.5, 14.5)]; 
[bezierPath addLineToPoint: CGPointMake(24.5, 28.5)]; 
[bezierPath addLineToPoint: CGPointMake(24.5, 1.5)]; 
[bezierPath closePath]; 
CGContextSaveGState(context); 
[bezierPath addClip]; 
CGContextDrawLinearGradient(context, simpleLinearGradient, CGPointMake(2.5, 15), CGPointMake(24.5, 15), 0); 
CGContextRestoreGState(context); 

[[UIColor blackColor] setStroke]; 
bezierPath.lineWidth = 1; 
[bezierPath stroke]; 

CGGradientRelease(simpleLinearGradient); 
CGColorSpaceRelease(colorSpace); 

Вот что Я получил:

В принципе вы можете создать линейный, радиальный градиент с множеством настроек (местоположения, цвета) и, конечно же, вы должны изменить код выше.

Answer 2

1.Create .h и .m файлы для например CustomGradientView

1. CustomGradientView.h файл должен выглядеть следующим образом

   @interface CustomGradientView: UIView

и CustomGradientView. m файл должен выглядеть так: - (void) drawRect: (CGRect) rect {

CGContextRef context = UIGraphicsGetCurrentContext(); 
// color1 and color 2 u can take as u wish here i m taking for explaining 
UIColor *color1=[UIColor whiteColor]; 
CGColorRef startColor =color1.CGColor; 

UIColor *color2=[UIColor redColor]; 
CGColorRef endColor = color2.CGColor; 

drawLinearGradient(context, rect, startColor, endColor); 

//for rounded corners 
CGPathRef p = [[UIBezierPath bezierPathWithRoundedRect:rect 
              5] CGPath]; 
CGContextAddRect(context, rect); 
CGContextAddPath(context, p); 
CGContextEOClip(context); 
CGContextClearRect(context, rect); 

}

затем в .xib файлов, к которым вы хотите просмотреть быть градиент расширить свой класс CustomGradientView вместо UIView

метод drawLinearGradient в другом классе и есть импортировать его они являются

common.h

#import <Foundation/Foundation.h> 
void drawLinearGradient(CGContextRef context, CGRect rect, CGColorRef startColor, CGColorRef endColor); 
CGRect rectFor1PxStroke(CGRect rect); 
void draw1PxStroke(CGContextRef context, CGPoint startPoint, CGPoint endPoint, CGColorRef color); 
void drawGlossAndGradient(CGContextRef context, CGRect rect, CGColorRef startColor, CGColorRef endColor); 
static inline double radians (double degrees) { return degrees * M_PI/180; } 
CGMutablePathRef createArcPathFromBottomOfRect(CGRect rect, CGFloat arcHeight); 
CGMutablePathRef createRoundedRectForRect(CGRect rect, CGFloat radius); 

и Common.m

#import "Common.h" 

CGRect rectFor1PxStroke(CGRect rect) { 
    return CGRectMake(rect.origin.x + 0.5, rect.origin.y + 0.5, rect.size.width - 1, rect.size.height - 1); 
} 

void drawLinearGradient(CGContextRef context, CGRect rect, CGColorRef startColor, CGColorRef endColor) { 
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB(); 
    CGFloat locations[] = { 0.0, 1.0 }; 

    NSArray *colors = [NSArray arrayWithObjects:(__bridge id)startColor, (__bridge id)endColor, nil]; 

    CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef) colors, locations); 

    CGPoint startPoint = CGPointMake(CGRectGetMidX(rect), CGRectGetMinY(rect)); 
    CGPoint endPoint = CGPointMake(CGRectGetMidX(rect), CGRectGetMaxY(rect)); 

    CGContextSaveGState(context); 
    CGContextAddRect(context, rect); 
    CGContextClip(context); 
    CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0); 
    CGContextRestoreGState(context); 

    CGGradientRelease(gradient); 
} 

void draw1PxStroke(CGContextRef context, CGPoint startPoint, CGPoint endPoint, CGColorRef color) { 

    CGContextSaveGState(context); 
    CGContextSetLineCap(context, kCGLineCapSquare); 
    CGContextSetStrokeColorWithColor(context, color); 
    CGContextSetLineWidth(context, 1.0); 
    CGContextMoveToPoint(context, startPoint.x + 0.5, startPoint.y + 0.5); 
    CGContextAddLineToPoint(context, endPoint.x + 0.5, endPoint.y + 0.5); 
    CGContextStrokePath(context); 
    CGContextRestoreGState(context);   

} 

void drawGlossAndGradient(CGContextRef context, CGRect rect, CGColorRef startColor, CGColorRef endColor) { 

    drawLinearGradient(context, rect, startColor, endColor); 

    CGColorRef glossColor1 = [UIColor colorWithRed:1.0 green:1.0 blue:1.0 alpha:0.35].CGColor; 
    CGColorRef glossColor2 = [UIColor colorWithRed:1.0 green:1.0 blue:1.0 alpha:0.1].CGColor; 

    CGRect topHalf = CGRectMake(rect.origin.x, rect.origin.y, rect.size.width, rect.size.height/2); 

    drawLinearGradient(context, topHalf, glossColor1, glossColor2); 

} 

CGMutablePathRef createArcPathFromBottomOfRect(CGRect rect, CGFloat arcHeight) { 

    CGRect arcRect = CGRectMake(rect.origin.x, rect.origin.y + rect.size.height - arcHeight, 
           rect.size.width, arcHeight); 

    CGFloat arcRadius = (arcRect.size.height/2) + (pow(arcRect.size.width, 2)/(8*arcRect.size.height)); 
    CGPoint arcCenter = CGPointMake(arcRect.origin.x + arcRect.size.width/2, arcRect.origin.y + arcRadius); 

    CGFloat angle = acos(arcRect.size.width/(2*arcRadius)); 
    CGFloat startAngle = radians(180) + angle; 
    CGFloat endAngle = radians(360) - angle; 

    CGMutablePathRef path = CGPathCreateMutable(); 
    CGPathAddArc(path, NULL, arcCenter.x, arcCenter.y, arcRadius, startAngle, endAngle, 0); 
    CGPathAddLineToPoint(path, NULL, CGRectGetMaxX(rect), CGRectGetMinY(rect)); 
    CGPathAddLineToPoint(path, NULL, CGRectGetMinX(rect), CGRectGetMinY(rect)); 
    CGPathAddLineToPoint(path, NULL, CGRectGetMinX(rect), CGRectGetMaxY(rect)); 
    return path;  

} 

CGMutablePathRef createRoundedRectForRect(CGRect rect, CGFloat radius) {