如何使用Core Graphics實現淡化效果？

我要讓喜歡你所看到的第一個單元格右側這裏什麼效果：如何使用Core Graphics實現淡化效果？

enter image description here

我猜這是某種帶有漸變疊加的看法，但我可以」弄清楚它是如何配置透明度的。我嘗試使用漸變創建自己的疊加視圖，並設置顏色的alpha值，但它僅顯示爲灰白色漸變。

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

    UIColor *gradBegin = [UIColor colorWithWhite:1.0 alpha:0.8]; 
    UIColor *gradEnd = [UIColor colorWithWhite:1.0 alpha:0.6]; 
    NSArray* gradientColors = [NSArray arrayWithObjects: 
           (id)gradBegin.CGColor, 
           (id)gradEnd.CGColor, nil]; 
    CGFloat gradientLocations[] = {0, 1}; 

    CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef)gradientColors, gradientLocations); 

    CGContextDrawLinearGradient(context, gradient, CGPointMake(rect.origin.x, rect.origin.y + rect.size.height/2.0), 
           CGPointMake(rect.origin.x + rect.size.width, rect.origin.y + rect.size.height/2.0), 0);

這個截圖究竟發生了什麼，我該如何複製它？

來源

2012-05-15 Snowman

是不是隻是一個UIImageView的漸變從clearColor到灰色在單元格的內容視圖頂部？ – Zoleas

把一個uiimageview放在另一個視圖的頂部，用一個從白色到白色漸變的png。 –

我可以在沒有UIImageView的情況下做到這一點，只需使用帶CoreGraphics的UIView？ – Snowman

我寫了一個簡單的UIView類，將繪製自己褪色。它與drawRect中一個基本的UIView overrided：

- (void)drawRect:(CGRect)rect 
{ 
    CGColorSpaceRef colourSpace = CGColorSpaceCreateDeviceRGB(); 
    CGContextRef context = UIGraphicsGetCurrentContext(); 

    UIColor* gradBegin = [UIColor colorWithWhite:1 alpha:0]; 
    UIColor* gradEnd = [UIColor colorWithWhite:1 alpha:1]; 
    NSArray* gradColours = [NSArray arrayWithObjects: 
            (id)gradBegin.CGColor, 
            (id)gradBegin.CGColor, 
            (id)gradEnd.CGColor, 
            (id)gradEnd.CGColor, nil]; 
    CGFloat gradLocs[] = { 0, 0.5, 0.9, 1 }; 
    CGGradientRef gradient = CGGradientCreateWithColors(colourSpace, (__bridge CFArrayRef)gradColours, gradLocs); 
    CGContextDrawLinearGradient(context, gradient, CGPointMake(0, 0), CGPointMake(self.frame.size.width, 0), 0); 
    CGGradientRelease(gradient); 
    CGColorSpaceRelease(colourSpace); 
}

如果疊加在你的觀點和看法的背景是白色的這個工作。

來源

2012-05-15 18:21:39 Cthutu

儘管Core Graphics可以做到這一點，但是爲您的項目添加一個具有適當寬度和1像素高度的透明PNG非常容易，然後將UIImageView放置在您的表格單元格上以創建此效果。

來源

2012-05-15 15:59:10 Alex

我討厭PNG的:(那麼多不同的分辨率，我必須呈現爲...如果我想進行更改，我必須回去並調整所有圖像的大小..將在CG中更加方便 – Snowman

等待爲什麼1像素高度？ – Snowman

它最小化了文件的大小，並且可以拉伸到任何高度。使用縮放填充內容模式。 – Alex

您的問題中的漸變繪圖代碼看起來不錯，雖然我沒有測試過它。我建議設置gradBegin.alpha = 0和gradEnd.alpha = 1。另外，最後一行可以簡化：

CGContextDrawLinearGradient(context, gradient, rect.origin, 
    CGPointMake(CGRectGetMaxX(rect), rect.origin.y, 0);

並且不要忘記CGGradientRelease(gradient)。

無論如何，除此之外，您需要設置overlayView.opaque = NO。

來源

2012-05-15 17:05:13

我通常不得不釋放大多數CG的東西，即使我使用ARC？ – Snowman

是的，除非你橋接到一個可可對象。 – Cthutu

如何使用Core Graphics實現淡化效果？

回答

相關問題