iOS 개발 용 스토리 보드



문제를 제거하기 위해 도구를 사용해보십시오

스토리 보드는 iOS 5 릴리스에서 개발자에게 처음 소개되었습니다. 스토리 보드는 개발자가 각 화면의 인터페이스를 다른 파일로 디자인하는 수고를 덜어줍니다. 스토리 보드를 사용하면 앱 전체의 개념적 모형과 각 화면 간의 상호 작용을 볼 수 있습니다. segues를 사용하면 앱이 주어진 화면 사이를 전환하고 데이터를 전달하는 방법을 설정할 수 있습니다. 이 튜토리얼에서는 앱에 대한 간단한 로그인 화면을 만드는 방법을 보여줍니다.



시작하기



가장 먼저하고 싶은 일은 새 프로젝트를 만드는 것입니다. 언어를 Swift로 설정하고 장치를 범용으로 설정하는 새로운 단일 화면 응용 프로그램이 필요합니다. 스토리 보드로 이동하면 빈 뷰 컨트롤러 장면이 표시됩니다. 뷰 컨트롤러의 왼쪽에있는 화살표는 루트 컨트롤러임을 나타냅니다.



스토리 보드

사용자 이름과 암호에 대한 레이블을 추가하려면 화면 오른쪽 하단의 상자로 이동하여 사각형이있는 원을 선택한 다음 두 개의 레이블을 뷰에 끌어서 놓아야합니다. 사이드 바에서 기본 설정을 선택하여 많은 중요한 매개 변수를 지정할 수 있습니다. 갈 것이 너무 많지만 대부분은 자명하다.

스토리 보드 2



우리에게 중요한 두 가지는 자리 표시 자 텍스트와 보안 텍스트 입력 확인란입니다. 자리 표시 자 텍스트를 사용하여 사용자에게 필요한 정보와 사용자의 비밀번호가 표시되지 않도록 숨길 수있는 보안 항목을 알려 드리고자합니다. 이 작업이 끝나면 segue를 트리거하려면 버튼이 필요합니다. 텍스트 필드와 같은 방식으로 드래그 할 수 있습니다. 버튼에 제목을 지정하고 화면에 개체를 정렬하면 다음과 같이 표시됩니다.

스토리 보드 3

이제 앱의 첫 번째 화면이 완료되었으므로 전환 할 다른 화면을 만들어야합니다. 두 번째 뷰 컨트롤러를 화면으로 드래그하면됩니다. 두 화면을 연결하려면 두 가지를 수행해야합니다. 먼저 버튼 클릭을 제어하고 추가 한 새 화면으로 드래그해야합니다. 다음으로 두보기 사이의 원을 선택해야합니다. 그런 다음 식별자를 segue로 변경해야합니다. 이 예에서는 'nextScreen'을 사용합니다.

스토리 보드 4

마지막으로 새 화면에 레이블을 지정하여 사용자를보고 앱이 작동하는지 확인할 수 있습니다. 프로그래밍 방식으로 스토리 보드에서 필드에 액세스 할 수 있으려면 다음과 같이 사용하는 클래스에서 해당 필드에 대한 콘센트를 만들어야합니다.

class FirstScreen : UIViewController {

@IBOutlet 약한 var 사용자 이름 : UITextField!
@IBAction func loginButton (sender : AnyObject) {
perfromSegueWithIdentifier ( 'nextScreen', 보낸 사람 : self)
}
}

class SecondScreen : UIViewController {
var user : String!
@IBOutlet 약한 var 사용자 이름 : UILabel!

override func viewDidload () {
username.text = 사용자
}
}

이 작업이 완료되면 각 화면의 연결 검사기를 사용하여 스토리 보드에서 개체를 연결해야합니다. 콘센트가 표시되고 오른쪽에있는 원을 클릭하여 연결할 수 있습니다.

스토리 보드 5
구현할 마지막 함수는 첫 번째 화면의 클래스에있는 prepareForSegue 함수입니다. 이렇게하면 다음과 같이 새보기에 데이터를 전달할 수 있습니다.

fun prepareForSegue 재정의 (다음 : UIStoryboardFollow, 보낸 사람 : AnyObject?) {
if segue.identifier ==“nextScreen”{
let destVC = continue.destinationViewController as UIViewController
destVC.user = self.username
}
}

이제 화면을 변경하고 화면간에 데이터를 전달하는 방법을 기본적으로 이해했습니다. 이것은 기능적인 앱을 만드는 좋은 시작, 행복한 프로그래밍을 제공 할 것입니다!

2 분 읽기