A) Three structural bodies: Cgpoint, Cgsize, CGRect
1. Cgpoint
- struct Cgpoint {
- CGFloat x;
- CGFloat y;
- };
- typedef struct CGPOINT Cgpoint;
2.
cgsize
- struct Cgsize {
- Cgfloatwidth;
- Cgfloatheight;
- };
- typedef struct CGSIZECGSIZE;
3.CGRect
- struct CGRect {
- Cgpoint origin;//Offset is relative to the parent window
- Cgsize size;
- };
- typedef struct CGRECT CGRect;
These three structures are in a header file:CGGeometry.h
II) Several methods
1.CGRectMake
- Cg_inline CGRect
- CGRectMake (CGFloat x, cgfloat y, cgfloat width, cgfloatheight)
- {
- CGRect rect;
- rect.origin.x = x; RECT.ORIGIN.Y = y;
- Rect.size.width = width; Rect.size.height = height;
- return rect;
- }
This method is to make a rect, set the Origin(beginning, upper left corner), width and height, you can draw a position and size of the rect(rectangle) is declared as an inline function, one is because it is smaller, Second, because we need some efficiency when we draw the interface. This function is still hidden in the first file:CGGeometry.h
c) Several basic interface elements: window, view to display content on the screen first to create a window hosting content, to create a window, a border (frame) is required, the underlying structure that contains the border information is cgrect. Each object that can display itself on the screen has a border that defines his display area, but many high-level view classes automatically calculate this information. Other classes are set by a initwithframe initialization method when the view is initialized.
Come to know a class:UIScreen. The UIScreen class represents the screen, and through this class we can get something we want.
- CGRect screenbounds = [[Uiscreenmainscreen]bounds];//returns a rect with the status bar
- CGRect viewbounds = [[Uiscreenmainscreen]applicationframe];//does not contain a rect of the status bar
- Screenbounds and Viewbounds are relative to the device screen.
- So screenbounds.origin.x== 0.0; SCREENBOUNDS.ORINGIN.Y = 0.0;
- ScreenBounds.size.width = = 320; ScreenBounds.size.height ==480 (or some other resolution is different)
- So screenbounds.origin.x== 0.0; SCREENBOUNDS.ORINGIN.Y = 20.0; (because the height of the status bar is 20 pixels) ScreenBounds.size.width = = 320;screenbounds.size.height = = 480
Let's meet here.
UIViewClass, which inherits from the
Uiresponder, look at the name and we know it is the canvas that is responsible for the display, if the window is compared to the artboard. We are constantly removing, replacing, or overlaying the canvas on the artboard, or overlaying other canvases on the canvas, which is of course the painter's decision. With the canvas, we can do it arbitrarily on top.
- uiview* myView =[[uiviewalloc]initwithframe:cgrectmake (0.0,0.0,200.0,400.0)];//Here you create a canvas that defines the position relative to the parent window, and the size.
UIWindow inherited from UIView, there may be a logical obstacle to this, how do artboards inherit from the canvas? Do not go too far to specialize in Niu Jiao Jian, the shape of the artboard is the same as the canvas? Take a piece of canvas and then use some method to strengthen it, is it possible to use as an artboard? That's why a view can be added directly to another view. Take a look at the initialization process of the system (inside application:didfinishlauchingwithoptions):
- Self.window = [[[UIWindow alloc] initwithframe:[[uiscreenmainscreen] bounds]] autorelease];
- Self.window.backgroundColor = [uicolorgraycolor];//sets a background color for window
- [Self.window makekeyandvisible];//let window show
Practical Walkthrough:
1) Create a new project Select empty application name is LW1
2) inside the application:didfinishlaunchingwithoptions, you will find that the system has been built good one artboards, we now use the system to help us build the artboard, you can certainly build an artboard, but it is not necessary. an application can have only one artboard .
- -(BOOL) Application: (UIApplication *) Applicationdidfinishlaunchingwithoptions: (nsdictionary*) launchOptions
- {
- Self.window = [[[UIWindow alloc] initwithframe:[[uiscreenmainscreen] bounds]] autorelease];//system helps you build Artboards
- Override point for customization after applicationlaunch.
- Test yourself on the difference between bounds and aplicationframe.
- CGRect bound = [[UIScreen mainscreen]bounds];
- NSLog (@ "boundwidth:%f boundheight:%f", bound.size.width,bound.size.height);
- NSLog (@ "boundx:%f boundy:%f", BOUND.ORIGIN.X,BOUND.ORIGIN.Y);
- CGRect appbound = [[Uiscreenmainscreen]applicationframe];
- NSLog (@ "appboundwidth:%f appboundheight:%f", appbound.size.width,appbound.size.height);
- NSLog (@ "appboundx:%f appboundy:%f", APPBOUND.ORIGIN.X,APPBOUND.ORIGIN.Y);
- The first canvas is painted blue and the size is 100 X
- CGRect Cgone = CGRectMake (0.0, 0.0, 320,100);//Draw a rectangle, initialize position and size
- UIView *v_one = [[uiviewalloc]initwithframe:cgone];//Initialize View
- V_one.backgroundcolor = [Uicolor bluecolor];//painted Blue
- [Self.window addsubview:v_one];//directly onto the artboard
- The second piece takes care of its position.
- CGRect cgtwo = CGRectMake (0.0, 100, 160,100);//Draw a rectangle, initialize position and size
- UIView *v_two = [[uiviewalloc]initwithframe:cgtwo];//Initialize View
- V_two.backgroundcolor = [Uicolor redcolor];//painted Red
- [Self.window addsubview:v_two];//Overlay to Artboards
- The third piece, pay attention to his position.
- CGRect Cgthree = CGRectMake (160, 100, 160, 100);//
- UIView *v_three = [[uiviewalloc]initwithframe:cgthree];//
- V_three.backgroundcolor = [Uicolor greencolor];//
- [Self.window addsubview:v_three];//
- Four, take note of its position.
- CGRect cgfour = CGRectMake (0.0, 260, 320, 200);//
- UIView *v_four = [[uiviewalloc]initwithframe:cgfour];//
- V_four.backgroundcolor = [Uicolor orangecolor];//
- [Self.window addsubview:v_four];//
- The fifth piece, calculate its position, look at its effect,
- You can try to move this code to the top of the first quick initialization, and you'll have an unexpected effect.
- CGRect cgfive = CGRectMake (100, 150, 160, 200);
- UIView *v_five = [[uiviewalloc]initwithframe:cgfive];
- V_five.backgroundcolor = [Uicolor Yellowcolor];
- [Self.window addsubview:v_five];
- Self.window.backgroundColor = [Uicolor graycolor];//
- [Self.window makekeyandvisible];//
- Finally, remember release.
- [V_one release];
- [V_two release];
- [V_three release];
- [V_four release];
- [V_five release];
- return YES;
- }
A simple description of the view