IOS development-tiled navigation-page-based navigation and case implementation

Implementation Based on paging navigation

 

After iOS 5, you can use the page controller (uipageviewcontroller) to construct an application similar to the e-book effect, which is called a page-based application. A paging application has many related view controllers.

 

The pageviewcontroller needs to be placed in a parent View Controller. A subview controller is also available under the page controller. Each subview controller corresponds to a page in the figure.

The required classes and protocols for applications based on paging navigation: uipageviewcontrollerdatasource protocol and uipageviewcontrollerdelegate protocol and uipageviewcontroller class. uipageviewcontroller does not have a corresponding View class.

In the uipageviewcontrollerdelegate delegation protocol, the most important method is pageviewcontroller: spinelocationforinterfaceorientation:, which sets the spine location and initializes the homepage Based on the orientation of the screen rotation.

Uipageviewcontroller has two common attributes: doublesided and spinelocation ).

1. Double-sided display: When the page is displayed, the even page is displayed on the back. Figure 6-13 The right figure shows the case where doublesided is set to yes, and the figure shows that doublesided is set to no (single-sided display). When one-sided display is displayed on the page, you can see the back of the page, the content on the back of the page goes through the current page, which is the opposite of the current content.

2. The position of the spine. The spine position is also an important attribute, but its spinelocation attribute is read-only. To set it, you must use the pageviewcontroller: spinelocationforinterfaceorientation: Method in the uipageviewcontrollerdelegate delegation protocol. The position of the spine is defined by the enumeration uipageviewcontrollerspinelocation. The member variables of this enumeration type are as follows.

 

Next we will use the page navigation to implement the city information application. Use the single view application template to create a project named pagenavigation.

You can copy it from the pagecontrolnavigation project by enabling mainstoryboard. select three view controllers on the storyboard, press command + C to copy them, and then open mainstoryboard in pagenavigation. storyboard, press command + V to paste it.

In this way, the uidesign is over, and the following work is done by the Code. Let's first look at the viewcontroller. H code:

# Import <uikit/uikit. h> @ interface viewcontroller: uiviewcontroller <uipageviewcontrollerdatasource, uipageviewcontrollerdelegate> {// int pageindex of the current page;} @ property (strong, nonatomic) uipageviewcontroller * pageviewcontroller; @ end

 

 

In the above Code, viewcontroller implements the uipageviewcontrollerdatasource and uipageviewcontrollerdelegate protocols. The member variable pageindex stores the index of the current page, and the pageviewcontroller attribute stores the uipageviewcontroller instance.

Next let's take a look at the viewdidload method of the program code viewcontroller. M:

-(Void) viewdidload {[Super viewdidload]; self. view. frame = cgrectmake (0.0f, 0.0f, 3200000f, then 0000f); self. pageviewcontroller = [[uipageviewcontroller alloc] initwithtransitionstyle: uipageviewcontrollertransitionstylepagecurlnavigationorientation: uipageviewcontrollernavigationorientationhorizontal options: Nil. pageviewcontroller. delegate = self; self. pageviewcontroller. datasource = self; uistoryboard * mainstoryboard = [uistoryboard storyboardwithname: @ "mainstoryboard" Bundle: Nil]; uiviewcontroller * page1viewcontroller = [mainstoryboard comment: @ "page1"]; // The first view, the most pageviewcontroller homepage nsarray * viewcontrollers = @ [page1viewcontroller]; [self. pageviewcontroller setviewcontrollers: viewcontrollersdirection: uipageviewcontrollernavigationdirectionforward animated: Yes completion: NULL]; [self addchildviewcontroller: Self. pageviewcontroller]; [self. view addsubview: Self. pageviewcontroller. view]; pageindex = 0 ;}

 

 

In the above Code, initwithtransitionstyle: navigationorientation: Options: constructor is used to create a uipageviewcontroller instance. initwithtransitionstyle is used to set the page flip style. The uipageviewcontrollertransitionstyle Enumeration type defines the following two flip styles.

Uipageviewcontrollertransitionstylepagecurl: Book flip effect style.

Uipageviewcontrollertransitionstylescroll: Sliding Screen Effect style.

Navigationorientation sets the page turning direction. The uipageviewcontrollernavigationdirection Enumeration type defines the following two page turning methods.

Uipageviewcontrollernavigationdirectionforward: from left to right (or from bottom to top );

Uipageviewcontrollernavigationdirectionreverse: right-to-left (or top-down ).

Code nsarray * viewcontrollers = @ [page1viewcontroller] is equivalent to nsarray * viewcontrollers = [nsarray arraywithobject: page1viewcontroller, nil].

In uipageviewcontroller, The setviewcontrollers: direction: animated: Completion: method is used to set the view displayed on the home page. Several views are displayed on the homepage. For uipageviewcontrollerspinelocationmin or uipageviewcontrollerspinelocationmax, a view is displayed on the homepage. For uipageviewcontrollerspinelocationmid, two views are displayed on the homepage.

The [self addchildviewcontroller: Self. pageviewcontroller] statement adds pageviewcontroller to the parent View Controller.

Let's look at the code about the uipageviewcontrollerdatasource protocol implementation method in viewcontroller. M:

-(Uiviewcontroller *) pageviewcontroller :( uipageviewcontroller *) pageviewcontrollerviewcontrollerbeforeviewcontroller :( uiviewcontroller *) viewcontroller {pageindex-; If (pageindex <0) {pageindex = 0; return nil ;} uistoryboard * mainstoryboard = [uistoryboard storyboardwithname: @ "mainstoryboard" Bundle: Nil]; nsstring * pageid = [nsstring stringwithformat: @ "Page % I", pageindex + 1]; uiviewcontroller * pvcontroller = [mainstoryboard layout: pageid]; return pvcontroller;}-(uiviewcontroller *) pageviewcontroller :( uipageviewcontroller *) usage :( uiviewcontroller *) viewcontroller {pageindex ++; if (pageindex> 2) {pageindex = 2; return nil;} uistoryboard * mainstoryboard = [uistoryboard layout: @ "mainstoryboard" Bundle: Nil]; nsstring * pageid = [nsstring stringwithformat: @ "Page % I", pageindex + 1]; uiviewcontroller * pvcontroller = [mainstoryboard instantiateviewcontrollerwithidentifier: pageid]; return pvcontroller;} In viewcontroller. in M, the code for implementing the delegate protocol uipageviewcontrollerdelegate is as follows:-(uipageviewcontrollerspinelocation) pageviewcontroller :( uipageviewcontroller *) Principal :( uiinterfaceorientation) orientation {self. pageviewcontroller. doublesided = no; return uipageviewcontrollerspinelocationmin;} since the attributes of spinelocation are read-only, you can only set the spine position in this method, this method dynamically sets the position of the spine based on the orientation of the screen rotation. For the implementation code, refer to the following code:-(uipageviewcontrollerspinelocation) pageviewcontroller :( uipageviewcontroller *) question :( uiinterfaceorientation) orientation {uistoryboard * mainstoryboard = [uistoryboard storyboardwithname: @ "mainstoryboard" Bundle: Nil]; uiviewcontroller * page1viewcontroller = [mainstoryboard comment: @ "page1"]; uiviewcontroller * page2viewcontroller = [mainstoryboard Controller: @ "page2"]; If (orientation = uiinterfaceorientationlandscapeleft | orientation = uiinterfaceorientationlandscaperight) {// retrieve the first view controller, most pageviewcontroller homepage nsarray * viewcontrollers = @ [page1viewcontroller, page2viewcontroller]; [self. pageviewcontroller setviewcontrollers: viewcontrollersdirection: uipageviewcontrollernavigationdirectionforward animated: Yes completion: NULL]; self. pageviewcontroller. doublesided = no; return uipageviewcontrollerspinelocationmid;} // retrieve the first view controller, which is the most pageviewcontroller homepage nsarray * viewcontrollers = @ [page1viewcontroller]; [self. pageviewcontroller setviewcontrollers: viewcontrollersdirection: uipageviewcontrollernavigationdirectionforward animated: Yes completion: NULL]; self. pageviewcontroller. doublesided = no; return uipageviewcontrollerspinelocationmin ;}

 

This is only a basic implementation, which should be determined based on the specific application. When tiled navigation is used, uipageviewcontroller usually does not need to rotate the screen, and the position of the spine is not set in the middle.

After the code is compiled, check the effect.