2009-12-14 27 views
6

Çekirdek Grafikleriyle pek programlama yapmadım. Ve ben QuartzCore ile sopa eğilimindedir şimdi katman özelliği ile ihtiyaç duyduğum çok şey var :)Degrade renk içeren yuvarlanmış rect

Ancak, şu anda degrade olan bir UIView var. Ben gradyan çizerken bu yapmaz bu UIView ve katman özelliği yuvarlatılmış köşeler eklemek istiyorum: Ben drawRect yönteminde yuvarlama olması gereken yerde

- (void)drawRect:(CGRect)rect { 
    CGContextRef currentContext = UIGraphicsGetCurrentContext(); 

    CGGradientRef glossGradient; 
    CGColorSpaceRef rgbColorspace; 
    size_t num_locations = 2; 
    CGFloat locations[2] = { 0.0, 1.0 }; 
    CGFloat components[8] = { 1.0, 1.0, 1.0, 0.95, // Start color 
          1.0, 1.0, 1.0, 0.60 }; // End color 

    rgbColorspace = CGColorSpaceCreateDeviceRGB(); 
    glossGradient = CGGradientCreateWithColorComponents(rgbColorspace, components, locations, num_locations); 

    CGRect currentBounds = self.bounds; 
    CGPoint topCenter = CGPointMake(CGRectGetMidX(currentBounds), 0.0f); 
    CGPoint midCenter = CGPointMake(CGRectGetMidX(currentBounds), CGRectGetMaxY(currentBounds)); 
    CGContextDrawLinearGradient(currentContext, glossGradient, topCenter, midCenter, 0); 

    CGGradientRelease(glossGradient); 
    CGColorSpaceRelease(rgbColorspace); 
} 

gerçekten emin değilim. Teşekkürler.

+0

ithal etmek emin olun. Bu sizin için çalışıyorsa lütfen bana bildirin. – nash

cevap

7

Önceki soru gönderilerini kontrol ettiniz mi? UIViews'i maskeleme konusunda bir süre önce okudum. Aynı İşte ne yaptım


drawRect

How to mask a square image into an image with round corners in the iPhone SDK?

kullanan tüm nesneler üzerinde hemen hemen uygular düşünüyorum ve bunu bildiğim kadarıyla söyleyebilirim çalışıyor.

İlk olarak, yukarıda belirtilen postadan Mr NilObject kod snippet'ini ödünç aldım. Ben UIView Kendi özel görünüm oluşturmak için alt sınıf

(o C fonksiyonunun yerine bir yöntem olarak yazdım gibi)

Ben bir nesneye sığacak şekilde modifiye. InitWithRect'e aşırı yük veriyorum: arka planımı saydamlaştırmak için.

Yani temelde

:

  • set şeffaf arka plan (init) veya kırpma sonra, drawRect, ilk klipte uggly
  • olmak kesilen alanın
içine çekecek

Aşağıdaki örnek bir çalışma örneğidir:

// 
// TeleView.m 
// 

#import "TeleView.h" 


@implementation TeleView 
/**** in init methods, set background to transparent, 
     otherwise, clipping shows a black background ****/ 

- (id) initWithFrame:(CGRect)frame { 
    if((self = [super initWithFrame:frame])) { 
     [self setBackgroundColor:[UIColor colorWithWhite:0.0f alpha:0.0f]]; 
    } 
    return self; 
} 
- (void) clipCornersToOvalWidth:(float)ovalWidth height:(float)ovalHeight 
{ 
    float fw, fh; 
    CGContextRef context = UIGraphicsGetCurrentContext(); 
    CGRect rect = CGRectMake(0.0f, 0.0f, self.frame.size.width, self.frame.size.height); 

    if (ovalWidth == 0 || ovalHeight == 0) { 
     CGContextAddRect(context, rect); 
     return; 
    } 
    CGContextSaveGState(context); 
    CGContextTranslateCTM (context, CGRectGetMinX(rect), CGRectGetMinY(rect)); 
    CGContextScaleCTM (context, ovalWidth, ovalHeight); 
    fw = CGRectGetWidth (rect)/ovalWidth; 
    fh = CGRectGetHeight (rect)/ovalHeight; 
    CGContextMoveToPoint(context, fw, fh/2); 
    CGContextAddArcToPoint(context, fw, fh, fw/2, fh, 1); 
    CGContextAddArcToPoint(context, 0, fh, 0, fh/2, 1); 
    CGContextAddArcToPoint(context, 0, 0, fw/2, 0, 1); 
    CGContextAddArcToPoint(context, fw, 0, fw, fh/2, 1); 
    CGContextClosePath(context); 
    CGContextRestoreGState(context); 
} 

-(void)drawRect:(CGRect)rect { 
    CGContextRef currentContext = UIGraphicsGetCurrentContext(); 
    /**** here is what I modified. ****/ 
    [self clipCornersToOvalWidth:20.0f height:20.0f]; 
    CGContextClip(currentContext); 

    /**** below this is your own code ****/ 
    CGGradientRef glossGradient; 
    CGColorSpaceRef rgbColorspace; 
    size_t num_locations = 2; 
    CGFloat locations[2] = { 0.0, 1.0 }; 
    CGFloat components[8] = { 1.0, 0.0, 0.0, 0.60, // Start color 
    0.0, 1.0, 0.0, 0.40 }; // End color 

    rgbColorspace = CGColorSpaceCreateDeviceRGB(); 
    glossGradient = CGGradientCreateWithColorComponents(rgbColorspace, components, locations, num_locations); 

    CGRect currentBounds = self.bounds; 
    CGPoint topCenter = CGPointMake(CGRectGetMidX(currentBounds), 0.0f); 
    CGPoint midCenter = CGPointMake(CGRectGetMidX(currentBounds), CGRectGetMaxY(currentBounds)); 
    CGContextDrawLinearGradient(currentContext, glossGradient, topCenter, midCenter, 0); 

    CGGradientRelease(glossGradient); 
    CGColorSpaceRelease(rgbColorspace); 

} 

@end 
+0

Evet, bunu daha önce gördüm. Ben sadece kendi kodumla birleştiremiyorum :( – runmad

+0

Ne zaman denediğinizde ne olur? Ne görüyorsunuz? Herhangi bir hata? Nasıl bütünleştirmeye çalıştınız?? – nash

+0

Ya da .. Eğer köşeleri yuvarlarsam Degrade kodunu kullanın ve tersi.Gerçekten yanlış birleştirme yaptığımdan eminim, fakat CG gerçekten çok fazla deneyime sahip olduğum bir şey değil. – runmad

7
NSArray *colors = [NSArray arrayWithObjects:fromColor.CGColor,toColor.CGColor, nil]; 

NSNumber *stopOne = [NSNumber numberWithFloat:0.0]; 
NSNumber *stopTwo = [NSNumber numberWithFloat:1.0]; 

NSArray *locations = [NSArray arrayWithObjects:stopOne, stopTwo, nil]; 

CAGradientLayer *headerLayer = [CAGradientLayer layer]; 
headerLayer.colors = colors; 
headerLayer.locations = locations; 

headerLayer.borderColor = borderColor.CGColor; // border line color**strong text** 
headerLayer.borderWidth = width;// For Thickness of border line 
headerLayer.cornerRadius = radius;//For Rounded Corner if You want to make rounded Corner 

headerLayer.frame = frame; 

[view.layer insertSublayer:headerLayer atIndex:0]; 

Ayrıca "QuartzCore" çerçevesinin bir çalışma örneği ile aşağıda benim cevap güncelledik