Weekly essays-15.11.08 and essays-15.11.08

Weekly essays-15.11.08 and essays-15.11.08

 

New knowledge point record for one week (15.11.08) I, About Hidden , Alpha , Opaque Description

All three are attributes of UIView:

Hidden: YES or NO. If YES, the UIView object is hidden and NO response gesture can be returned (removed from the response chain). The subview on the UIView is also hidden and cannot respond to the gesture;

Alpha: transparency (0 ~ 1.0) 0 is completely transparent, and 1 is not transparent. When it is set to 0, it is equivalent to setting hidden to YES and cannot respond to gestures. The sub-view on it will be completely transparent and cannot respond to gestures.

Opaque: indicates whether the object name is opaque. However, setting it to NO means that it is transparent, but the running discovery is still visible. In fact, this property does not directly set whether the UIView object is transparent. In fact, it is used to optimize the performance and provides a performance optimization switch for the drawing system. If the UIView object is completely opaque (alpha is 1), set it to YES. If the UIView object is not completely opaque (alpha is not 1), set it to NO. If it is set to YES, unexpected results may occur.

This can greatly improve the performance of UIView during rendering and save GPU consumption. See http://blog.csdn.net/martin_liang/article/details/40739845 for details

Ii. Supplement Quartz2D

Coordinate System

1. Quartz Coordinate System Default origin is located in the lower left corner, x axis to the right, y axis to the up.

2. In the coordinate system in UIKit, the origin is in the upper left corner, while the Coordinate System Origin of Quartz is in the lower left corner. In the graphical Context obtained in UIView, the system has transformed the coordinate system into the coordinate system of UIKit by translating the CTM origin of the graphic Context to the upper left corner, at the same time, the y axis is reversed (y value multiplied by-1. Therefore, when drawing a UIView, you do not need to adjust the coordinate system of the obtained image context (the coordinates of the UIView have been matched ).

3. For bitmap, bitmap graphics context created through uigraphicsbeginimagecontextwitexceptions is located in the upper left corner of the coordinate system, which is the same as that of UIView, the system has automatically converted it.

Note:

(1) The bitmap context coordinate system created through uigraphicsbeginimagecontextwitexceptions is automatically converted. If you manually create a bitmap context through CGBitmapContextCreate, its coordinate system is still the coordinate system of Quartz, that is, start from the lower left corner and start from the bottom to the top of the Y axis.

(2) draw an image using CGContextDrawImage in the graphic context obtained by drawRect or the graphic context obtained by uigraphicsbeginimagecontextwitexceptions. Since the image context has been converted to the coordinate system of UIKit, how can the origin be put upside down in the upper left corner? The reason is that the coordinate system of the CGImage parameter passed in by the CGContextDrawImage method is inverted. To avoid this problem, you can call drawInRect to draw the UIImage.

(3) If necessary, You need to flip the coordinate system:

CGContextTranslateCTM (cox, 0, height );

CGContextScaleCTM (cox, 1.0,-1.0 );

DrawGradient

You can draw a gradient using a CGShading object or a CGGradient object. CGGradient is easy to reuse and easy to use. Here we only describe how to use CGGradient to draw a gradient.

Main steps:

(1) create a CGGradient object that provides a color space, an array containing two or more color components, an array containing two or more positions, and the number of gradient colors.

(2) Call the CGContextDrawLinearGradient (axial) or CGContextDrawRadialGradient (radial) function and provide a context, a CGGradient object, drawing options, and start and end ry to draw a gradient.

(3) release the CGGradient object when it is no longer needed.

Sample Code:

// Method 1 for creating a gradient object // size_t numOfLocations = 3; // number of positions // CGFloat locations [3] = {0, 0.5, 1 }; // The element value ranges from 0 ~ 1 indicates the ratio of the distance from the position point to the starting point of the axis to the axis length // CGFloat components [12] = {1.0, 0.5, 0.4, 1.0, 0.8, 0.8, 0.3, 1.0, 0.5, 0.5, 1.0}; // The number of color component elements is a multiple of 4 (RGBA * Number of positions) // CGGradientRef gradient = CGGradientCreateWithColorComponents (colorSpace, components, locations, numOfLocations );
// Method 2 CGFloat locations [3] = {0, 0.5, 1}; NSArray * colors = [NSArray arrayWithObjects: (id) [UIColor colorWithRed: 0.540 green: 1.000 blue: 0.814 alpha: 1.000]. CGColor, (id) [UIColor colorWithRed: 1.000 green: 0.687 blue: 0.695 alpha: 1.000]. CGColor, (id) [UIColor colorWithRed: 0.970 green: 1.000 blue: 0.488 alpha: 1.000]. CGColor, nil]; CGGradientRef gradient = CGGradientCreateWithColors (colorSpace, (_ bridge CFArrayRef) colors, locations); // draw axial gradient values (cox, gradient, CGPointZero, CGPointMake (rect. size. width, rect. size. height), 0); // draw a radial gradient // CGContextDrawRadialGradient (cox, gradient, CGPointMake (50, 50), 25, CGPointMake (250,500), 50, 0 );
CGColorSpaceRelease (colorSpace); CGGradientRelease (gradient );

 

Transparent Layer

The transparent layer is a target cache independent of the graphic context. When you need to use special effects on a group of objects, the transparent layer is very useful, it will regard a group of objects as a whole to draw special effects. Taking the shadow of three rectangles as an example:

Transparent layer not used:

    CGSize myShadowOffset = CGSizeMake (10, -10);    CGContextSetShadow (cox, myShadowOffset, 5);
    CGContextSetRGBFillColor (cox, 0, 1, 0, 1);    CGContextFillRect (cox, CGRectMake (20, 20,80,80));    CGContextSetRGBFillColor (cox, 0, 0, 1, 1);    CGContextFillRect (cox, CGRectMake (80,80,80,80));    CGContextSetRGBFillColor (cox, 1, 0, 0, 1);    CGContextFillRect (cox, CGRectMake (140,140,80,80));

 

Use transparent layer:

CGSize myShadowOffset = CGSizeMake (10,-10); CGContextSetShadow (cox, myShadowOffset, 5); opacity (cox, NULL); // enable the transparent layer and then start to draw CGContextSetRGBFillColor (cox, 0, 1, 0, 1); CGContextFillRect (cox, CGRectMake (20, 20, 80, 80); CGContextSetRGBFillColor (cox, 0, 0, 1, 1); CGContextFillRect (cox, CGRectMake (80, 80, 80); Round (cox, 1, 0, 0, 1); CGContextFillRect (cox, CGRectMake (140,140, 80, 80); CGContextEndTransparencyLayer (cox ); // close the transparent layer

 

Reference:

[Quartz 2D Programming Guide] (http://southpeak.github.io/blog/2014/11/10/quartz-2dbian-cheng-zhi-nan-zhi-%5B? % 5D-: gai-lan /)

3. differentiate resolution, pixels, points, and dimensions

Resolution and pixels are usually used in the display or image description to indicate the definition. What do we usually say about the screen resolution, camera pixels, and the specific meaning?

Take the iPhone 3gs screen (doubled screen) with a resolution of 320*480 as an example:

Pixels: Pixels are the most basic unit elements (minimum unit) of an image. The screen has 320 pixels in length and 480 pixels in width. 320*480 is about 0.15 million, that is, the screen pixel is 0.15 million. Only one color can be displayed in one pixel.

ResolutionResolution refers to the number of pixels in each direction of length and width. The above 320*480 represents the resolution.

Dimensions: The size is the actual length and width of the screen. For example, if iPhone 4 is 3.5 inch, the diagonal length of the screen is 3.5 inch, 1 inch = 25.4mm.

Point: Points are used to build a coordinate system. They are developed based on actual conditions and requirements. They are artificial ideas and are not actually exist. In ios development, the unit length of the coordinate system is a point. On the iPhone 3gs, a single point contains a pixel. This screen is commonly called a doubled screen. On the iPhone 4, 4 s, and iPhone 5, it is twice the retina screen, A point contains two pixels (Here we talk about the length of one dimension. From a two-dimensional perspective, a point contains four pixels, with a length of 2x2), that is, two times the screen, the screen mode is represented by @ 2x. For iPhone 6 P and iPhone 6 SP of retina, a single point contains three pixels. In development, the interface is laid out in the coordinate system built through points to facilitate adaptation, because the system automatically adapts when displaying the screen resolution is no longer needed.

Supplement:

• The size of each pixel is uncertain and determined by the size and resolution of the screen.
• The pixel is usually a pixel, not the point mentioned above.
• The size of an image or an image with the same resolution on different screens varies depending on the pixel size of the screen.

A & B-> C

C & D-> E

A: screen resolution

B: screen size

C: screen pixel size

D: image resolution

E: Display size of the image on the screen

• If the image resolution is the same as the screen resolution, the image can be fully displayed. If the image resolution is <screen resolution, the image cannot be fully displayed. If you stretch the image to fill the screen, the image resolution will decrease; image resolution> screen resolution.

References:

[Relationship between pixels and resolution] (http://www.360doc.com/content/13/0630/15/3398926_296570170.shtml)

[IOS APP how to adapt to iPhone 5s/6/6 plus three screen sizes] (http://my.oschina.net/u/1049180/blog/362599)

4. iphone Screen adaptation rules

Sometimes, when you run the program, a black box is displayed on the UI. This is caused by the fact that the current program is not compatible with the iPhone 5 screen. We know that the iPhone 5 screen pixel is 640*1136, 640 pixels higher than the iPhone 4's 960*176, that is, 88 points. If the program is not compatible with the iPhone 5, the result of running on iPhone 5 is the Black edge with 44 vertices in height.

So how does the system know that it has adapted to the iPhone 5? If you think that the function of starting an image is only to display an image before entering the app, you will be wrong. Its larger function is to initialize the image display, including checking the adaptation. This is usually time-consuming. When an image is started, the user may feel that the system has responded immediately, reducing the anxiety of waiting!

For iPhone 6, if it is not compatible with iPhone 5 or iPhone 6, then the program remains black when it is remote. If the iphone 5 is adapted to the iphone 6 but not the iphone 6, the program will be displayed in full screen, but it will find that the definition is not correct, because the iphone 5 and iphone screen length and width ratio are the same, therefore, the iPhone 5 program is simply enlarged, so it looks a bit fuzzy. If the iPhone 6 is adapted, this problem does not exist. The same is true for iPhone 6 s. The system identification adaptation method is also determined based on whether the screen startup diagram is set.

Currently, all iphone models have 5 middle screens (vertical screens ):

Retina1x (320*480) (not now available for iPhone 3gs)

Chain X (640*960) (iPhone 4/4S)

Retina4 (640*1136) (iPhone 5/5S/5c)

Retina HD4.7 (750*1334) (iphone6/6 s)

Retina HD5.5 (1242*2208) (iphone6p/6sp)

Refer:

[IOS APP how to adapt to iPhone 5s/6/6 plus three screen sizes] (http://my.oschina.net/u/1049180/blog/362599)

V, How to set the startup chart

I. Use LaunchImage

In the project Targets-App Icons and Launch Images-Launch Image Source, set the startup map resource directory, and set the startup map of the corresponding screen in the startup map resource folder in Assets. xcassets. This method is compatible with ios7 and ios8.

Ii. Use LauchScreen. xib

This is a new feature of Xcode6/iOS8, that is, iOS7 is not supported. Therefore, the current practice is to use LaunchImage. In the future, applications will no longer need to be compatible with ios7, and LauchScreen. xib may be widely used.

Note: Xcode uses LaunchScreen. xib as the startup mode by default. If you do not need to set the Launch map using LauchScreen. xib, set the Targets-App Icons and Launch Images-Launch Screen File of the project to null.

[Launch Screen in iOS7/8 Implementation] http://blog.shiqichan.com/Launch-Screen-in-iOS-7-and-8/

VI, Ios Mid-besell Curve

UIBezierPath is an encapsulation of the CGPathRef framework of the uiz2d framework by the UIKit framework. It facilitates the painting, but it must also be in the drawing graphic context environment.

UIBezierPath has a CGPathRef attribute CGPath, which is used to implement the connection with the CG framework.

Generally, the CGPath attribute of UIBezierPath is used to provide the rendered shape for CAShapeLayer.

 

VII. CAShapeLayer

1. CAShapeLayer is a special layer that can render graphics on it.

2. CAShapeLayer inherits from CALayer and can use all CALayer attributes.

3. CAShapeLayer needs to be used with the besell curve to make sense. The besell curve provides the rendered image for it.

4. Use the CAShapeLayer and Bessel curves to draw some desired images in the drawRect method that no longer views.

Comparison of CAShapeLayer and drawRect:

Drawing Images in drawRect calls the method in CoreGraphics framework, which occupies CPU and consumes a large amount of energy;

CAShapeLayer is a CoreAnimation framework that uses GPU to render graphics, saving performance. Animation rendering is directly submitted to the GPU without memory consumption.

For usage, see Demo http://download.csdn.net/detail/lotheve/9248547

8, CAGradientLayer

1. CAGradientLayer is a special layer used to render gradient effects.

2. CAGradientLayer inherits from CALayer and can use all CALayer attributes.

3. CAGradientLayer is another method to draw gradient effects in the graphic context. It is directly rendered on the layer without the help of the graphic context, so it is easy to use.

Use see Demo http://download.csdn.net/detail/lotheve/9248547