IOS Layer的"自动布局"

原创Blog,转载请注明出处
http://blog.csdn.net/hello_hwc?viewmode=list


前言:今天在stackoverflow上给一个外国友人回答问题的时候,遇到了Layer的自动布局的问题。这里写出来,分享给需要的人。


Layer支持autolayout吗?

ios 的CALayer到目前为止不支持AutoLayout也不支持autoresizingMask。


举个例子

如果,要绘制一个渐变的颜色,作为背景色。定义一个配置函数

-(void)setupCAGradientLayer:(CAGradientLayer *)gradient{
    UIColor *colorOne = [UIColor colorWithRed:(120/255.0) green:(135/255.0) blue:(150/255.0) alpha:1.0];
    UIColor *colorTwo = [UIColor colorWithRed:(57/255.0)  green:(79/255.0)  blue:(96/255.0)  alpha:1.0];
    NSArray *colors = [NSArray arrayWithObjects:(id)colorOne.CGColor, colorTwo.CGColor, nil];
    NSNumber *stopOne = [NSNumber numberWithFloat:0.0];
    NSNumber *stopTwo = [NSNumber numberWithFloat:1.0];
    NSArray *locations = [NSArray arrayWithObjects:stopOne, stopTwo, nil];
    gradient.colors = colors;
    gradient.locations = locations;
}

不使用图片作为背景的话,一种直接的方式就是使用Layer进行绘制
很简单的绘制

#import "ViewController.h"
@interface ViewController ()
@property (strong,nonatomic) CAGradientLayer * gradient;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.gradient = [CAGradientLayer layer];
    [self setupCAGradientLayer:self.gradient];
    self.gradient.frame = self.view.frame;
    [self.view.layer addSublayer:self.gradient];
}

效果图
技术分享

但是,横屏后就发现不对了
技术分享


粗糙的解决方案

最直观的解决方案就是,在进行view的bounds改变的时候,进行layer的大小调整。
代码很简单,由于在view的bounds改变的时候,在对应的controller会调用viewDidLayoutSubviews
所以,在上面的viewController中加入如下代码,

-(void)viewDidLayoutSubviews{
    [super viewDidLayoutSubviews];
    self.gradient.frame = self.view.bounds;
}

则横屏正常
技术分享
但是,我们都知道,在横竖屏切换的时候,IOS会自动生成一个动画,如果用粗糙的解决方案,只是在动画结束后改变了frame,动画的过程中仍然能够看淡空白
如图
技术分享


较好的解决方案

由于IOS对view的支持较好,不管是使用auto layout,还是autoresizingmask,都很方便。所以,一种比较好的解决方案就是使用view来处理。

把layer绑定到view
定义一个view,把他的layer的class设置为CAGradientClass

#import <UIKit/UIKit.h>

@interface BackgrundView : UIView

@end
#import "BackgrundView.h"
@interface BackgrundView()

@end
@implementation BackgrundView

+(Class)layerClass{
    return [CAGradientLayer class];
}

@end

然后,使用这个view,设置autoresizingmask

#import "ViewController.h"
#import "BackgrundView.h"
@interface ViewController ()
@property BackgrundView * backgroundview;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.backgroundview = [[BackgrundView alloc] initWithFrame:self.view.frame];
    self.backgroundview.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
    [self.view addSubview:self.backgroundview];
    [self setupCAGradientLayer:(CAGradientLayer*)self.backgroundview.layer];   
}
@end

再看看切换的动画(生成的gif有点水印,谅解)
技术分享


欢迎关注我的IOS-SDK详解专栏
http://blog.csdn.net/column/details/huangwenchen-ios-sdk.html
我自己写的一个下拉刷新库
https://github.com/wenchenhuang/WCPullRefreshControl


郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。