• iphone ios layer 教程应用


    CALayer(层)是屏幕上的一个矩形区域,在每一个UIView中都包含一个根CALayer,在UIView上的所有视觉效果都是在这个Layer上进行的。

    CALayer外形特征主要包括:

    1、层的大小尺寸

    2、背景色

    3、内容(可以填充图片或者使用Core Graphics绘制的内容)

    4、矩形是否使用圆角

    5、矩形是否有阴影

    Layer有很多种,最常用也是最基本的是CALayer,当然还包括其他的子类:

    CAScrollerLayer 简化显示层的一部分

    CATextLayer 文本层

    CAGradientLayer、CAShapeLayer等等

    使用层之前,需要在项目中引入QuartzCore.framework框架

    实例:

    新建XCode项目LayerSample,导入QuartzCore.famework

    屏幕快照 2011-03-29 上午11.46.45

    在LayerSampleViewController.h文件中引入:

    1. #import <QuartzCore/QuartzCore.h>
    2. LayerSampleViewController.m文件,代码:
    3. //
    4. // LayerSampleViewController.m
    5. // LayerSample
    6. //
    7. // Created by jordy on 11-3-28.
    8. // Copyright 2011 vsp. All rights reserved.
    9. //
    10. #import "LayerSampleViewController.h"
    11. @implementation LayerSampleViewController
    12. // Implement loadView to create a view hierarchy programmatically, without using a nib.
    13. - (void)loadView {
    14. UIView *rootView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 1024, 768)];
    15. rootView.backgroundColor = [UIColor whiteColor];
    16. self.view = rootView;
    17. [rootView release];
    18. //加载layer
    19. backLayer = [CALayer layer];
    20. backLayer.backgroundColor = [UIColor orangeColor].CGColor;
    21. backLayer.bounds = CGRectMake(10, 10, 1004, 728); //设置layer的区域
    22. backLayer.position = CGPointMake(1024/2, 768/2-10); //设置layer坐标
    23. [self.view.layer addSublayer:backLayer];
    24. }
    25. // Override to allow orientations other than the default portrait orientation.
    26. - (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {
    27. return interfaceOrientation == UIInterfaceOrientationLandscapeLeft;
    28. }
    29. - (void)didReceiveMemoryWarning {
    30. // Releases the view if it doesn't have a superview.
    31. [super didReceiveMemoryWarning];
    32. // Release any cached data, images, etc that aren't in use.
    33. }
    34. - (void)viewDidUnload {
    35. // Release any retained subviews of the main view.
    36. // e.g. self.myOutlet = nil;
    37. }
    38. - (void)dealloc {
    39. [super dealloc];
    40. }
    41. @end
    1. #import <QuartzCore/QuartzCore.h>  
    2. LayerSampleViewController.m文件,代码:  
    3. //  
    4. //  LayerSampleViewController.m  
    5. //  LayerSample  
    6. //  
    7. //  Created by jordy on 11-3-28.  
    8. //  Copyright 2011 vsp. All rights reserved.  
    9. //  
    10.   
    11. #import "LayerSampleViewController.h"  
    12.   
    13. @implementation LayerSampleViewController  
    14.   
    15. // Implement loadView to create a view hierarchy programmatically, without using a nib.  
    16. - (void)loadView {  
    17.     UIView *rootView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 1024, 768)];  
    18.     rootView.backgroundColor = [UIColor whiteColor];  
    19.     self.view = rootView;  
    20.     [rootView release];  
    21.   
    22.     //加载layer  
    23.   
    24.     backLayer = [CALayer layer];  
    25.     backLayer.backgroundColor = [UIColor orangeColor].CGColor;  
    26.     backLayer.bounds = CGRectMake(10, 10, 1004, 728); //设置layer的区域  
    27.     backLayer.position = CGPointMake(1024/2, 768/2-10); //设置layer坐标  
    28.     [self.view.layer addSublayer:backLayer];  
    29.   
    30. }  
    31.   
    32. // Override to allow orientations other than the default portrait orientation.  
    33. - (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {  
    34.     return interfaceOrientation == UIInterfaceOrientationLandscapeLeft;  
    35. }  
    36.   
    37. - (void)didReceiveMemoryWarning {  
    38.     // Releases the view if it doesn't have a superview.  
    39.     [super didReceiveMemoryWarning];  
    40.   
    41.     // Release any cached data, images, etc that aren't in use.  
    42. }  
    43.   
    44. - (void)viewDidUnload {  
    45.     // Release any retained subviews of the main view.  
    46.     // e.g. self.myOutlet = nil;  
    47. }  
    48.   
    49. - (void)dealloc {  
    50.     [super dealloc];  
    51. }  
    52.   
    53. @end  

    运行程序:

    屏幕快照 2011-03-29 上午09.57.08

    为了区分背景UIView,我将UIView的背景色设置为白色,backLayer的背景色设置为橘黄色。

    上图是一个矩形区域,如果设置矩形的四个角是椭圆角,可以添加属性:

    backLayer.cornerRadius = 20.0; //矩形椭圆角的弧度半径

    运行程序后,效果如图:

    屏幕快照 2011-03-29 上午09.57.40

    添加带阴影的子Layer(层),代码:

    1. //添加子layer
    2. CALayer *cyanLayer = [CALayer layer];
    3. cyanLayer.backgroundColor = [UIColor cyanColor].CGColor;
    4. cyanLayer.bounds = CGRectMake(0, 0, 300, 300);
    5. cyanLayer.position = CGPointMake(180, 180);
    6. cyanLayer.shadowOffset = CGSizeMake(0, 3); //设置阴影的偏移量
    7. cyanLayer.shadowRadius = 10.0; //设置阴影的半径
    8. cyanLayer.shadowColor = [UIColor blackColor].CGColor; //设置阴影的颜色为黑色
    9. cyanLayer.shadowOpacity = 0.9; //设置阴影的不透明度
    10. [backLayer addSublayer:cyanLayer];
    1.  //添加子layer  
    2. CALayer *cyanLayer = [CALayer layer];  
    3. cyanLayer.backgroundColor = [UIColor cyanColor].CGColor;  
    4. cyanLayer.bounds = CGRectMake(0, 0, 300, 300);  
    5. cyanLayer.position = CGPointMake(180, 180);  
    6. cyanLayer.shadowOffset = CGSizeMake(0, 3); //设置阴影的偏移量  
    7. cyanLayer.shadowRadius = 10.0;  //设置阴影的半径  
    8. cyanLayer.shadowColor = [UIColor blackColor].CGColor; //设置阴影的颜色为黑色  
    9. cyanLayer.shadowOpacity = 0.9; //设置阴影的不透明度  
    10.   
    11. [backLayer addSublayer:cyanLayer];  

    运行效果图:

    屏幕快照 2011-03-29 下午12.12.38

    给子Layer添加图片

    1. //添加子image layer
    2. UIImage *image = [UIImage imageNamed:@"feiche.jpg"];
    3. CALayer *imageLayer = [CALayer layer];
    4. imageLayer.frame = CGRectMake(100, 100, image.size.width, image.size.height);
    5. imageLayer.contents = (id) image.CGImage;
    6. imageLayer.shadowOffset = CGSizeMake(0, 3); //设置阴影的偏移量
    7. imageLayer.shadowRadius = 10.0; //设置阴影的半径
    8. imageLayer.shadowColor = [UIColor blackColor].CGColor; //设置阴影的颜色为黑色
    9. imageLayer.shadowOpacity = 0.9; //设置阴影的不透明度
    10. [backLayer addSublayer:imageLayer];
    [html] view plaincopy
     
    1. //添加子image layer  
    2. UIImage *image = [UIImage imageNamed:@"feiche.jpg"];  
    3. CALayer *imageLayer = [CALayer layer];  
    4. imageLayer.frame = CGRectMake(100, 100, image.size.width, image.size.height);  
    5. imageLayer.contents = (id) image.CGImage;  
    6. imageLayer.shadowOffset = CGSizeMake(0, 3); //设置阴影的偏移量  
    7. imageLayer.shadowRadius = 10.0;  //设置阴影的半径  
    8. imageLayer.shadowColor = [UIColor blackColor].CGColor; //设置阴影的颜色为黑色  
    9. imageLayer.shadowOpacity = 0.9; //设置阴影的不透明度  
    10.   
    11. [backLayer addSublayer:imageLayer];  



    运行效果,

    屏幕快照 2011-03-29 下午12.23.27

    图片加边框,代码:

    1. imageLayer.borderColor = [UIColor grayColor].CGColor; //边框颜色
    2. imageLayer.borderWidth = 2.0; //边框宽度
    1. imageLayer.borderColor = [UIColor grayColor].CGColor;  //边框颜色  
    2. imageLayer.borderWidth = 2.0;  //边框宽度  

    运行效果:

    屏幕快照 2011-03-29 下午01.37.46

    设置图片为椭圆角,代码:

    1. imageLayer.cornerRadius = 10.0; //设置layer圆角半径
    2. imageLayer.masksToBounds = YES; //隐藏边界
    1. imageLayer.cornerRadius = 10.0;  //设置layer圆角半径  
    2. imageLayer.masksToBounds = YES;  //隐藏边界  

    运行效果:

    屏幕快照 2011-03-29 下午01.45.04

    但是由于设置masksToBounds 属性为true所以Layer的阴影效果也就没有了。

    之前我都是将图片另外在做有阴影效果的图片,这样显的比较真实,如果阴影部分只是填充边框即可,可以采用两个Layer来实现阴影效果,代码:

    1. UIImage *image = [UIImage imageNamed:@"feiche.jpg"];
    2. //阴影layer
    3. CALayer *shadowLayer = [CALayer layer];
    4. shadowLayer.frame = CGRectMake(100, 100, image.size.width, image.size.height);
    5. shadowLayer.backgroundColor = [UIColor blueColor].CGColor;
    6. shadowLayer.shadowOffset = CGSizeMake(0, 3);
    7. shadowLayer.cornerRadius = 10.0;
    8. shadowLayer.shadowRadius = 10.0;
    9. shadowLayer.shadowColor = [UIColor blackColor].CGColor; //设置阴影的颜色为黑色
    10. shadowLayer.shadowOpacity = 1.0; //设置阴影的不透明度
    11. [backLayer addSublayer:shadowLayer];
    12. //添加子image layer
    13. CALayer *imageLayer = [CALayer layer];
    14. imageLayer.frame = CGRectMake(100, 100, image.size.width, image.size.height);
    15. imageLayer.contents = (id) image.CGImage;
    16. imageLayer.cornerRadius = 10.0; //设置layer圆角半径
    17. imageLayer.masksToBounds = YES; //隐藏边界
    18. imageLayer.borderColor = [UIColor grayColor].CGColor; //边框颜色
    19. imageLayer.borderWidth = 2.0;
    20. [backLayer addSublayer:imageLayer];
    1. UIImage *image = [UIImage imageNamed:@"feiche.jpg"];  
    2. //阴影layer  
    3. CALayer *shadowLayer = [CALayer layer];  
    4. shadowLayer.frame = CGRectMake(100, 100, image.size.width, image.size.height);  
    5. shadowLayer.backgroundColor = [UIColor blueColor].CGColor;  
    6. shadowLayer.shadowOffset = CGSizeMake(0, 3);  
    7. shadowLayer.cornerRadius = 10.0;  
    8. shadowLayer.shadowRadius = 10.0;  
    9. shadowLayer.shadowColor = [UIColor blackColor].CGColor; //设置阴影的颜色为黑色  
    10. shadowLayer.shadowOpacity = 1.0; //设置阴影的不透明度  
    11. [backLayer addSublayer:shadowLayer];      
    12.   
    13. //添加子image layer  
    14. CALayer *imageLayer = [CALayer layer];  
    15. imageLayer.frame = CGRectMake(100, 100, image.size.width, image.size.height);  
    16. imageLayer.contents = (id) image.CGImage;  
    17. imageLayer.cornerRadius = 10.0;  //设置layer圆角半径  
    18. imageLayer.masksToBounds = YES;  //隐藏边界  
    19. imageLayer.borderColor = [UIColor grayColor].CGColor;  //边框颜色  
    20. imageLayer.borderWidth = 2.0;  
    21. [backLayer addSublayer:imageLayer];  

    运行后效果:

    屏幕快照 2011-03-29 下午02.22.11

    ------转自http://blog.csdn.net/linzhiji/article/details/6748207

  • 相关阅读:
    c#+linux+mono+Redis集群(解决无法连接Redis的问题)
    实验楼----奇妙的音乐
    实验楼----PHP大法
    实验楼----PHP代码审计(sha1、md5)
    实验楼----变异凯撒
    storm安装
    storm问题汇总
    windows下linux子系统安装
    mongoDB学习记录
    excel vba 不可查看
  • 原文地址:https://www.cnblogs.com/gaoxiao228/p/2889848.html
Copyright © 2020-2023  润新知