34,333
edits
Changes
no edit summary
[[Image:xcode_7_unitconverter_main.png]]
Figure 16-1
[[Image:xcode_6_unitconverter_text_view.png|A UITextField view added to an Xcode 7 storyboard scene]]
Figure 16-2
Double click on the label to highlight the text and press the backspace key to clear it (we will set the text from within a method of our View Controller class when the conversion calculation has been performed). Though the label is now no longer visible when it is not selected, it is still present in the view. If you click where it is located it will be highlighted with the resize dots visible. It is also possible to view the layout outlines of all the views in the scene, including the label, by selecting the Editor -> Show Bounds Rectangles menu option.
In order for the user interface design layout to adapt to the many different device orientations and iPad and iPhone screen sizes it will be necessary to add some Auto Layout constraints to the views in the storyboard. Auto Layout will be covered in detail in subsequent chapters, but for the purposes of this example, we will request that Interface Builder add what it considers to be the appropriate constraints for this layout. In the lower right hand corner of the Interface Builder panel is a toolbar. Click on the background view of the current scene and click on the Resolve Auto Layout Issues button as highlighted in Figure 16 -3:
[[Image:xcode_6_resolve_auto_layout_button.png|The Xcode 7 "Resolve Auto Layout Issues" button]]
Figure 16-3
[[Image:xcode_6_resolve_Auto_layout.png|Resetting Auto Layout to suggested constraints]]
Figure 16-4
[[Image:ios_8_converter_ui.png|The user interface layout for the iOS 9 interactive app example]]
Figure 16-5
[[Image:xcode_6_assistant_editor_button.png|The Xcode 7 Assistant Editor toolbar button]]
Figure 16-6
In the event that multiple Assistant Editor panels are required, additional tiles may be added using the View -> Assistant Editor -> Add Assistant Editor menu option.
By default, the editor panel will appear to the right of the main editing panel in the Xcode window. For example, in Figure 16 -7 the panel to the immediate right of the Interface Builder panel is the Assistant Editor:
[[Image:xcode_6_assistant_editor.png|The Xcode 7 Assistant Editor]]
Figure 16-7
[[Image:xcode_6_unit_converter_outlet_drag.png|Establishing an outlet connection in Xcode 7]]
Figure 16-8
Upon releasing the line, the configuration panel illustrated in Figure 16 -9 will appear requesting details about the outlet to be defined.
[[Image:xcode_6_establish_outlet.png|Establishing an outlet connection in Xcode 7]]
Figure 16-9
[[Image:xcode_6_establish_action.png|Establishing an action connection in Xcode 7]]
Figure 16-10
[[Image:ios_8_unitconverter_running.png|The iOS 9 example Swift app running]]
Figure 16-11
[[Image:xcode_6_did_end_on_exit.png|Setting up an action to hide the keyboard in iOS 9]]
Figure 16-12
