IOS development 7: automatic rotation and resizing

Source: Internet
Author: User

Both Apple's iPad and iPhone Support automatic rotation, so the program we write also supports two views: vertical and horizontal.

By default, the programs we write are all vertical, just as in the previous examples. If you run a previously written program and rotate the simulator, you will find it unfriendly and some controls will not be seen. At this time, automatic rotation is necessary.

1. Let's talk about how to implement automatic rotation first. Let's talk about how to let the program know which types of rotation it supports.

Run xcode 4.2 to create a single view application named rotatetest. Other settings are as follows:

After the project is created, the first page that appears contains the following view:

Here we can set the rotation supported by the program, just select the button. It can be seen that, by default, the iPhone program does not support Reverse Rotation, because if the view is reverse, and the call suddenly comes, it will be very inconvenient, because the page is still inverted. However, if you create an iPad program, you will find that the four buttons are selected, that is, the iPad program supports all rotation by default.

NOTE: If multiple view controllers are created for the program, you can set the supported rotation for each View Controller. However, the value set by the newly created View Controller must be a subset of the main view controller.

In fact, we modify the button, essentially modifying the plist file of our program, in this project, is a RotateTest-Info.plist file, such as, expand this file, the following figure shows the supported rotation:

The above is a method that supports selection. We can also set the supported rotation in the code. Open viewcontroller. M and find the shouldautorotatetointerfaceorientation method. The complete code is as follows:

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation{    // Return YES for supported orientations    return (interfaceOrientation != UIInterfaceOrientationPortraitUpsideDown);}

The above Code indicates that the backend is not supported (uiinterfaceorientationportraitupsidedown ).

Four variables in the direction are defined in IOS:

UIInterfaceOrientationPortraitUIInterfaceOrientationPortraitUpsideDownUIInterfaceOrientationLandscapeLeftUIInterfaceOrientationLandscapeRight

If the IOS settings are rotated, the program will call this direction. If yes is returned, the view will be rotated. Otherwise, the view will not be rotated. If you create an iPad program, this method simply returns yes.

2. Since we have already let the program know what rotation is supported, the following describes how to implement it.

There are three methods for automatic rotation in IOS.

(1) the simplest method is to use the size inpector in xcode:

(2) override the willanimaterotationtointerfaceorientation method in viewcontroller. m corresponding to the view, and reset the widget size and position in this method.

(3) create a new view. In this way, we have two views, one vertical and the other horizontal. After the two views are designed, the corresponding view is called according to the rotation direction during rotation.

3. The following is a simple use of these three methods.

3.1 Use size inpector for automatic rotation:

① Click viewcontroller. XIB. Drag and Drop two buttons in the open view area and name them "button" and "button" respectively. The page layout is as follows:

In the figure, the two buttons are placed in the center horizontally.

② Run the program and rotate the simulator to compare the effects before and after rotation:

After rotation, the button is missing. However, the coordinates and sizes of buttons remain unchanged.

Now I want to align the two buttons horizontally after the rotation, and one at the top and the other at the bottom. To achieve this, I want to do the following:

③ Select "button" in the view, open the size inspector, and change the red line on the left to the dotted line:

④ Select "under the button" in the view, open the size inspector, change the red solid line on the left and top to the dotted line, and change the red dotted line on the bottom to the solid line:

The peripheral red solid line indicates that the distance remains unchanged. For example, the red solid line in the lower right corner indicates that the distance between the corresponding control and the lower side is unchanged, and the distance between the control and the lower side is automatically adjusted in other directions. Now run and rotate the simulator to see the effect:

3.2 rewrite the willanimaterotationtointerfaceorientation method and reset the widget size and position.

① First, add the outlet let ing to viewcontroller. H to the buttons, with the names button_1 and button_2 respectively:

② Add the following code before @ end in viewcontroller. M:

- (void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval) duration {    if (UIInterfaceOrientationIsPortrait(toInterfaceOrientation)) {        button_1.frame = CGRectMake(124, 20, 72, 37);        button_2.frame = CGRectMake(124, 403, 72, 37);    } else {        button_1.frame = CGRectMake(20, 131, 72, 37);        button_2.frame = CGRectMake(388, 131, 72, 37);    }}

③ Run and check the effect:

3.3 create a new view and switch the view when rotating:

① Create a copy of the original view, but it is still in the original viewcontroller. Click viewcontroller. XIB to open Ib. Select the view icon from the three icons on the left. If the Mac Book is used, press and hold the control key. If it is a virtual machine, press and hold the Alt key. Press and hold the left mouse button, drag down, and the mouse will become a green plus sign. Note that the new view is in parallel with the original view, so you need to drag it in the correct direction and then release the mouse to create a copy of the original view:

② Adjust the new view to landscape (landscape ):

Select the new view, open attribute inspector, and select landscape in orientation:

③ Adjust the button position in the new view. You can set it according to your preferences, as shown below:

④ Next, we create an outlet ing for the two views. Note that the view is not the control on The View. The ing method is the same. The two names are portrait and landscape:

⑤ Click viewcontroller. M and add the following statement to the next line of the @ implementation code:

#define degreesToRadians(x) (M_PI*(x)/180.0)

⑥ Modify the willanimaterotationtointerfaceorientation method as follows:

- (void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration {    if (toInterfaceOrientation == UIInterfaceOrientationPortrait) {        self.view = self.portrait;        self.view.transform = CGAffineTransformIdentity;        self.view.transform = CGAffineTransformMakeRotation(degreesToRadians(0));        self.view.bounds = CGRectMake(0.0, 0.0, 320.0, 460.0);    } else if(toInterfaceOrientation == UIInterfaceOrientationLandscapeLeft) {        self.view = self.landscape;        self.view.transform = CGAffineTransformIdentity;        self.view.transform = CGAffineTransformMakeRotation(degreesToRadians(-90));        self.view.bounds = CGRectMake(0.0, 0.0, 480.0, 300.0);    } else if(toInterfaceOrientation == UIInterfaceOrientationLandscapeRight) {        self.view = self.landscape;        self.view.transform = CGAffineTransformIdentity;        self.view.transform = CGAffineTransformMakeRotation(degreesToRadians(90));        self.view.bounds = CGRectMake(0.0, 0.0, 480.0, 300.0);    }}

7. Run and view the results:

4. Summary

This article describes three ways to automatically rotate and adjust the size. The first method is simple, but not suitable for complex views. The second method is to reset the size and position of the control, the amount of code is relatively large. The third is to create two views and call different views during rotation, which is suitable for complex views.

Source: http://my.oschina.net/plumsoft/blog/47289

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.