This article has participated in the third “topic writing” track of the Denver Creators Training Camp. For details, check out: Digg Project | Creators Training Camp third is ongoing, “write” to make a personal impact.

1. Pure code? Xib? Storyboard?

  • There are generally three approaches to iOS GUI construction
  1. Pure code
  2. Xib -> Transforms XML files into pure code to implement GUI construction
  3. Storyboard -> is simply a collection of XIBs
  • Pure code: The advantage is that it is the most efficient
  • Xib and Storyboard are both designed to improve page development efficiency, which is relatively low compared to pure code efficiency. After all, you need to load the file first, and those who have opened the IPA package can see the XIB file
  • Apple has optimized storyboards to assume multiple XIB files and one SB with multiple pages is more efficient

Why should I use storyboard

  1. Improved development efficiency (of course there is more time to attack 😏)
  2. Although the performance of pure code is better than that of Storyboard, the difference is negligible with Apple’s excellent products and technology, so there is no need to worry about consuming too much performance
  3. Write a pure storyboard project and show you what it looks like

2

  • Main.storyboard is, as the name suggests, the page that the app comes in and needs to display

  • UIStoryboard has only two initialization methods
// init method name: the name of sb, without suffix, Bundle nil is the default main
public init(name: String.bundle storyboardBundleOrNil: Bundle?).

// Get the specified controller of the sb displayed for the first time
open func instantiateInitialViewController(a) -> UIViewController?
   
// Get the controller specified in the StoryboardID
open func instantiateViewController(withIdentifier identifier: String) -> UIViewController
Copy the code
  • UIStoryboard segue, as its name suggests, links to the controller in UIStoryboard
  • The most important are the following three attributes; The way you initialize it is you can create a segue link in your code
// id of the segue in sb
open var identifier: String? { get }

// Which controller to jump from
open var source: UIViewController { get }

// Which controller to jump to
open var destination: UIViewController { get }
Copy the code
  • UIStoryboardUnwindSegueSource can simply understood as a fallback

3. The combination of multiple SB, using skills and notes

Quick nesting of tabbar controller and navigation bar controller in XIB; Of course, setting the properties of each control is basically under this column

Set sb’s first presentation controller

Basic layout understanding

1. Upper and lower constraints, width and height, comparison with other controls, width and height ratio

2. Constrain the parent control or other controls; Upper, lower, left and right margins; Horizontal and vertical are equal

3. You can embed view, Controller, or cancel

4. If some constraints are updated or incorrect, the system automatically completes the constraints

High-level layout embedding

  • There’s a Container View in the control library that looks like addChildController in pure code
  • In the last article, a friend said that static cells must inherit a UITableViewController, but we can embed it, and it’s easy
  • Of course, it’s a controller, you can embed anything
  • The third picture is the final result

Advanced layout StackView

  • Like a stack, the controls are arranged one by one
  • It has several properties, such as vertical and horizontal arrangement, padding method, distance between controls, and so on, which can enrich the layout and make it easier
  • When set to hide, it assumes that other display controls take precedence over other display controls, and that hidden controls have no reserved space
  • We can also download the demo to see the specific effect, picture screenshot is not complete, sorry

Advanced use returns A -> push -> B

  1. We need A to write the return function in the first controller to jump to

// Set the data for the callback
@IBAction func unwindToHome(_ unwindSegue: UIStoryboardSegue) {

    if let hobbyController = unwindSegue.source as? HobbyViewController {
        let str = hobbyController.hobbys[hobbyController.tableView.indexPathForSelectedRow?.row ?? 0]
        hobby.text = str

    }

}
Copy the code
  1. Drag from sb directly to exit will show, you control drag from B to Exit to show the method we implemented above, get source is B directly, and then process the data that needs to be called back

Advanced use of other techniques

  1. Control of the same class, we can select more than one, unified set its properties
  2. Controls basically inherit UIView, so you can almost always check and set the background color at the same time

  1. When dragging, we can drag multiple buttons to an action or to an array for easy control

The full demo implements page functionality with minimal code

  • Final SB file

  • Running effect

// Check whether the id in a certain SB does not meet the requirement for jump
override func shouldPerformSegue(withIdentifier identifier: String.sender: Any?) -> Bool {

    if identifier = = ""  {
        return false
    }

    return true
}

// When jumping, if you need to pass parameters, you can use this method
override func prepare(for segue: UIStoryboardSegue.sender: Any?) {
    if let controller = segue.destination as? LayoutViewController {
        print("todo...\(controller.description)")}}Copy the code

That’s about it for today. How much did you get? What want to learn can give me a message oh ~The demo address