IOS calayer usage

Calayer (layer) is a rectangular area on the screen. Each uiview contains a root calayer. All the visual effects on the uiview are performed on this layer.

Calayer shape features mainly include:

1. layer size and size

2. Background Color

3. content (the image can be filled or the content drawn using core graphics)

4. whether to use rounded corners for the rectangle

5. Whether the rectangle has a shadow

There are many layer types. The most common and basic layer is calayer. Of course, there are other subclasses:

Cascrollerlayer simplifies part of the display Layer

Catextlayer text layer

Cagradientlayer, cashapelayer, etc.

Before using the layer, You need to introduce the quartzcore. Framework framework in the project.

Instance:

Create an xcode project layersample and import quartzcore. famework

Introduce the following in the layersampleviewcontroller. h file:

#import <QuartzCore/QuartzCore.h>

Layersampleviewcontroller. M file, code:

#import "LayerSampleViewController.h"@implementation LayerSampleViewController- (void)loadView {    UIView *rootView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 1024, 768)];

    rootView.backgroundColor = [UIColor whiteColor];

Self. view = rootview; [rootview release]; // load layer backlayer = [calayer layer]; backlayer. backgroundcolor = [uicolor orangecolor]. cgcolor; backlayer. bounds = cgrectmake (10, 10,100 4, 728); // set the region backlayer of the layer. position = cgpointmake (1024/2, 768/2-10); // sets the layer coordinate [self. view. layer addsublayer: backlayer];}-(void) dealloc {[Super dealloc];} @ end

Run the program:

To distinguish the background from the uiview, I set the background color of the uiview to white and the background color of the backlayer to orange.

Is a rectangle area. If you set the four corners of the rectangle to an elliptical angle, you can add attributes:

Backlayer. cornerradius = 20.0; // radian radius of the rectangular elliptical Angle

After running the program

Add a sub-layer (layer) with shadow. Code:

// Add the sub-layer calayer * cyanlayer = [calayer layer]; cyanlayer. backgroundcolor = [uicolor cyancolor]. cgcolor; cyanlayer. bounds = cgrectmake (0, 0,300,300); cyanlayer. position = cgpointmake (180,180); cyanlayer. shadowoffset = cgsizemake (0, 3); // sets the shadow offset cyanlayer. shadowradius = 10.0; // set the shadow radius to cyanlayer. shadowcolor = [uicolor blackcolor]. cgcolor; // set the shadow color to black cyanlayer. shadowopacity = 0.9; // set the shadow opacity [backlayer addsublayer: cyanlayer];

Run:

Add an image to a sub-Layer

// Add a sub-Image Layer

Uiimage * image = [uiimage imagenamed: @ "feiche.jpg"]; calayer * imagelayer = [calayer layer]; imagelayer. frame = cgrectmake (100,100, image. size. width, image. size. height); imagelayer. contents = (ID) image. cgimage; imagelayer. shadowoffset = cgsizemake (0, 3); // sets the shadow offset imagelayer. shadowradius = 10.0; // set the shadow radius to imagelayer. shadowcolor = [uicolor blackcolor]. cgcolor; // set the shadow color to black imagelayer. shadowopacity = 0.9; // set the shadow opacity [backlayer addsublayer: imagelayer];

Running effect,

 

Add a border to the image. Code:

Imagelayer. bordercolor = [uicolor graycolor]. cgcolor; // The border color imagelayer. borderwidth = 2.0; // The Border width.

Running effect:

Set the image to an elliptical corner. Code:

Imagelayer. cornerradius = 10.0; // sets the layer rounded corner radius. imagelayer. maskstobounds = yes; // hides the border.

Running effect:

However, since the attribute maskstobounds is set to true, the shadow effect of the layer does not exist.

Previously, I made another shadow image for the image, which is more realistic. If the shadow is only filled with borders, we can use two layers to achieve the shadow effect. Code:

Uiimage * image = [uiimage imagenamed: @ "feiche.jpg"]; // shadow layer calayer * shadowlayer = [calayer layer]; shadowlayer. frame = cgrectmake (100,100, image. size. width, image. size. height); shadowlayer. backgroundcolor = [uicolor bluecolor]. cgcolor; shadowlayer. shadowoffset = cgsizemake (0, 3); shadowlayer. cornerradius = 10.0; shadowlayer. shadowradius = 10.0; shadowlayer. shadowcolor = [uicolor blackcolor]. cgcolor; // set the shadowlayer to black. shadowopacity = 1.0; // set the shadow opacity [backlayer addsublayer: shadowlayer]; // Add the sub-Image Layer calayer * imagelayer = [calayer layer]; imagelayer. frame = cgrectmake (100,100, image. size. width, image. size. height); imagelayer. contents = (ID) image. cgimage; imagelayer. cornerradius = 10.0; // set the Corner radius of the layer to imagelayer. maskstobounds = yes; // hide the border imagelayer. bordercolor = [uicolor graycolor]. cgcolor; // The border color imagelayer. borderwidth = 2.0; [backlayer addsublayer: imagelayer];

Effect after running: