How to set multiple gradient colour in UITableViewCell using CAGradientLayer in iOS?

问题:

I want to set multiple gradient colour and each row would have unique gradient colour as shown image below:

I want to achieve is first image & what I was able to achieve is second

Code I wrote for what I was able to achieve is

  BackgroundLayer.h 

+(CAGradientLayer*) CustomHorBlack;

   BackgroundLayer.m 

+ (CAGradientLayer*) CustomHorBlack {     UIColor *colorOne = [UIColor colorWithRed:(0.0) green:(0.0 ) blue:(0.0) alpha:0.1];     UIColor *colorTwo = [UIColor colorWithRed:(0.0) green:(0.0 ) blue:(0.0) alpha:0.2];     UIColor *colorThree = [UIColor colorWithRed:(0.0) green:(0.0 ) blue:(0.0)  alpha:0.3];     UIColor *colorFour = [UIColor colorWithRed:(0.0) green:(0.0 ) blue:(0.0) alpha:0.4];     UIColor *colorFive = [UIColor colorWithRed:(0.0) green:(0.0 ) blue:(0.0) alpha:0.5];     UIColor *colorSix = [UIColor colorWithRed:(0.0) green:(0.0 ) blue:(0.0)  alpha:0.6];      NSArray *colors = [NSArray arrayWithObjects:(id)colorOne.CGColor, colorTwo.CGColor,colorThree.CGColor,colorFour.CGColor, colorFive.CGColor,colorSix.CGColor, nil];      CAGradientLayer *headerLayer = [CAGradientLayer layer];     headerLayer.colors = colors;     [headerLayer setStartPoint:CGPointMake(0.0, 0.5)];     [headerLayer setEndPoint:CGPointMake(1.0, 0.5)];        return headerLayer;  } 

TableCell.m

-(void)awakeFromNib{     [[[self contentView] superview] setClipsToBounds:YES];     CAGradientLayer *bgLayer = [BackgroundLayer CustomHorBlack];  //   bgLayer.frame = self.contentView.bounds;     bgLayer.frame = CGRectMake(-7, 0, [Util window_width], 72);      if ([Util isiPhone6]) {         bgLayer.frame = CGRectMake(-7, 0, [Util window_width], 84);     }     else if ([Util isiPhone6PlusDevice]){         bgLayer.frame = CGRectMake(-7, 0, [Util window_width], 93);     }      [self.CatImageView.layer insertSublayer:bgLayer atIndex:0]; } 

Code I wrote for what I want to achieve is but doesn't find what I want is

-(void)awakeFromNib{      if (!checkVariable) {         variable=0;         checkVariable=TRUE;     }      [[[self contentView] superview] setClipsToBounds:YES];     CAGradientLayer *bgLayer;     //= [BackgroundLayer CustomHorBlack];      for(variable = 0; variable < 10; variable++) {          switch(variable)         {             case 0:                 bgLayer = [BackgroundLayer CategoryHealthButy];                 //variable = variable + 1;                   break;             case 1:                bgLayer = [BackgroundLayer CategoryClothing];                // variable = variable + 1;                  break;             case 2:                bgLayer = [BackgroundLayer CategoryComputer];                // variable = variable + 1;                  break;              case 3:                 bgLayer = [BackgroundLayer Categoryeducation];                 //variable = variable + 1;                   break;              case 4:                 bgLayer = [BackgroundLayer CategoryElectronics];                // variable = variable + 1;                   break;             case 5:                 bgLayer = [BackgroundLayer CategoryEntertainment];                 variable = variable + 1;                  break;             case 6:                 bgLayer = [BackgroundLayer CategoryGroceries];               //  variable = variable + 1;                  break;              case 7:                 bgLayer = [BackgroundLayer CategoryHealthButy];               //  variable = variable + 1;                   break;              case 8:                 bgLayer = [BackgroundLayer CategoryHome];              //   variable = variable + 1;                  break;             case 9:                 bgLayer = [BackgroundLayer CategoryResturant];                // variable = variable + 1;                  break;              case 10:                 bgLayer = [BackgroundLayer CategoryToys];                // variable = 0;                   break;              default:                 bgLayer = [BackgroundLayer CategoryToys];                // variable = variable + 1;                   break;         }     //   bgLayer.frame = self.contentView.bounds;     bgLayer.frame = CGRectMake(-7, 0, [Util window_width], 72);      if ([Util isiPhone6]) {         bgLayer.frame = CGRectMake(-7, 0, [Util window_width], 84);     }     else if ([Util isiPhone6PlusDevice]){         bgLayer.frame = CGRectMake(-7, 0, [Util window_width], 93);     }      [self.CatImageView.layer insertSublayer:bgLayer atIndex:variable];          variable = variable + 1;       }   } 

回答1:

This I can achieve with below code

TableViewCell.h

@interface TableViewCell : UITableViewCell {     UIImageView *imageView;     UIView *viewGradient;     CAGradientLayer *gradientLayer; }  - (void)setImage:(UIImage *)image andColor:(UIColor *)color;  @end 

TableViewCell.m

- (void)awakeFromNib {     [self.contentView setFrame:CGRectMake(0, 0, 320, 44)];         imageView = [[UIImageView alloc] initWithFrame:self.contentView.bounds];     [imageView setAutoresizingMask:UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth ];             [self.contentView addSubview:imageView];              viewGradient = [[UIView alloc] initWithFrame:self.contentView.bounds];         [viewGradient setAutoresizingMask:UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth ];             [self.contentView addSubview:viewGradient];             gradientLayer = [CAGradientLayer layer];             gradientLayer.frame = viewGradient.bounds;             [gradientLayer setStartPoint:CGPointMake(0.0, 0.5)];             [gradientLayer setEndPoint:CGPointMake(1.0, 0.5)];             [viewGradient.layer insertSublayer:gradientLayer atIndex:0]; }  - (void)setImage:(UIImage *)image andColor:(UIColor *)color     {         [imageView setImage:image];         gradientLayer.colors = [NSArray arrayWithObjects:(id)[[UIColor clearColor] CGColor], (id)[color CGColor], nil];     } 

ViewController.m

         - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath     {         TableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];         switch (indexPath.row)         {             case 0:                 [cell setImage:[UIImage imageNamed:@"Grass"] andColor:[UIColor whiteColor]];                 break;             case 1:                 [cell setImage:[UIImage imageNamed:@"House"] andColor:[UIColor greenColor]];                 break;             case 2:                 [cell setImage:[UIImage imageNamed:@"Sky"] andColor:[UIColor redColor]];                 break;              default:                 break;         }         return cell;     } 

Refer to screenshot

文章来源: How to set multiple gradient colour in UITableViewCell using CAGradientLayer in iOS?