Bảng phân cảnh dành cho phát triển iOS

Bảng phân cảnh dành cho phát triển iOS

Storyboard Ios Development

Bảng phân cảnh lần đầu tiên được giới thiệu cho các nhà phát triển trong bản phát hành iOS 5. Chúng giúp nhà phát triển không gặp khó khăn khi thiết kế giao diện của mỗi màn hình trong một tệp khác nhau. Bảng phân cảnh cho phép bạn xem tổng thể mô hình khái niệm của ứng dụng và tương tác giữa mỗi màn hình. Sử dụng segues, bạn có thể đặt cách ứng dụng sẽ chuyển đổi giữa các màn hình nhất định và chuyển dữ liệu. Trong hướng dẫn này, tôi sẽ chỉ cho bạn cách tạo màn hình đăng nhập đơn giản cho một ứng dụng.



Bắt đầu



Điều đầu tiên mà bạn sẽ muốn làm là thực hiện một dự án mới. Bạn sẽ muốn một ứng dụng màn hình đơn mới cài đặt ngôn ngữ cho Swift và các thiết bị trở nên phổ biến. Nếu bạn điều hướng đến bảng phân cảnh, bạn sẽ thấy một cảnh bộ điều khiển chế độ xem trống. Mũi tên ở bên trái của bộ điều khiển chế độ xem cho biết đó là bộ điều khiển gốc.

bảng phân cảnh



Để thêm nhãn cho tên người dùng và mật khẩu, bạn cần đi tới hộp ở dưới cùng bên phải màn hình, chọn hình tròn có hình vuông và kéo và thả hai nhãn vào chế độ xem của bạn. Bằng cách chọn các tùy chọn trên thanh bên, bạn có thể chỉ định nhiều thông số quan trọng. Có quá nhiều thứ để xem qua nhưng hầu hết đều tự giải thích.

bảng phân cảnh2

Hai cái quan trọng đối với chúng tôi là văn bản giữ chỗ và hộp kiểm nhập văn bản an toàn. Chúng tôi muốn sử dụng văn bản giữ chỗ để cho người dùng biết thông tin nào là bắt buộc và mục nhập an toàn để ẩn mật khẩu của người dùng khỏi hiển thị. Sau khi hoàn thành việc này, chúng ta cần một nút để kích hoạt segue của mình. Chúng ta có thể kéo một cái vào giống như cách chúng ta đã làm với một trường văn bản. Sau khi bạn đã đặt tiêu đề cho nút và sắp xếp các đối tượng của bạn trên màn hình sẽ giống như sau:



bảng phân cảnh3

Bây giờ, màn hình ứng dụng đầu tiên của chúng ta đã xong, vì vậy chúng ta cần tạo một màn hình khác để chuyển sang. Thực hiện việc này bằng cách kéo lên màn hình một bộ điều khiển chế độ xem thứ hai. Để kết nối hai màn hình, bạn phải làm hai việc. Trước tiên, bạn sẽ cần điều khiển nhấp vào nút và kéo nó đến màn hình mới mà bạn đã thêm. Tiếp theo, bạn sẽ cần chọn vòng tròn giữa hai chế độ xem. Sau đó, bạn sẽ cần phải thay đổi số nhận dạng thành segue; đối với ví dụ này, tôi sẽ sử dụng “nextScreen”

bảng phân cảnh4

Cuối cùng, chúng tôi sẽ đặt một nhãn trên màn hình mới để chúng tôi có thể xem người dùng và xem ứng dụng của chúng tôi có hoạt động hay không. Để có thể truy cập các trường từ bảng phân cảnh theo lập trình, chúng ta sẽ cần tạo các cửa hàng cho chúng trong lớp sử dụng chúng như sau:

class FirstScreen: UIViewController {

@IBOutlet tên người dùng var yếu: UITextField!
@IBAction func loginButton (người gửi: AnyObject) {
perfromSegueWithIdentifier (“nextScreen”, sender: self)
}
}

class SecondScreen: UIViewController {
người dùng var: String!
@IBOutlet tên người dùng var yếu: UILabel!

ghi đè func viewDidload () {
username.text = người dùng
}
}

Sau khi thực hiện xong, hãy đảm bảo liên kết các đối tượng từ bảng phân cảnh bằng trình kiểm tra kết nối của mỗi màn hình. Các cửa hàng của bạn sẽ hiển thị và bạn có thể nhấp vào vòng tròn ở bên phải của họ để liên kết chúng.

bảng phân cảnh5
Chức năng cuối cùng được triển khai là chức năng chuẩn bị sẵn sàng trong lớp của màn hình đầu tiên. Điều này cho phép bạn chuyển dữ liệu sang dạng xem mới như sau:

ghi đè niềm vui chuẩn bịForSegue (sau: UIStoryboardFollow, người gửi: AnyObject?) {
if segue.identifier == “nextScreen” {
let destVC = continue.destinationViewController làm UIViewController
destVC.user = self.username
}
}

Bây giờ bạn đã có hiểu biết cơ bản về cách thay đổi màn hình và chuyển dữ liệu giữa chúng. Điều này sẽ giúp bạn có một khởi đầu thuận lợi để tạo các ứng dụng chức năng, chúc bạn lập trình vui vẻ!

2 phút đọc