將CAGradientLayer添加到UICollectionViewCell中的UIImageView具有奇怪的行爲

Question

我必須將CAGradientLayer添加到某些自定義UICollectionViewCells的背景圖像。我正在使用自定義流佈局來顯示像這樣的單元格。

RACollectionViewTripleLayout

我有複用性當我在collectionView和梯度層做滾動添加到圖像改變它們的大小的問題。正如你在這張圖片中看到的那樣，漸變會改變它的大小。

我也有一些細胞的問題，這些細胞添加梯度層兩次。所以我想添加的陰影效果太暗了。

我正在使用此代碼。

- (void)prepareForReuse { 
    [super prepareForReuse]; 
    [self.gradientLayer removeFromSuperlayer]; 
    self.gradientLayer = nil; 
    self.articleImageView.image = nil; 
} 

- (void)layoutSubviews { 
    [super layoutSubviews]; 
    [self setupGradient]; 
} 


#pragma mark - Setup 
- (void)setupGradient { 
    UIColor *threeQuartersBlack = [UIColor colorWithRed:0 green:0 blue:0 alpha:0.6]; 
    UIColor *halfBlack = [UIColor colorWithRed:0 green:0 blue:0 alpha:0.5]; 
    UIColor *oneQuarterBlack = [UIColor colorWithRed:0 green:0 blue:0 alpha:0.3]; 

    CAGradientLayer *gradient = [CAGradientLayer layer]; 
    CGFloat gradientHeight =self.bounds.size.height/3.0; 
    CGRect gradientBounds = CGRectMake(0, self.bounds.size.height-gradientHeight, self.bounds.size.width, gradientHeight); 

    gradient.frame = gradientBounds; 
    gradient.anchorPoint = CGPointMake(0.5, 0.5); 

    gradient.colors = [NSArray arrayWithObjects:(id)[[UIColor clearColor] CGColor],(id)oneQuarterBlack.CGColor ,(id)halfBlack.CGColor , (id)threeQueartesBlack.CGColor, (id)[[UIColor blackColor] CGColor], nil]; 

    self.gradientLayer = gradient; 
    [self.articleImageView.layer insertSublayer:self.gradientLayer atIndex:0]; 
} 

我注意到如果我彈出該ViewController並再次顯示它，一切都是正確的。

任何人都知道我應該怎麼做才能解決這個問題？

謝謝

Answer 1

一個潛在的解決方案：從您的UICollectionViewCell刪除梯度，而是把它添加到您顯示的UIImage，創建一個新的UIImage包括梯度。下面是向UIImage添加漸變的代碼。

UIImage *thumbnail = yourImage; 
UIGraphicsBeginImageContextWithOptions(thumbnail.size, NO, 0.0); 
[thumbnail drawInRect:CGRectMake(0.f, 0.f, thumbnail.size.width, thumbnail.size.height)]; 

// Add Gradient to lower half of thumbnail 
CGContextRef context = UIGraphicsGetCurrentContext(); 
CGFloat colors[4] = {0.f, 0.f, 0.f, 0.55}; 
CGFloat locations[2] = {0.f, 1.f}; 
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceGray(); 
CGGradientRef gradient = CGGradientCreateWithColorComponents(colorSpace, colors, locations, 2); 
CGColorSpaceRelease(colorSpace); 
CGPoint startPoint = CGPointMake(thumbnail.size.width/2.f, thumbnail.size.height - 40.f); 
CGPoint endPoint = CGPointMake(thumbnail.size.width/2.f, thumbnail.size.height); 
CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0); 

UIImage *newThumbnail = UIGraphicsGetImageFromCurrentImageContext(); 
    UIGraphicsEndImageContext(); 

*注意：此代碼將縮略圖應用於照片的底部40點。你可能想要申請25％的照片底部。如果您在不同大小的集合視圖單元格中使用該照片，則漸變當然會與照片一起縮放。如果您需要不同的漸變高度比例：照片高度，您將不得不創建多個圖像。最好的解決方案可能是創建視圖在後臺線程上加載所需的所有不同大小的照片，並根據需要連接到集合視圖單元 - 這將確保每次收集視圖單元重新使用時都不會發生圖像處理。