Getting started with storyboard

Zookeeper

Previously, ios5 used pure code to process the interface. Despite its strict data information, operations are less efficient than storyboards operations. Now we will briefly learn and summarize this fashionable storyboards.

1. Create storyboards.

There are many ways to create storyboards. It is common to create a project when creating a project. You can also add storyboards after creating a project, both methods have the same effect. After creation, you can find the keyword uimainstoryboardfile in plist.

 2. instantiate storyboards

When your 'uimainstoryboardfile' is set, the compiler instantiates the storyboard and loads it when the code is automatically generated in the program startup window. If you have added storyboards to your existing app, you can start encoding. The methods for instantiating view controllers on the storyboard are defined in the uistoryboard class. When you want to specify a View Controller in the storyboard, you can use this method to load the storyboard:

 
 

  
  
+ storyboardWithName:bundle: 
 
 

  3. Load view controllers in the storyboardThe method for loading view controllers in storyboard is similar to that of nib, and it is used with uistoryboard objects. You can use the following methods to instantiate view controllers:

 
 

  
  
- instantiateInitialViewController 
  
  
- instantiateViewControllerWithIdentifier: 
 
 

  SeguesSegues is the transition definition in your storyboard file. Uikit provides two default transition styles: Push and modal. The expression is similar to pushviewcontroller: animated: Completion: And presentviewcontroller: animated: completion. in the new content, you can create a custom segues and a new view controllers transition type. you can check the content later in "custom over effect. in the storyboard file, you connect an event of view controllers to another view controllers to create segues. you can drag a button to a View Controller, or drag a gesture to recognize a View Controller. There are many other options that will not be listed one by one. after IB creates a segue between two VC instances, you can also select the segue and use the attributes Inspector panel to modify the transitional style. if you select a custom over-style, the attributes Inspector panel still allows you to set a custom class. you can think that segue is responsible for association and transition. the click event action of the button. The selected row (cell) on the static table, a gesture, or even a sound event can all trigger segues. the compiler will automatically generate the required code to execute the segue action. when segue executes the prepareforsegue: Sender: method called by the source VC. the object passed to him is a uistoryboardsegue type object. you can override this method to pass data to the target View Controller. the next section explains how to complete this task. when a View Controller executes multiple sews, the same prepareforsegue: Sender: method will be called by each segue. to identify the executed seue, use the seue identifier to check whether it is the seue to be executed and pass the corresponding data. as a Defensive Programming Practice, we recommend that you also execute this check event, even if your viewcontroller only executes one segue. in this way, you can ensure that your app will continue running instead of crashing after you add a new segue. 5. Data TransmissionWhen you use storyboards, viewcontroller is instantiated and automatically presented to users. you have the opportunity to overwrite the prepareforseue: Sender: Method to fill the data. by overwriting this method, you can obtain the pointer to the target viewcontroller and set the initialization value. the framework will call the same method before you use it. for example, viewdidload, initwithcoder:, and nsobject awakefromnib methods. This means that you can continue to write the initialization code of your viewcontroller when you do not use the storyboard. 6. Returned dataUse storyboards to pass data and return it to the parent-level (or upper-level) viewcontroller, just like using the NIB file or manually coding the user interface. the data created or input by users displayed on the view can be returned in the form of delegate or block. the only difference is that in your parent viewcontroller, you need to set delegate to self in the prepareforseque: Sender: method. 7. instantiate other viewcontrollersUiviewcontroller has a storyboard attribute that holds a pointer (uistoryboard) from the instantiated storyboard object ). if your viewcontroller is created in the NIB file or manually encoded, this attribute will be nil. in other words, you can instantiate viewcontroller of other definitions in your storyboard. you can do this by using the viewcontroller identifier. the following uistoryboard method allows you to instantiate a viewcontroller using a token.

 
 

  
  
– instantiateViewControllerWithIdentifier: 
 
 

Therefore, you can still have viewcontroller in your storyboard without linking any viewcontroller through segues, and these viewcontrollers can still be initialized and used. 8. manually execute seguesAlthough storyboards can automatically trigger segues based on actions. in some cases, you may need to execute a segues program. you may need to solve the problem that actions cannot be processed by the storyboard file. to execute a segue, you call the javasmseguewithidentifier: Sender: Method of viewcontroller. when you manually execute segues, you can use the caller and context object in the sender parameter. this sender parameter will send the prepareforseue: Sender: method later. 9. Unlock seguesStoryboards allows you to instantiate viewcontroller with a navigation chart. the method introduced by ios6 in uiviewcontroller allows you to unlock a secret. after unlocking segues, You can implement the "back" method of the navigator without creating an additional viewcontroller. you can implement an ibaction in your viewcontroller to add and unbind the support segues and obtain the uistoryboardsegue parameter, as shown below:

 
 

  
  
-(IBAction)unwindMethod:(UIStoryboardSegue*)sender { 
  
  
  } 
 
 

Now you can connect the event to its exit object in a viewcontroller. xcode automatically calculates all possible unlocking events in the storyboard (any method that returns ibaction can accept a uistoryboardsegue as a parameter) and allows you to connect to them.: 10. Build tableview through storyboardAn important advantage of storyboard is the ability to build static tableview from IB. on the storyboard, you can build two types of tableview: one type does not need to specify a class as the static tableview of datasource, the other is to contain a prototype cell to constrain the data in the model (similar to custom tableview cells in ios4 ). 10.1 static tableviewYou can create a static tableview in your storyboard. First, drag a table to the storyboard and select. then select static cells on attributes inspector ..: static cells is a good choice for creating setting pages. For example, Apple's setting page is made by static cells. (or the content is not from coredata model, network server, or any such datasource page ). "The tableview of static cells can only be created from a uitableviewcontroller. you cannot create the tableview of static cells. If this tableview is added as a subview of uiviewcontroller." 10.2 prototype cells (prototype cell)Prototype cells are similar to tableview's M cell. however, it is not the cellforrowatindexpath method used to create prototype cells in a separate NIB file and load the cells in datasource. you create them on the IB of the storyboard, and you only need to set the data in your datasource method. "All your prototype cells identifiers use a custom identifier. to ensure proper running in the tableview queue method. if prototype cells in your storyboard do not have a cell identifier, xcode will warn you." 11. Custom transfer (Transition)Storyboards will execute a custom transfer effect earlier when one viewcontroller is connected to another viewcontroller. when segues is executed, the compiler will generate the necessary code based on the custom transition style you set in the storyboard to present or push the target viewcontroller. you can see two transfer styles: Push and model. These two are supported by IOS native. of course there will be a third style-custom. select Custom and provide your own uistoryboardsegue subclass to process your custom transfer effect. create a uistoryboardsegue subclass and override the perform method. in this perform, access the layer pointer of the main view of the source viewcontroller and implement Custom Animation (using core animation ). when the animation is executed, push or present your target viewcontroller. (You can get his pointer from the segue object ). in general, this is very simple. for example, I will show you how to create a transition effect. create a new project using the master-Details template. open mainstoryboard. click segue and change the type to custom. add a uistoryboardsegue subclass. override the perform method and paste the following code;

 
 

  
  
Custom Transition Using a Storyboard Segue (CustomSegue.m) 
  
  
   - (void) perform { 
  
  
     UIViewController *src = (UIViewController *)self.sourceViewController; 
  
  
     UIViewController *dest = (UIViewController *)self.destinationViewController; 
  
  
     CGRect f = src.view.frame; 
  
  
     CGRect originalSourceRect = src.view.frame; 
  
  
     f.origin.y = f.size.height; 
  
  
     [UIView animateWithDuration:0.3 animations:^{ 
  
  
       src.view.frame = f; 
  
  
     } completion:^(BOOL finished){ 
  
  
       src.view.alpha = 0; 
  
  
       dest.view.frame = f; 
  
  
       dest.view.alpha = 0.0f; 
  
  
       [[src.view superview] addSubview:dest.view]; 
  
  
       [UIView animateWithDuration:0.3 animations:^{ 
  
  
         dest.view.frame = originalSourceRect; 
  
  
         dest.view.alpha = 1.0f; 
  
  
       } completion:^(BOOL finished) { 
  
  
         [dest.view removeFromSuperview]; 
  
  
         src.view.alpha = 1.0f; 
  
  
         [src.navigationController pushViewController:dest animated:NO]; 
  
  
  }]; }]; 
  
  
} 
 
 

In this way, you can use the layer pointer of the target viewcontroller to do many crazy things .. justin mecham opened an open-source example on GitHub about the doorway transition. (https://github.com/jsmecham/DoorwaySegue )).. you can also create your own transition effect by controlling the pointer of the source layer and the target viewcontroller. ios7 introduces a number of complex APIs for executing custom transfer results. sets the view to deploy the transfer and the effect of the interaction engineer. for example, the general pop gesture in the navigation controller. AdvantagesWhen using storyboard, developers (or customer/project managers) can easily understand the process of this app. instead of understanding the process through a large number of NiB files and interspersed instantiated code. developers can open storyboard to complete the process. this is only a powerful reason for people to use storyboard. Disadvantages: Hell-like merger conflictsStoryboard has a very annoying problem for the entire team. the Default Application Template of xcode has a storyboard for the entire program. this means that when two developers work on the UI at the same time. merging conflicts cannot be avoided. in addition, because the storyboard automatically generates XML internally, it will be very complicated to fix these merge conflicts. even a New XML formatted file is used to reduce merge conflicts, but storyboard often obtains conflict information. the simplest way to solve this problem is to avoid this situation first. I suggest you split your storyboard into multiple files. Each usage corresponds to one file. in most cases, a developer will only work in one situation, which will eventually lead to a much lower probability of merging conflicts.

Getting started with storyboard