In this tutorial we’ll discuss and implement iOS UI Navigation Controller. It’s another common UI element that’s used as the base for many iOS apps.
在本教程中,我们将讨论并实现iOS UI导航控制器 。 这是另一个常见的UI元素,用作许多iOS应用程序的基础。
iOS导航控制器 ()
A Navigation Controller also holds a UIView class instance. The primary use of a navigation controller is to create and hold a hierarchy of view controllers in a stack(officially termed as navigation stack). In others words the Navigation Controller maintains a history of View Controllers the user has browsed through. A Navigation Controllers view consists of many subviews that include a navigation bar at the top ( which contains the optional title, back button and other bar buttons), a custom content view and an optional toolbar at the bottom.
导航控制器还拥有一个UIView类实例。 导航控制器的主要用途是在堆栈(正式称为“ 导航堆栈” )中创建并保存视图控制器的层次结构。 换句话说,导航控制器维护用户浏览过的View Controller的历史记录。 导航控制器视图由许多子视图组成,这些子视图在顶部包括一个导航栏(其中包含可选的标题,后退按钮和其他栏按钮),一个自定义内容视图和在底部的可选工具栏。
To setup a navigation controller, select the initial view controller in your storyboard and go to Editor>Embed In>Navigation Controller. The storyboard would look like this:
要设置导航控制器,请在情节提要中选择初始视图控制器,然后转到编辑器>嵌入在>导航控制器中 。 故事板如下所示:
We’ll need to add View Controllers to the storyboard to bring the Navigation Controller in use. Before we do that we’ll discuss segues that are an important component for moving across View Controllers.
我们需要将“视图控制器”添加到情节提要中,以使用“导航控制器”。 在此之前,我们将讨论segue,它们是在View Controller之间移动的重要组成部分。
塞格斯 (Segues)
Segues provide a mechanism to connect two View Controllers/scenes. There are many kinds of segues.
Segues提供了一种连接两个View Controller / scenes的机制。 segues有很多种。
- Show/Push : This pushes the next View Controller onto the navigation stack thereby allowing the user to click the back button to return to the previous screen through the back button on the top left of the Navigation Bar. Show / Push :将下一个View Controller推到导航堆栈上,从而允许用户单击后退按钮,以通过导航栏左上角的后退按钮返回上一屏幕。
- Show Detail : The next view controller content is present in the details area if it’s a master detail screen (UISplitViewController). Else if it’s not the master detail type then the current content is replaced with the new one. 显示详细信息 :如果下一个视图控制器内容是主详细信息屏幕( UISplitViewController ),则它将显示在详细信息区域中。 否则,如果不是主从类型,则将当前内容替换为新内容。
- Present Modally : This animates the next transition on the screen in a presentation style that is chosen from the list of styles present( or a custom one). Typically the next views transitions into the screen from bottom to upwards. In cases of iPad it centers itself in the middle of the screen with the previous view controller content in background. 模态呈现 :这将从呈现样式(或自定义样式)列表中选择一种呈现样式,为屏幕上的下一个过渡设置动画效果。 通常,下一个视图从下到上过渡到屏幕。 在iPad的情况下,它将自己置于屏幕中间,而背景中的以前的View Controller内容将居中。
- Popover presentation : On an iPad, this shows the new View Controller over the previous one in a smaller box, usually with an arrow pointing to which UI Element created the popover. When used on an iPhone, it is not much different than the Present Modally segue by default, but can be configured to act more like an iPad one. Popover演示文稿 :在iPad上,这会在一个较小的框中显示前一个视图控制器上的新View Controller,通常带有一个指向创建该Popover的UI元素的箭头。 在iPhone上使用时,默认情况下它与“ 当前模式”序列没有太大区别,但可以配置为更像iPad。
- Custom : We can define our own behaviour for this type of segue. 自定义 :我们可以为这种类型的segue定义自己的行为。
The Segue object belongs to the class UIStoryboardSegue.
Segue对象属于UIStoryboardSegue类。
To pass data from one ViewController to another, we’ll have to override prepareForSegue
function.
The show/push type of segue has a default back button in the navigation bar of the Child View Controller.
For the other type of segues we need to add an Unwind Segue method (more on this in later tutorials). The unwind segue method is created by adding an IBAction button with parameters as UIStoryboardSegue in the Parent View controller.
要将数据从一个ViewController传递到另一个ViewController,我们必须重写prepareForSegue
函数。
显示/推送类型的segue在子视图控制器的导航栏中具有默认的后退按钮。
对于其他类型的segue,我们需要添加一个Unwind Segue方法(有关更多信息,请参见后面的教程)。 通过在父视图控制器中添加一个参数为UIStoryboardSegue的IBAction按钮,可以创建展开选择方法。
In this application we’ll add a Second View Controller that comes up from the first View Controller using segues. We’ll add a UITextField where the user enters the value that’s passed and displayed in the next view controller.
在此应用程序中,我们将使用segues从第一个View Controller中添加第二个View Controller。 我们将添加一个UITextField,用户在其中输入在下一个视图控制器中传递并显示的值。
Control+ click and drag the button to the Second View Controller. Chose push as the manual type of segue.
按住Control键单击并拖动按钮到Second View Controller。 选择推送作为手动搜索。
The screen should look like the one given below.
屏幕看起来应该如下图所示。
Notice the segue symbol between the two View Controllers. The symbol is different for different type of segues.
注意两个视图控制器之间的标记符号。 不同类型的标记的符号不同。
Focus the segue symbol and name the segue identifier as “mySegue”.
聚焦segue符号,并将segue标识符命名为“ mySegue”。
Add a new Cocoa class file for the Second View controller (it should be a subclass of UIViewController. We’ve named it here as SecondScreen.swift
. Select the Second View Controller and link the class name in the Identity Inspector as shown in the image below.
为Second View控制器添加一个新的Cocoa类文件(它应该是UIViewController的子类。我们在这里将其命名为SecondScreen.swift
。选择Second View Controller并在Identity Inspector中链接该类名,如图所示)下面。
项目结构 (Project Structure)
The SecondScreen.swift
file is for the Second View Controller.
The info.plist
file is a list of properties and it provides another method for storing information for our app.
SecondScreen.swift
文件用于Second View Controller。
info.plist
文件是属性列表,它提供了另一种用于存储应用程序信息的方法。
码 (Code)
ViewController.swift
ViewController.swift
import UIKit
class ViewController: UIViewController,UITextFieldDelegate {
@IBOutlet var textToPass: UITextField!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
textToPass.delegate=self
}
override func viewWillAppear(animated: Bool) {
self.navigationItem.title = "First Screen"
}
override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject!) {
self.navigationItem.title = nil
if segue.identifier == "mySegue"{
let s = segue.destinationViewController as! SecondScreen
s.studentName = self.textToPass.text
}
}
func textFieldShouldReturn(textField: UITextField) -> Bool // called when 'return' key pressed.
{
textField.resignFirstResponder()
return true;
}
override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {
textToPass.resignFirstResponder()
self.view.endEditing(true)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
In the above code we’ve added the UITextFieldDelegate Protocol for handling the UITextField methods.
We’ve handled the UITextField such that the keyboard should be dismissed if tapped outside or return key is pressed. Notice the difference in the code from the one we wrote for Objective-C.
在上面的代码中,我们添加了UITextFieldDelegate协议来处理UITextField方法。
我们已经处理过UITextField ,以便在外部轻按或按下回车键时可以关闭键盘。 请注意,代码与我们为Objective-C编写的代码有所不同。
@IBOutlet var textToPass: UITextField!
The ! mark means that the var value is strictly of type UITextField and it cannot be null.
! 标记表示var值严格为UITextField类型,并且不能为null。
textToPass.delegate=self
The above statement programmatically assigns the delegate of the UITextField to the view controller itself. It’s similar to Control+dragging the textfield to the dock in the storyboard.
上面的语句以编程方式将UITextField的委托分配给视图控制器本身。 这类似于Control +将文本字段拖到情节提要中的停靠栏中。
The prepareForSegue is the most important method in this class. Let’s look into it.
prepareForSegue是此类中最重要的方法。 让我们看看它。
override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject!) {
self.navigationItem.title = nil
if segue.identifier == "mySegue"{
let s = segue.destinationViewController as! SecondScreen
s.pass = self.textToPass.text
}
}
The next screen shows a back button by default only when the previous screen doesn’t contain a title. Else the back text of the next screen would be replaced with the title of this screen.
Hence we’ve assigned the title to null. The segue identifier string should be the same as the one declared in the storyboard.
默认情况下,下一个屏幕仅在前一个屏幕不包含标题时显示后退按钮。 否则,下一个屏幕的后文本将替换为该屏幕的标题。
因此,我们已将标题分配为null。 segue标识符字符串应与情节提要中声明的字符串相同。
s.studentName = self.textToPass.text
The pass
string is an instance variable of the SecondScreen.swift. What we’ve done here is assign the instance variable of the SecondScreen.swift
class to the text the user types in the textfield here.
pass
字符串是SecondScreen.swift的实例变量。 我们在这里所做的就是将SecondScreen.swift
类的实例变量分配给用户在此处文本SecondScreen.swift
的文本。
SecondScreen.swift
SecondScreen.swift
import UIKit
class SecondScreen: UIViewController {
var pass:String?
@IBOutlet var textReceived: UILabel!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
if let name = pass {
if name.characters.count>0 {
textReceived.text = name
}
}
}
}
This class just displays the pass
string in the UILabel on the screen only if the user had typed in the UITextField widget, else it shows the default label string.
仅当用户在UITextField小部件中键入时,此类才在屏幕上的UILabel中显示pass
字符串,否则它将显示默认标签字符串。
The output of the application in action is given below.
实际应用程序的输出如下。
This brings an end to this tutorial. You can download the iOS NavController project from the link below.
本教程到此结束。 您可以从下面的链接下载iOS NavController项目。
翻译自: https://www.journaldev.com/10602/ios-navigation-controller-and-segues