Getting Started with IOS 5 storyboards (3)

segues Introduction

It's time to add more Viewcontroller to our story board. We will create a scene so that the user can add new players to the program.

Drag a barbuttonitem to the right end of the navigation bar of the Players scene. Change its identifier to add by using the properties panel so that it becomes a standard + sign button. When you click on this button we will pop up a new mode window where you can enter the information of the new player.

Drag a tableviewcontroller to the canvas and place it on the right side of the players scene. You can reduce the canvas by double-clicking so that you have more space to work with.

Select the Tableviewcontroller and embed it into a navigationcontroller (via the menu "Editor\embedin\navigation Controller").

Next Note: Select the + sign button, hold down the CTRL key, and drag it to the newly added Navigationcontroller.

Release the mouse and select Modal in the pop-up menu. An extra arrow will appear between the Players scene and the Navigationcontroller:

This connection is called segue (pronunciation: seg-way), which means jumping from one viewcontroller to another viewcontroller. This differs from the relationship, which is used to denote that one viewcontroller contains another viewcontroller. In other words, a segue will change everything on the screen. triggered by a touch or gesture (and something like that) on a button, Tableviewcell.

The advantage of segue is that you do not need to write any code that renders a new window. There is no need to connect the button to the ibaction. As we have just done, dragging a line is enough to connect the Barbuttonitem with the next scene. (If the control already has a ibaction connection, segue will overwrite it).

Run the program and press the + sign button. A new TableView will pop up!

This is the "modal-style" segue. The new window completely obscures the front window. The user cannot interact with the previous window unless the popup window is closed. We will then demonstrate the "push-type" segue, which presses a new window into the stack of the navigation controller.

This new viewcontroller is not very useful-you can't even close it back to the main window!

Segue is just one-way, from the Players window to the new window. To return, you must use the delegate mode. First, we must create a class for the new scene. Add a Uitableviewcontroller subclass to the project, named Playerdetailsviewcontroller.

Go back to the storyboard editor, select the new Tableviewcontroller, and change the Class to Playerdetailsviewcontroller in the identity panel. I often forget this step, so I remind you not to be like me.

Change its title to "Add Player" (by double-clicking the navigation bar) ... Add two Barbutton Items to the navigation bar at the same time. In the Properties panel, set the left button's Identifier to Cancel, and the right setting to done.

Then modify the PlayerDetailsViewController.h:

@class Playerdetailsviewcontroller;  @protocol playerdetailsviewcontrollerdelegate <nsobject>-(void) Playerdetailsviewcontrollerdidcancel:    ( Playerdetailsviewcontroller *) controller;-(void) Playerdetailsviewcontrollerdidsave:    ( Playerdetailsviewcontroller *) controller; @end   @interface Playerdetailsviewcontroller:uitableviewcontroller  @property (nonatomic, weak) ID <PlayerDetailsViewControllerDelegate> delegate;  -(ibaction) Cancel:(id) sender;-(ibaction) done:(ID) sender;  @end

We define a delegation protocol so that when the user clicks Cancel or done, we are able to return to the Players window from the Addplayer window.

Return to the storyboard editor and connect the Cancel button and the Done button to the appropriate action method. The first method is to hold down the CTRL key, drag from Barbuttonitem to Viewcontroller, and then select the appropriate action method in the pop-up menu:

In PLAYERDETAILSVIEWCONTROLLER.M, add these two methods:

-(ibaction) Cancel:(id) sender {        [self.delegate playerdetailsviewcontrollerdidcancel:self];}-(Ibaction) Done:(ID) sender {        [self.delegate playerdetailsviewcontrollerdidsave:self];}

The two methods correspond to two Barbutton respectively. These methods inform the delegate object what event was triggered. Eventually you need to have the delegate object close the window (this is not required, but I like to do it.) Of course, you can also ask Addplayer to shut down itself before or after notifying the delegate object.

Note that the delegate method typically places a reference to the caller in the first parameter of the method (or only one parameter). This is the Playerdetailsviewcontroller parameter. This allows the delegate object to know which object is sending a message to it.

Do not forget to synthesize delegate properties:

@synthesize delegate;

We have defined a trust agreement for Playerdetailsviewcontroller, and we need to implement it somewhere. Obviously, this place should be playersviewcontroller. Because it is responsible for rendering the Addplayer window. Add the following code to the PlayerViewController.h:

#import "PlayerDetailsViewController.h"  @interface Playersviewcontroller:uitableviewcontroller < Playerdetailsviewcontrollerdelegate>

At the end of the Playersviewcontroller.m method, add:

#pragma mark-playerdetailsviewcontrollerdelegate  -(void) Playerdetailsviewcontrollerdidcancel:    ( Playerdetailsviewcontroller *) Controller {        [self dismissviewcontrolleranimated:yes completion:nil];}  -(void) Playerdetailsviewcontrollerdidsave:    (Playerdetailsviewcontroller *) controller {        [self DISMISSVIEWC Ontrolleranimated:yes Completion:nil];}

Here is simply to close the Addplayer window. We'll do some interesting things later on.

A new dismissviewcontrolleranimated:completion is appearing in IOS5: method. You can also use the old dismissmodalviewcontrolleranimated before: method. But the new approach will close the Viewcontroller more gracefully (it gives you a chance to execute additional code when the window is closed).

There is only one thing left: the Players window needs to tell Playerdetailsviewcontroller that it will become its delegate. You might want to use the story editor to drag a line between the two. Unfortunately, this is not possible. In segue, we still have to write code in order to pass the data to the next Viewcontroller.

Add the following method to the Playersviewcontroller:

-(void) Prepareforsegue:( Uistoryboardsegue *) Segue Sender:(ID) Sender {        if ([Segue.identifier isequaltostring: @ "Addplayer"]) {               UIN Avigationcontroller * Navigationcontroller =             Segue.destinationviewcontroller;               Playerdetailsviewcontroller * Playerdetailsviewcontroller = [[Navigationcontroller viewcontrollers] objectatindex:0] ;               Playerdetailsviewcontroller.delegate = self;        }}

The Prepareforsegue method is triggered at the time the segue is about to occur. The new Viewcontroller has been loaded with the storyboard, but it is not visible and we have to use this method to pass parameters to it. (Never call the Prepareforsegue method yourself, it is called by UIKit to notify you that a segue is triggering.) ）

Note that the goal of Segue will be Navigationcontroller, which is associated with our barbuttonitem. In order to get the Playerdetailsviewcontroller instance, we must find it from the Viewcontrollers property of Navigationcontroller.

Run the program and press the + Sign button to try closing the Addplayer window. Incredibly ineffective!

That's because we didn't specify Segue's identifier. In the Prepareforsegue method, we check if identifier is Addplayer. In cases where multiple segue are present in the same viewcontroller, it is recommended that you distinguish between segue by identifier.

In the story editor, select the segue, and note that Barbuttonitem will be highlighted so that you can clearly see which control is triggering the segue.

In the Properties panel, set Identifier to Addplayer.

Run the program again, touch the Cancel or done button, and now you can close the window and return to the player list.

Note: You can also call the Dismissviewcontrolleranimated:completion: method from the modal window. You do not have to let the proxy object close. But if you do, be aware of one thing: your original [Self.parentviewcontroller Dismissmodalviewcontrolleranimated:yes] is no longer valid. You can replace Self.parentviewcontroller with Self.presentingviewcontroller, but this is a new property that appears after IOS5.

Also, in the Properties panel of Segue, there is a Transition field where you can choose a different transition animation.

You can try your favorite settings on the net. But do not change the Style property. For this window, it can only be modal--any other option will cause the program to crash!

In this tutorial, we use the delegate mode several times. Here we list the steps to establish a connection in two scenarios:

Create Segue from a button or other control in the source scene to another scene. (If you want to render a modal window, the target object should normally be a navigationcontroller).

Specifies the identifier of the segue. (for the same source scenario, the identifier must be unique; different source scenes can have duplicates.)

Create a delegate agreement for the target scenario.

Call the delegate method from the Cancel button and the Done button, and you will do so for the target scene to return to the source scene anywhere.

Implement the delegation protocol in the source scenario. When the Cancel button or the Done button is touched, the delegate object should be responsible for closing the target viewcontroller.

Implement the Prepareforsegue method in the source Viewcontroller, and make the delegate=self of the target scene;

The delegate model is inevitable, because there is no "reverse segue" such things. When segue is triggered, it creates a new target Viewcontroller instance. You can of course create a segue that is used to return from the target to the source scene, but this is too much to take for granted.

For example, you can create a segue from the Cancel button to return to the Players window, but you cannot close the Add Player window back to Players. Unless you create a new Players object. This way you create an endless loop until all the memory is consumed.

Remember: Segue has only one direction and can only be used to open new windows. To close it back (or eject it from the Navigationcontroller stack), the delegate mode is typically used. Segue only applies to the source scene, the target viewcontroller don't know what segue is.

Static cell

The final ADD Player window looks like this:

This is a grouped table view, but this time we don't need to create a data source for it. We can design it directly in the story editor without the need to write the Cellforrowatindexpath method. This new feature is called static cell.

In the ADD Players scene, select TableView, and modify the content to Static Cells in the Properties panel. Style selects Grouped,sections set to 2.

Once the Sections property is changed, the editor clones the existing section. (You can also select a section from the document tree on the left and copy it).

For each section, we have only one row. Select the extra rows and delete them. Select the topmost section and, through the Properties panel, enter the Player Name in the Header field.

Drag a new TextField into the only cell in this section. Remove its border so you don't see the TextField's head and tail. Set the font to System 17, and choose Adjust to Fit.

We will use Assistan Editor to create the TextField iboutlet. Open Assistant Editor and it will automatically open PlayerDetailsViewController.h. Select TextField, and then hold down CTRL and drag to the. h file:

Release the mouse button to bring up the window:

The Name is set to Nametextfield. Clicking Connect,xcode will add the following attributes to the PlayerDetailsViewController.h:

@property (Strong, nonatomic) iboutlet Uitextfield * Nametextfield;

It also automatically synthesizes attributes and adds statements to the Viewdidunload method.

I said this method cannot be used on a template cell, but it is possible in a static cell. Each static cell has only one instance (unlike the template cell, which is not copied), so it is entirely possible to connect their subview to the Viewcontroller exit.

The Style of the static cell that sets the second section is Rightdetail. This is a standard cell style. Set the Label text on the left to Game,accessory to disclosure indicator. Create an exit for the label on the right, named Detaillabel. These two labels are the usual UILabel objects.

The design of the Add Player window is as follows:

When using a static cell, the Tableviewcontroller does not use a data source. Because the Playerdetailsviewcontroller class is created by the Xcode template, there is a template code for the data source in the code and we need to delete it. Delete in:

#pragma mark-table View data source

And:

#pragma mark-table View Delegate

All the lines between. This eliminates some of the warnings that Xcode will have when adding this class. Run the program to see the effect of the static cell. We didn't write a single line of code--actually we dropped a whole bunch of code.

But we can't avoid writing some code. When you want to add a TextField to the first cell, you may notice that it's a little bit inappropriate, and there's some extra space around it. The user cannot see the TextField head and tail, so when they touch these gouges, the keyboard does not pop up. This is easy to fix, overwriting the Tableview:didselectrowatindexpath method code as follows:

-(void) TableView:( UITableView *) TableView    Didselectrowatindexpath:( Nsindexpath *) Indexpath {        if (indexpath.section = = 0)               [Self.nametextfield Becomefirstresponder];}

That is, when the user touches the first cell, we activate the TextField focus (there is only one cell in this section, so we just need to check the index of the section). This will automatically eject the soft keyboard. This is only trivial work, but can reduce the user's dissatisfaction.

You should also set the cell's selection style to none in the properties panel, or the entire row will turn blue when the user touches near the text box.

Well, this is the design of the Addplayer window. Now we're going to make it really work.

These are the contents of the iOS 5 Storyboard Primer (3) and more about topic.alibabacloud.com (www.php.cn)!

