2011-01-29 2 views
3

Я пытаюсь создать граф с эффектом градиента/затенения. Теперь я могу нарисовать линейный график и применить эффект градиента к этому графу. Он применяется ко всему виду не к графику. Теперь я получаю изображение как enter image description here. Но я хочу, как enter image description here. Я хочу эффект градиента только под графиком.Градиентный эффект для линейного графика в iPhone

Пожалуйста, помогите мне в этом. Заранее спасибо.

код, который я использую:

UIGraphicsBeginImageContext(self.graphView.frame.size); 
[graphView.image drawInRect:CGRectMake(0, 0, self.graphView.frame.size.width, self.graphView.frame.size.height)]; 
CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound); 
CGContextSetLineJoin(UIGraphicsGetCurrentContext(), kCGLineJoinRound); 
CGContextSetLineWidth(UIGraphicsGetCurrentContext(), 2.0); 
CGContextSetRGBFillColor(UIGraphicsGetCurrentContext(), 225, 48, 48, 1.0); 
CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), 225, 225, 0.0, 1.0); 
CGContextBeginPath(UIGraphicsGetCurrentContext()); 

float xCordinate, yCordinate; 

for (int i = 0; i < [graphValues count]; i++) { 
    int val = [[graphValues objectAtIndex: i] intValue]/5; 
    float diff = [[graphValues objectAtIndex: i] floatValue]/5 - val; 
    yCordinate = val * 120 + 120 * diff; 
    xCordinate = graphWidth * i/[graphValues count] + 60; 
    if (i == 0) 
     CGContextMoveToPoint(UIGraphicsGetCurrentContext(), xCordinate, graphHeight + 60 - yCordinate); 
    else 
     CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), xCordinate, graphHeight + 60 - yCordinate); 
} 
CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), xCordinate, graphHeight + 60); 
CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), 60, graphHeight + 60); 
CGContextClosePath(UIGraphicsGetCurrentContext()); 
CGContextSaveGState(UIGraphicsGetCurrentContext()); 
CGContextDrawPath(UIGraphicsGetCurrentContext(), kCGPathStroke); 

// CGContextFillPath (UIGraphicsGetCurrentContext());

CGContextClip(UIGraphicsGetCurrentContext()); 


//Draw Gradient 
UIColor *topColor = [UIColor colorWithRed: 1.0 green:1.0 blue:1.0 alpha:1.0]; 
UIColor *bottomColor = [UIColor colorWithRed:1.0 green:1.0 blue:1.0 alpha:0.0]; 
CGColorRef colorRef[] = { [topColor CGColor], [bottomColor CGColor] }; 
CFArrayRef colors = CFArrayCreate(NULL, (const void**)colorRef, sizeof(colorRef)/sizeof(CGColorRef), &kCFTypeArrayCallBacks); 

CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB(); 
CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, colors, NULL); 
CFRelease(colorSpace); 
CFRelease(colors); 

// Draw a linear gradient from top to bottom 
CGPoint gradStartPoint = CGPointMake(50.0, graphView.bounds.size.height); 
CGPoint gradEndPoint = CGPointMake(50.0, 0.0); 
CGContextDrawLinearGradient(UIGraphicsGetCurrentContext(), gradient, gradStartPoint, gradEndPoint, 0); 

CFRelease(gradient); 

// Cleanup 
CGColorSpaceRelease(colorSpace); 

CGContextRestoreGState(UIGraphicsGetCurrentContext()); 

graphView.image = UIGraphicsGetImageFromCurrentImageContext(); 
UIGraphicsEndImageContext(); 
+0

Если вы хотите, чтобы полный красный (или белый) цвет находился в самой верхней точке графика, а не в верхней части представления, вам нужно указать координату y наивысшей точки на графике как верхнюю градиента. –

ответ

4

Хитрость заключается в том, чтобы установить обтравочный контур, прежде чем рисовать градиент. Подробнее см. В документах CGContextRef.

+0

Спасибо, но я использую обтравочный контур. CGContextClip (UIGraphicsGetCurrentContext()); Но текущий контекст определяется обратным представлением изображения. UIGraphicsBeginImageContext (self.graphView.frame.size); \t [graphView.image drawInRect: CGRectMake (0, 0, self.graphView.frame.size.width, self.graphView.frame.size.height)]; – MohanVydehi

+1

@MohanVydehi: Вы говорите, что настраиваете обтравочный контур в другом контексте от того, на который вы рисуете изображение? Если это так, вот почему. В противном случае это сильно прояснит ситуацию, если вы отредактируете свой вопрос, чтобы включить полный код любого метода вашего представления, выполняющего обрезку и рисование. –

+0

Спасибо за ваше предложение. Я понял проблему. Я прикрепил свой код, внеся некоторые изменения и помогу мне закончить приложение. – MohanVydehi

Смежные вопросы