iOS Development UI Chapter-calayer (Create Layer)

Source: Internet
Author: User
Tags uikit

iOS Development UI Chapter-calayer (Create Layer)

One, add a layer

Steps to add a layer:

1. Create Layer2. Set the properties of the layer (color is set, bounds can be displayed) 3. Add a layer to the interface (on the layer of the Controller view)
1//2//  YYVIEWCONTROLLER.M 3//  01-Create a simple layer 4//5//  Created by Apple on 14-6-21.6//  Copyright (c) 2 014 Years itcase. All rights reserved. 7//8  9 #import "YYViewController.h" @interface Yyviewcontroller () @end14 @implementation Yyviewcontrol Ler16-(void) viewDidLoad18 {     [super viewdidload];20]     //1. Create a layer22     //    Use object method to create 23    //    Calayer *layer=[[calayer alloc]init];24     //Use the class method to create a *layer=[calayer of     calayer layer];26//2     . Set the properties of the layer (be sure to set the position, the color properties can be displayed)     Layer.backgroundcolor=[uicolor Browncolor]. cgcolor;29     layer.bounds=cgrectmake (0, 0, 32),     Layer.position=cgpointmake (+);     //3. Adding a layer to the interface     [Self.view.layer addsublayer:layer];34}35 @end

  

Second, add a layer to display the picture

code example:

1//2//  YYVIEWCONTROLLER.M 3//  02-Add a layer showing pictures 4//5//  Created by Apple on 14-6-21.6//  Copyright (c) 2014 itcase. All rights reserved. 7//8  9 #import "YYViewController.h" @interface Yyviewcontroller () @end14 @implementation Yyviewcontrol Ler16-(void) viewDidLoad18 {     [super viewdidload];20     //Create a LAYER21     calayer *mylayer=[calayer layer];     //Set the properties of the layer at Mylayer.bounds=cgrectmake (+, +, +     );     mylayer.position=cgpointmake (100, +/     /Set the picture to be displayed     mylayer.contents= (ID) [UIImage imagenamed:@ "Me"]. CGIMAGE;28     //Set the fillet radius to 1029     mylayer.cornerradius=10;30     //If the picture is set, you need to set this property to Yes to show the fillet effect     MYLAYER.MASKSTOBOUNDS=YES;32     //Set Border     mylayer.borderwidth=3;34     Mylayer.bordercolor=[uicolor Browncolor]. cgcolor;35     //Add layer to interface     [Self.view.layer addsublayer:mylayer];38}39 @end

Execution effect:

Description: In line 27th set the picture to be displayed, note that the UIImage cgimage attribute is used here, is a cgimageref type of data

Third, cgcolorref and cgimageref data types

1. Brief description

Calayer is defined in the Quartzcore framework; cgimageref, cgcolorref two data types are defined in the Coregraphics framework; Uicolor, uiimage are defined in the Uikit framework.

Second, the Quartzcore framework and the Coregraphics framework are available across platforms and can be used on both iOS and Mac OS x, but Uikit can only be used in iOS

Therefore, in order to ensure portability, quartzcore can not use UIImage, Uicolor, can only use Cgimageref, Cgcolorref

However, in many cases, the Coregraphics object can be obtained by Uikit the specific method of the object, such as UIImage Cgimage method can return a cgimageref

2. Import the Quartzcore framework

It is no longer necessary for us to import this framework in XCODE5, if we need to import the framework before IOS6 and XCODE4

(1) Click on the project name and click on the right targets below target

(2) After clicking on Build pases, expand link Binary ...., add + sign

(3) Enter "Quartz" in the search box, check quartzcore.framework, and add

(4) Once added, this frame will appear in the project folder

  

Finally, you need to import the framework's main header file in your project code.

#import <QuartzCore/QuartzCore.h>

Iv. selection of UIView and Calayer

You can see that the previous 2 effects can be implemented not only by adding layers, but also by adding uiview. The layer that displays the picture can be implemented with a uiimageview. Since Calayer and UIView all can achieve the same display effect, then who should choose who is good?

In fact, compared with the Calayer,uiview more than one event processing function. In other words, Calayer cannot handle user touch events, while UIView can.

Therefore, in the process of selection, you need to take into account the actual situation, if the displayed things need to interact with the user, with UIView, if you do not need to interact with the user, with UIView or Calayer can

Of course, the performance of Calayer is higher because it is less capable of event handling and more lightweight

V. Additional Information

1. Adding a child layer

1 #import "YYViewController.h" 2  3 @interface Yyviewcontroller () 4  5 @end 6  7 @implementation Yyviewcontroll ER 8  9-(void) VIEWDIDLOAD10 {one     [super viewdidload];12     ]     NSLog (@ "star-%@", self.view.layer.sublayers)     //1. Create a LAYER15//    Use object method to create a    //    Calayer *layer=[[calayer ALLOC]INIT];17     //Use the class method     to create a calayer *layer=[calayer layer];19     //2. Set the properties of the layer (be sure to set the position, Color properties can be displayed)     Layer.backgroundcolor=[uicolor Browncolor]. cgcolor;22     layer.bounds=cgrectmake (0, 0, V, +),     Layer.position=cgpointmake (+ 25);     //3. Adding a layer to the interface     [Self.view.layer addsublayer:layer];27     NSLog (@ "end-%@", self.view.layer.sublayers); 29}

The printing results are as follows:

Note: Before adding a layer, the Controller view layer has two sub-layers, and after adding, there are three sub-layers.

2. Access Layer

1-(void) Viewdidload 2 {3     [Super Viewdidload]; 4      5     calayer *layer=[calayer layer]; 6     Layer.backgroundcolor=[uicolor Browncolor]. Cgcolor; 7     layer.bounds=cgrectmake (0, 0, 9), 8     layer.position=cgpointmake (+);     Self.view.layer addsublayer:layer];11     //calayer Access all sub-layers via the Sublayers property     (@ "NSLog", SELF.VIEW.LAYER.SUBLAYERS[2]);     NSLog (@ "%@", layer);     //calayer can also access the parent layer through the Superlayer property 16     NSLog (@ "%@", Layer.superlayer);     NSLog (@ "%@", Self.view.layer); 18}

UIView can access all sub-views through the Subviews property, similarly, Calayer can access all child layers through the Sublayers property

UIView can access the parent view through the Superview property, similarly, Calayer can also access the parent layer through the Superlayer property

3. Note

In storyboard, drag a button on the interface to print the number of child layers.

1-(void) Viewdidload 2 {3     [Super Viewdidload]; 4      5     calayer *layer=[calayer layer]; 6     Layer.backgroundcolor=[uicolor Browncolor]. Cgcolor; 7     layer.bounds=cgrectmake (0, 0, 9), 8     layer.position=cgpointmake (+);     Self.view.layer addsublayer:layer];11     //Print all Layer12     NSLog (@ "%@", self.view.layer.sublayers); 13}

The printing results are as follows:

Special NOTE: If one control is a child of another control, the layer of the control is also a child layer of the other control.

iOS Development UI Chapter-calayer (Create Layer)

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.