Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to resize a CAGradientLayer after rotation?

I'm adding a CAGradientLayer to a view. When the view is auto-resized (such as after a rotation) the gradient layer is not resized. Can the gradient be set to auto-resize the same as the view? Note also that I am using auto-layout constraints in the view.

Here's what I'm doing:

    CAGradientLayer *gradientLayer = [CAGradientLayer layer];
    gradientLayer.frame = CGRectMake(0.0, 0.0, frame.size.width, frame.size.height);
    gradientLayer.colors = [NSArray arrayWithObjects:
                       (id)[[UIColor colorWithRed:255.0/255.0f green:255.0/255.0f blue:255.0/255.0f alpha:1.0f] CGColor],
                       (id)[[UIColor colorWithRed:233.0/255.0f green:233.0/255.0f blue:233.0/255.0f alpha:1.0f] CGColor], nil];

    [self.layer insertSublayer:gradientLayer atIndex:0];
like image 888
memmons Avatar asked Mar 22 '13 23:03

memmons


2 Answers

Here are two different ways to fix your problem.

  1. Make gradientLayer an instance variable instead of a local variable. Then, override layoutSubviews in your view class to set the frame of the gradient layer:

    - (void)layoutSubviews {
        [super layoutSubviews];
        _gradientLayer.frame = self.bounds;
    }
    
  2. Create a subclass of UIView named GradientView, and override its +layerClass method to return [CAGradientLayer class]. Use this view to draw your gradient instead of using a layer directly. Then set the gradient view's autoresizingMask (or add constraints to it if you are using auto layout). See this answer for an example.

Creating the GradientView class will also make the resizing behave correctly during rotation, so I recommend that solution.

like image 189
rob mayoff Avatar answered Oct 19 '22 09:10

rob mayoff


I resize the layer's bounds manually by overriding the setFrame: method of the view:

-(void)setFrame:(CGRect)frame
{
    [super setFrame:frame];
    _gradientLayer.bounds = CGRectMake(0, 0, CGRectGetWidth(frame), CGRectGetHeight(frame));
}
like image 23
Felix Avatar answered Oct 19 '22 08:10

Felix