Xamarin.ios에서 Storyboard 사용Working with Storyboards in Xamarin.Mac

스토리 보드는 지정 된 앱에 대 한 모든 UI를 해당 뷰 컨트롤러의 기능 개요로 분할 하 여 정의 합니다.A storyboard defines all of the UI for a given app broken down into a functional overview of its view controllers. Xcode의 Interface Builder에서 이러한 각 컨트롤러는 자체 장면에 상주 합니다.In Xcode's Interface Builder, each of these controllers lives in its own Scene.

Xcode의 Interface Builder에 스토리 보드A storyboard in Xcode's Interface Builder

스토리 보드는 컴파일되어 제공 될 때 Xamarin.ios 앱의 번들에 포함 되는 리소스 파일 (.storyboard확장명 포함)입니다.The storyboard is a resource file (with the extensions of .storyboard) that gets included in the Xamarin.Mac app's bundle when it is compiled and shipped. 앱에 대 한 시작 Storyboard를 정의 하려면 Info.plist 파일을 편집 하 고 드롭다운 상자에서 주 인터페이스 를 선택 합니다.To define the starting Storyboard for your app, edit it's Info.plist file and select the Main Interface from the dropdown box:

info.plist 편집기를합니다.The Info.plist editor

코드에서 로드Loading from Code

코드에서 특정 Storyboard를 로드 하 고 뷰 컨트롤러를 수동으로 만들어야 하는 경우가 있을 수 있습니다.There might be times when you need to load a specific Storyboard from code and create a View Controller manually. 다음 코드를 사용 하 여이 작업을 수행할 수 있습니다.You can use the following code to perform this action:

// Get new window
var storyboard = NSStoryboard.FromName ("Main", null);
var controller = storyboard.InstantiateControllerWithIdentifier ("MainWindow") as NSWindowController;

// Display
controller.ShowWindow(this);

FromName는 응용 프로그램의 번들에 포함 된 지정 된 이름을 사용 하 여 스토리 보드 파일을 로드 합니다.The FromName loads the Storyboard file with the given name that has been included in the app's bundle. InstantiateControllerWithIdentifier는 지정 된 Id를 사용 하 여 뷰 컨트롤러의 인스턴스를 만듭니다.The InstantiateControllerWithIdentifier creates an instance of the View Controller with the given Identity. UI를 디자인할 때 Xcode의 Interface Builder에 Id를 설정 합니다.You set the Identity in Xcode's Interface Builder when designing the UI:

스토리 보드 ID 설정Setting the Storyboard ID

필요에 따라 InstantiateInitialController 메서드를 사용 하 여 Interface Builder에서 초기 컨트롤러가 할당 된 뷰 컨트롤러를 로드할 수 있습니다.Optionally, you can use the InstantiateInitialController method to load the View Controller that has been assigned the Initial Controller in Interface Builder:

초기 컨트롤러를 설정Setting the initial controller

스토리 보드 진입점 및 위의 열린 끝 화살표로 표시 됩니다.It's marked by the Storyboard Entry Point and the open ended arrow above.

컨트롤러 보기View Controllers

뷰 컨트롤러는 Mac 앱 내에서 지정 된 정보 보기와 해당 정보를 제공 하는 데이터 모델 간의 관계를 정의 합니다.View Controllers define the relationships between a given View of information within a Mac app and the data model that provides that information. 스토리 보드의 각 최상위 장면은 Xamarin.ios 앱의 코드에서 하나의 뷰 컨트롤러를 나타냅니다.Each top level scene in the Storyboard represents one View Controller in the Xamarin.Mac app's code.

뷰 컨트롤러 수명 주기The View Controller Lifecycle

MacOS에서 Storyboard를 지원 하기 위해 여러 가지 새로운 메서드가 NSViewController 클래스에 추가 되었습니다.Several new methods have been added to the NSViewController class to support Storyboards in macOS. 가장 중요 한 것은 다음 메서드가 지정 된 뷰 컨트롤러에서 제어 하는 뷰의 수명 주기에 응답 하는 데 사용 하는 것입니다.Most importantly are the follow methods use to respond to the lifecycle of the View being controlled by the given View Controller:

  • ViewDidLoad-이 메서드는 스토리 보드 파일에서 뷰를 로드할 때 호출 됩니다.ViewDidLoad - This method is called when the view is loaded from the Storyboard file.
  • ViewWillAppear-이 메서드는 뷰가 화면에 표시 되기 직전에 호출 됩니다.ViewWillAppear - This method is called just before the view is displayed on screen.
  • ViewDidAppear-이 메서드는 뷰가 화면에 표시 된 후 바로 호출 됩니다.ViewDidAppear - This method is called directly after the view has been displayed on screen.
  • ViewWillDisappear-이 메서드는 뷰가 화면에서 제거 되기 직전에 호출 됩니다.ViewWillDisappear - This method is called just before the view is removed from the screen.
  • ViewDidDisappear-이 메서드는 뷰가 화면에서 제거 된 직후에 호출 됩니다.ViewDidDisappear - This method is called directly after the view has been removed from the screen.
  • UpdateViewConstraints-이 메서드는 뷰 자동 레이아웃 위치 및 크기를 정의 하는 제약 조건을 업데이트 해야 할 때 호출 됩니다.UpdateViewConstraints - This method is called when the constraints that define a view auto layout position and size need to be updated.
  • ViewWillLayout-이 메서드는이 뷰의 하위 뷰 화면에 배치 되기 직전에 호출 됩니다.ViewWillLayout - This method is called just before the subviews of this view are laid out on screen.
  • ViewDidLayout-이 메서드는 하위 뷰 뷰가 화면에 배치 된 후 바로 호출 됩니다.ViewDidLayout - This method is called directly after the subviews of view are laid out on screen.

응답자 체인The Responder Chain

또한 NSViewControllers는 이제 창의 _응답자 체인_의 일부입니다.Additionally, NSViewControllers are now part of the Window's Responder Chain:

응답자 체인The Responder Chain

그리고 잘라내기, 복사 및 붙여넣기 메뉴 항목 선택 등의 이벤트를 수신 하 고 응답 하기 위해 연결 되어 있습니다.And as such they are wired-up to receive and respond to events such as Cut, Copy and Paste menu item selections. 이 자동 보기 컨트롤러는 macOS Sierra (10.12) 이상에서 실행 되는 앱에 대해서만 발생 합니다.This automatic View Controller wire-up only occurs on apps running on macOS Sierra (10.12) and greater.

포함Containment

스토리 보드에서 뷰 컨트롤러 (예: 분할 뷰 컨트롤러 및 탭 뷰 컨트롤러)는 이제 다른 하위 뷰 컨트롤러를 "포함" 할 수 있도록 _포함_을 구현할 수 있습니다.In Storyboards, View Controllers (such as the Split View Controller and the Tab View Controller) can now implement Containment, such that they can "contain" other sub View Controllers:

뷰 컨트롤러 포함의 예An example of View Controller Containment

자식 뷰 컨트롤러에는 부모 뷰 컨트롤러에 다시 연결 하 고 화면에서 보기를 표시 하 고 제거 하는 데 사용할 수 있는 메서드와 속성이 포함 되어 있습니다.Child View Controllers contain methods and properties to tie them back to their Parent View Controller and to work with displaying and removing Views from the screen.

MacOS에 기본 제공 되는 모든 컨테이너 뷰 컨트롤러에는 고유한 사용자 지정 컨테이너 뷰 컨트롤러를 만들 때 따라야 하는 Apple 제안에 해당 하는 레이아웃이 있습니다.All Container View Controllers built into macOS have a specific layout which Apple suggest that you follow if creating your own custom Container View Controllers:

뷰 컨트롤러 레이아웃The View Controller layout

컬렉션 뷰 컨트롤러에는 각각 자체 뷰를 포함 하는 하나 이상의 뷰 컨트롤러를 포함 하는 컬렉션 뷰 항목의 배열이 포함 되어 있습니다.The Collection View Controller contains an array of Collection View Items, each of which contain one or more View Controllers that contain their own Views.

SegueSegues

Segue는 앱의 UI를 정의 하는 모든 장면 간의 관계를 제공 합니다.Segues provide the relationships between all of the Scenes that define your app's UI. IOS의 스토리 보드에서 작업 하는 데 익숙한 경우 Segue for iOS는 일반적으로 전체 화면 보기 간의 전환을 정의 한다는 것을 알고 있습니다.If you are familiar with working in Storyboards in iOS, you know that Segues for iOS usually define transitions between full screen views. 이는 Segue가 일반적으로 "포함"을 정의 하는 경우 macos와 다릅니다. 여기서 한 장면은 부모 장면의 자식입니다.This differs from macOS, when Segues usually define "Containment", where one Scene is the child of a parent Scene.

MacOS에서 대부분의 앱은 분할 뷰 및 탭과 같은 UI 요소를 사용 하 여 동일한 창 내에서 보기를 함께 그룹화 하는 경향이 있습니다.In macOS, most apps tend to group their views together within the same window using UI elements such as Split Views and Tabs. IOS와 달리 보기는 물리적 표시 공간이 제한 되어 있으므로 화면을 전환 하거나 화면에서 해제 해야 합니다.Unlike iOS, where views need to be transitioned on and off screen, due to limited physical display space.

프레젠테이션 SeguePresentation Segues

포함에 대 한 macOS 성향을 지정 된 경우 모달 창, 시트 보기 및 Popovers와 같은 프레젠테이션 segue 이 사용 되는 경우가 있습니다.Given macOS's tendencies towards containment, there are situations where Presentation Segues are used, such as Modal Windows, Sheet Views and Popovers. macOS는 다음과 같은 기본 제공 segue 유형을 제공 합니다.macOS Provides the following built-in segue types:

  • Show -Segue의 대상을 모달이 아닌 창으로 표시 합니다.Show - Displays the target of the Segue as a non-modal window. 예를 들어이 유형의 Segue을 사용 하 여 앱에 문서 창의 다른 인스턴스를 표시 합니다.For example, use this type of Segue to present another instance of a Document Window in your app.
  • Modal -Segue의 대상을 모달 창으로 표시 합니다.Modal - Presents the target of the Segue as a modal window. 예를 들어이 유형의 Segue을 사용 하 여 앱에 대 한 기본 설정 창을 표시 합니다.For example, use this type of Segue to present the Preferences Window for your app.
  • Sheet -Segue의 대상을 부모 창에 연결 된 시트로 표시 합니다.Sheet - Presents the target of the Segue as a Sheet attached to the parent window. 예를 들어이 유형의 segue을 사용 하 여 찾기 및 바꾸기 시트를 표시 합니다.For example, use this type of segue to present a Find and Replace Sheet.
  • 팝 오버 -Segue의 대상을 팝 오버 창에 표시 합니다.Popover - Presents the target of the Segue as in a popover window. 예를 들어 사용자가 UI 요소를 클릭 하는 경우이 Segue 유형을 사용 하 여 옵션을 표시 합니다.For Example, use this Segue type to present options when a UI element is clicked by the user.
  • 사용자 지정 -개발자가 정의한 사용자 지정 Segue 형식을 사용 하 여 Segue의 대상을 표시 합니다.Custom - Presents the target of the Segue using a custom Segue Type defined by the developer. 자세한 내용은 아래의 사용자 지정 Segue 만들기 섹션을 참조 하세요.See the Creating Custom Segues section below for more details.

프레젠테이션 Segue를 사용 하는 경우 표시 되는 부모 뷰 컨트롤러의 PrepareForSegue 메서드를 재정의 하 고, 변수를 초기화 하 고 표시 되는 뷰 컨트롤러에 데이터를 제공할 수 있습니다.When using Presentation Segues, you can override the PrepareForSegue method of the parent View Controller for presentation to initialize and variables and provide any data to the View Controller being presented.

트리거된 SegueTriggered Segues

트리거된 Segue를 사용 하 여 명명 된 Segue (Interface Builder의 식별자 속성을 통해)를 지정 하 고 사용자가 단추를 클릭 하거나 코드에서 PerformSegue 메서드를 호출 하는 등의 이벤트에 의해 트리거될 수 있습니다.Triggered Segues allow you to specify named Segues (via their Identifier property in Interface Builder) and have them triggered by events such as the user clicking a button or by calling the PerformSegue method in code:

// Display the Scene defined by the given Segue ID
PerformSegue("MyNamedSegue", this);

Segue ID는 앱 UI의 레이아웃을 지정 하는 경우 Xcode의 Interface Builder 내부에 정의 됩니다.The Segue ID is defined inside of Xcode's Interface Builder when you are laying out the app's UI:

Segue 이름을 입력Entering a Segue Name

Segue의 원본 역할을 하는 뷰 컨트롤러에서는 Segue를 실행 하 고 지정 된 뷰 컨트롤러를 표시 하기 전에 PrepareForSegue 메서드를 재정의 하 고 초기화를 수행 해야 합니다.In the View Controller that is acting as the source of the Segue, you should override the PrepareForSegue method and do any initialization required before the Segue is executed and the specified View Controller is displayed:

public override void PrepareForSegue (NSStoryboardSegue segue, NSObject sender)
{
    base.PrepareForSegue (segue, sender);

    // Take action based on Segue ID
    switch (segue.Identifier) {
    case "MyNamedSegue":
        // Prepare for the segue to happen
        ...
        break;
    }
}

필요에 따라 ShouldPerformSegue 메서드를 재정의 하 고 Segue 실제로 코드를 통해 C# 실행 되는지 여부를 제어할 수 있습니다.Optionally, you can override the ShouldPerformSegue method and control whether or not the Segue is actually executed via C# code. 수동으로 표시 된 뷰 컨트롤러의 경우 해당 DismissController 메서드를 호출 하 여 더 이상 필요 하지 않은 경우 표시에서 제거 합니다.For manually presented View Controllers, call their DismissController method to remove them from display when they are no longer needed.

사용자 지정 Segue 만들기Creating Custom Segues

앱에 macOS에 정의 된 Segue가 제공 하지 않는 Segue 형식이 필요한 경우가 있습니다.There might be times when your app requires a Segue type not provided by the build-in Segues defined in macOS. 이 경우 응용 프로그램의 UI를 레이아웃할 때 Xcode의 Interface Builder에 할당 될 수 있는 사용자 지정 Segue를 만들 수 있습니다.If this is the case, you can create a Custom Segue that can be assigned in Xcode's Interface Builder when laying out your app's UI.

예를 들어 새 창에서 대상 장면을 열지 않고 창 내에서 현재 뷰 컨트롤러를 대체 하는 새 Segue 형식을 만들려면 다음 코드를 사용할 수 있습니다.For example, to create a new Segue type that replaces the current View Controller inside a Window (instead of opening the target Scene in a new window), we can use the following code:

using System;
using AppKit;
using Foundation;

namespace OnCardMac
{
    [Register("ReplaceViewSeque")]
    public class ReplaceViewSeque : NSStoryboardSegue
    {
        #region Constructors
        public ReplaceViewSeque() {

        }

        public ReplaceViewSeque (string identifier, NSObject sourceController, NSObject destinationController) : base(identifier,sourceController,destinationController) {

        }

        public ReplaceViewSeque (IntPtr handle) : base(handle) {
        }

        public ReplaceViewSeque (NSObjectFlag x) : base(x) {
        }
        #endregion

        #region Override Methods
        public override void Perform ()
        {
            // Cast the source and destination controllers
            var source = SourceController as NSViewController;
            var destination = DestinationController as NSViewController;

            // Swap the controllers
            source.View.Window.ContentViewController = destination;

            // Release memory
            source.RemoveFromParentViewController ();
        }
        #endregion

    }
        
}

다음 몇 가지 사항을 참고 하세요.A couple of things to note here:

  • Register 특성을 사용 하 여이 클래스를 목표-C/macOS에 노출 합니다.We are using the Register attribute to expose this class to Objective-C/macOS.
  • Perform 메서드를 재정의 하 여 실제로 사용자 지정 Segue 작업을 수행 합니다.We are overriding the Perform method to actually perform the action of our custom Segue.
  • 창의 ContentViewController 컨트롤러를 Segue 대상 (대상)으로 정의 된 컨트롤러로 바꿉니다.We are replacing the Window's ContentViewController controller with the one defined by the target (destination) of the Segue.
  • RemoveFromParentViewController 메서드를 사용 하 여 메모리를 확보 하기 위해 원래 뷰 컨트롤러를 제거 하 고 있습니다.We are removing the original View Controller to free up memory using the RemoveFromParentViewController method.

Xcode의 Interface Builder에서이 새 Segue 형식을 사용 하려면 먼저 앱을 컴파일한 다음 Xcode로 전환 하 고 두 장면 사이에 새 Segue를 추가 해야 합니다.To use this new Segue type in Xcode's Interface Builder, we need to compile the app first, then switch to Xcode and add a new Segue between two scenes. 스타일custom 으로 설정 하 고 Segue 클래스ReplaceViewSegue (사용자 지정 Segue 클래스의 이름)로 설정 합니다.Set the Style to Custom and the Segue Class to ReplaceViewSegue (the name of our custom Segue class):

Segue 클래스설정Setting the Segue class

창 컨트롤러Window Controllers

Window 컨트롤러는 macOS 앱에서 만들 수 있는 다양 한 창 유형을 포함 하 고 제어 합니다.Window Controllers contain and control the different Window types that your macOS app can create. 스토리 보드의 경우 다음과 같은 기능이 있습니다.For Storyboards, they have the following features:

  1. 콘텐츠 뷰 컨트롤러를 제공 해야 합니다.They must provide a Content View Controller. 이는 자식 창에 있는 것과 동일한 콘텐츠 뷰 컨트롤러입니다.This will be the same Content View Controller that the child Window has.
  2. Storyboard 속성은 창 컨트롤러를 로드 한 Storyboard를 포함 하 고, 스토리 보드에서 로드 되지 않은 경우 null 합니다.The Storyboard property will contain the Storyboard that the Window Controller was loaded from, else null if not loaded from a Storyboard.
  3. DismissController 메서드를 호출 하 여 지정 된 창을 닫고 뷰에서 제거할 수 있습니다.You can call the DismissController method to close the given Window and remove it from view.

뷰 컨트롤러와 마찬가지로 Window 컨트롤러는 PerformSegue, PrepareForSegueShouldPerformSegue 메서드를 구현 하며 Segue 작업의 소스로 사용할 수 있습니다.Like View Controllers, Window Controllers implement the PerformSegue, PrepareForSegue and the ShouldPerformSegue methods and can be used as the source of a Segue operation.

Window 컨트롤러는 macOS 앱의 다음 기능을 담당 합니다.Window Controller are responsible for the following features of a macOS app:

  • 특정 창을 관리 합니다.They manage a specific Window.
  • 창의 제목 표시줄과 도구 모음을 관리 합니다 (사용 가능한 경우).They manage the Window's Title Bar and Toolbar (if available).
  • 콘텐츠 뷰 컨트롤러를 관리 하 여 창의 내용을 표시 합니다.They manage the Content View Controller to display the contents of the Window.

제스처 인식기Gesture Recognizers

MacOS에 대 한 제스처 인식기는 iOS의 해당 항목과 거의 같으며 개발자가 앱 UI의 요소에 제스처 (예: 마우스 단추 클릭)를 쉽게 추가할 수 있습니다.Gesture Recognizers for macOS are nearly identical to their counterparts in iOS and allow the developer to easily add gestures (such as clicking a mouse button) to elements in your app's UI.

그러나 iOS의 제스처가 앱의 디자인에 의해 결정 되는 경우 (예: 두 손가락으로 화면 누르기) macOS에서 대부분의 제스처는 하드웨어에 의해 결정 됩니다.However, where gestures in iOS are determined by the app's design (such as tapping the screen with two fingers), most gestures in macOS are determined by hardware.

제스처 인식기를 사용 하면 UI에서 항목에 사용자 지정 상호 작용을 추가 하는 데 필요한 코드의 양을 크게 줄일 수 있습니다.By using Gesture Recognizers, you can greatly reduce the amount of code required to add custom interactions to an item in the UI. 두 번 클릭과 단일 클릭 사이에 자동으로 결정 될 수 있으므로 이벤트 등을 클릭 하 고 끕니다.As they can automatically determine between double and single clicks, click and drag events, etc.

뷰 컨트롤러에서 MouseDown 이벤트를 재정의 하는 대신, Storyboard를 사용할 때 사용자 입력 이벤트를 처리 하기 위해 제스처 인식기를 사용 해야 합니다.Instead of overriding the MouseDown event in your View Controller, you should be using a Gesture Recognizer to handle the user input event when working with Storyboards.

MacOS에서 사용할 수 있는 제스처 인식기는 다음과 같습니다.The following Gesture Recognizers are available in macOS:

  • 마우스 누름 이벤트를 NSClickGestureRecognizer 등록 합니다.NSClickGestureRecognizer - Register mouse down and up events.
  • NSPanGestureRecognizer-마우스 단추를 아래로 등록 하 고 이벤트를 끌어서 놓습니다.NSPanGestureRecognizer - Registers mouse button down, drag and release events.
  • NSPressGestureRecognizer-지정 된 시간 이벤트에 대해 마우스 단추를 누른 상태로 등록 합니다.NSPressGestureRecognizer - Registers holding a mouse button down for a given amount of time event.
  • NSMagnificationGestureRecognizer-트랙 패드 하드웨어에서 확대 이벤트를 등록 합니다.NSMagnificationGestureRecognizer - Registers a magnification event from trackpad hardware.
  • NSRotationGestureRecognizer-트랙 패드 하드웨어에서 회전 이벤트를 등록 합니다.NSRotationGestureRecognizer - Registers a rotation event from trackpad hardware.

스토리 보드 참조 사용Using Storyboard References

스토리 보드 참조를 사용 하면 크고 복잡 한 Storyboard 디자인을 수행 하 여 원본에서 참조 하는 작은 Storyboard로 나눌 수 있으므로 복잡성을 제거 하 고 결과 개별 스토리 보드를 디자인 및 유지 관리 하기 쉽게 만들 수 있습니다.A Storyboard Reference allows you to take a large, complex Storyboard design and break it into smaller Storyboards that get referenced from the original, thus removing complexity and making the resulting individual Storyboards easier to design and maintain.

또한 Storyboard 참조는 동일한 Storyboard 내의 다른 장면에 앵커 를 제공 하거나 다른 장면에 특정 장면을 제공할 수 있습니다.Additionally, a Storyboard Reference can provide an anchor to another scene within the same Storyboard or a specific scene on a different one.

외부 Storyboard 참조Referencing an External Storyboard

외부 스토리 보드에 대 한 참조를 추가 하려면 다음을 수행 합니다.To add a reference to an external Storyboard, do the following:

  1. 솔루션 탐색기에서 프로젝트 이름을 마우스 오른쪽 단추로 클릭 하 고 추가 > 새 파일 ... > Mac > 스토리 보드를 선택 합니다.In the Solution Explorer, right-click on the Project Name and select Add > New File... > Mac > Storyboard. 새 스토리 보드의 이름을 입력 하 고 새로 만들기 단추를 클릭 합니다.Enter a Name for the new Storyboard and click the New button:

    새 스토리 보드를 추가Adding a new Storyboard

  2. 솔루션 탐색기에서 새 스토리 보드 이름을 두 번 클릭 하 여 Xcode의 Interface Builder에서 편집할 수 있도록 엽니다.In the Solution Explorer, double-click the new Storyboard name to open it for editing in Xcode's Interface Builder.

  3. 일반적인 방법으로 새 Storyboard의 배경 레이아웃을 디자인 하 고 변경 내용을 저장 합니다.Design the layout of the new Storyboard's scenes as you normally would and save your changes:

    인터페이스 디자인Designing the interface

  4. Interface Builder에 대 한 참조를 추가할 Storyboard로 전환 합니다.Switch to the Storyboard that you are going to be adding the reference to in the Interface Builder.

  5. 개체 라이브러리스토리 보드 참조 를 Design Surface 끌어 옵니다.Drag a Storyboard Reference from the Object Library onto the Design Surface:

    라이브러리에서 스토리 보드 참조를 선택Selecting a Storyboard Reference in the Library

  6. 특성 검사자에서 위에서 만든 Storyboard 의 이름을 선택 합니다.In the Attribute Inspector, select the name of the Storyboard that you created above:

    참조 구성Configuring the reference

  7. 기존 장면에서 UI 위젯 (예: 단추)을 클릭 하 고 방금 만든 스토리 보드 참조 에 새 Segue을 만듭니다.Control-click on a UI Widget (like a Button) on an existing Scene and create a new Segue to the Storyboard Reference that you just created. 팝업 메뉴에서 표시 를 선택 하 여 Segue를 완료 합니다.From the popup menu select Show to complete the Segue:

    Segue 형식을 설정 하는Setting the Segue type

  8. 스토리 보드에 변경 내용을 저장 합니다.Save your changes to the Storyboard.

  9. Mac용 Visual Studio로 돌아와서 변경 내용을 동기화 합니다.Return to Visual Studio for Mac to sync your changes.

앱이 실행 되 고 사용자가 Segue에서 만든 UI 요소를 클릭 하면 Storyboard 참조에 지정 된 외부 Storyboard의 초기 창 컨트롤러가 표시 됩니다.When the app is run and the user clicks on the UI element that you created the Segue from, the Initial Window Controller from the External Storyboard specified in the Storyboard Reference will be displayed.

외부 Storyboard의 특정 장면 참조Referencing a Specific Scene in an External Storyboard

초기 창 컨트롤러가 아닌 외부 Storyboard를 특정 장면에 추가 하려면 다음을 수행 합니다.To add a reference to a specific Scene an external Storyboard (and not the Initial Window Controller), do the following:

  1. 솔루션 탐색기에서 외부 스토리 보드를 두 번 클릭 하 여 Xcode의 Interface Builder에서 편집할 수 있도록 엽니다.In the Solution Explorer, double-click the external Storyboard to open it for editing in Xcode's Interface Builder.

  2. 새 장면을 추가 하 고 일반적으로 다음과 같이 레이아웃을 디자인 합니다.Add a new Scene and design its layout as you normally would:

    Xcode의 레이아웃디자인Designing the layout in Xcode

  3. Id 검사자에서 새 장면의 창 컨트롤러에 대 한 스토리 보드 ID 를 입력 합니다.In the Identity Inspector, enter a Storyboard ID for the new Scene's Window Controller:

    스토리 보드 ID 설정Setting the Storyboard ID

  4. Interface Builder에 대 한 참조를 추가할 스토리 보드를 엽니다.Open the Storyboard that you are going to be adding the reference to in Interface Builder.

  5. 개체 라이브러리스토리 보드 참조 를 Design Surface 끌어 옵니다.Drag a Storyboard Reference from the Object Library onto the Design Surface:

    라이브러리에서 스토리 보드 참조를 선택Selecting a Storyboard Reference from the Library

  6. Identity Inspector에서 위에서 만든 장면의 스토리 보드 이름 및 참조 ID (storyboard id)를 선택 합니다.In the Identity Inspector, select the name of the Storyboard and the Reference ID (Storyboard ID) of the Scene that you created above:

    참조 ID설정Setting the Reference ID

  7. 기존 장면에서 UI 위젯 (예: 단추)을 클릭 하 고 방금 만든 스토리 보드 참조 에 새 Segue을 만듭니다.Control-click on a UI Widget (like a Button) on an existing Scene and create a new Segue to the Storyboard Reference that you just created. 팝업 메뉴에서 표시 를 선택 하 여 Segue를 완료 합니다.From the popup menu select Show to complete the Segue:

    Segue 형식을 설정 하는Setting the Segue Type

  8. 스토리 보드에 변경 내용을 저장 합니다.Save your changes to the Storyboard.

  9. Mac용 Visual Studio로 돌아와서 변경 내용을 동기화 합니다.Return to Visual Studio for Mac to sync your changes.

앱이 실행 되 고 사용자가 Segue에서 만든 UI 요소를 클릭 하면 스토리 보드 참조에 지정 된 외부 Storyboard에서 지정 된 STORYBOARD ID 가 있는 장면이 표시 됩니다.When the app is run and the user clicks on the UI element that you created the Segue from, the Scene with the given Storyboard ID from the External Storyboard specified in the Storyboard Reference will be displayed.

동일한 Storyboard에서 특정 장면 참조Referencing a Specific Scene in the Same Storyboard

동일한 Storyboard에 특정 장면에 대 한 참조를 추가 하려면 다음을 수행 합니다.To add a reference to a specific Scene the same Storyboard, do the following:

  1. 솔루션 탐색기에서 스토리 보드를 두 번 클릭 하 여 편집용으로 엽니다.In the Solution Explorer, double-click the Storyboard to open it for editing.

  2. 새 장면을 추가 하 고 일반적으로 다음과 같이 레이아웃을 디자인 합니다.Add a new Scene and design its layout as you normally would:

    Xcode에서 스토리 보드 편집Editing the storyboard in Xcode

  3. Id 검사자에서 새 장면의 창 컨트롤러에 대 한 스토리 보드 ID 를 입력 합니다.In the Identity Inspector, enter a Storyboard ID for the new Scene's Window Controller:

    스토리 보드 ID 설정Setting the Storyboard ID

  4. 도구 상자스토리 보드 참조 를 Design Surface 끌어 옵니다.Drag a Storyboard Reference from the Toolbox onto the Design Surface:

    라이브러리에서 스토리 보드 참조를 선택Selecting a Storyboard Reference from the Library

  5. 특성 검사자에서 위에서 만든 장면의 참조 ID (Storyboard id)를 선택 합니다.In Attribute Inspector, select Reference ID (Storyboard ID) of the Scene that you created above:

    참조 ID설정Setting the Reference ID

  6. 기존 장면에서 UI 위젯 (예: 단추)을 클릭 하 고 방금 만든 스토리 보드 참조 에 새 Segue을 만듭니다.Control-click on a UI Widget (like a Button) on an existing Scene and create a new Segue to the Storyboard Reference that you just created. 팝업 메뉴에서 표시 를 선택 하 여 Segue를 완료 합니다.From the popup menu select Show to complete the Segue:

    Segue 유형을 선택 하Selecting the Segue Type

  7. 스토리 보드에 변경 내용을 저장 합니다.Save your changes to the Storyboard.

  8. Mac용 Visual Studio로 돌아와서 변경 내용을 동기화 합니다.Return to Visual Studio for Mac to sync your changes.

앱이 실행 되 고 사용자가 Segue를 만든 UI 요소를 클릭 하면 스토리 보드 참조에 지정 된 동일한 Storyboard에 지정 된 STORYBOARD ID 가 있는 장면이 표시 됩니다.When the app is run and the user clicks on the UI element that you created the Segue from, the Scene with the given Storyboard ID in the same Storyboard specified in the Storyboard Reference will be displayed.

복잡 한 Storyboard 예Complex Storyboard Example

Xamarin.ios 앱에서 Storyboard를 사용 하는 복잡 한 예는 Sourcewriter 샘플 앱을 참조 하세요.For a complex example of working with Storyboards in a Xamarin.Mac app, please see the SourceWriter Sample App. SourceWriter는 코드 완성 및 간단한 구문 강조 기능을 제공하는 간단한 소스 코드 편집기입니다.SourceWriter is a simple source code editor that provides support for code completion and simple syntax highlighting.

SourceWriter 코드는 완벽하게 주석 처리되어 있으며, 가능한 경우 Xamarin.Mac 지침 설명서에 핵심 기술 또는 메서드부터 관련 정보까지 다양한 링크가 제공됩니다.The SourceWriter code has been fully commented and, where available, links have be provided from key technologies or methods to relevant information in the Xamarin.Mac Guides Documentation.