Hello, tvOS 빠른 시작 가이드Hello, tvOS Quick Start Guide

이 가이드에서는 첫 번째 tvOS 앱 및 해당 개발 도구 체인를 만드는 과정을 안내 합니다. 또한 코드에 UI 컨트롤을 노출 하는 Xamarin 디자이너를 소개 하 고 tvOS 응용 프로그램을 빌드, 실행 및 테스트 하는 방법을 보여 줍니다.This guide walks through creating your first Xamarin.tvOS app and its development toolchain. It also introduces the Xamarin Designer, which exposes UI controls to code, and illustrates how to build, run, and test a Xamarin.tvOS application.

Apple은 tvOS 11을 실행 하는 apple tv 4K 인 apple TV의 5 세대를 출시 했습니다.Apple has released the 5th generation of the Apple TV, the Apple TV 4K, which runs tvOS 11.

Apple TV 플랫폼은 개발자에 게 열려 있어 풍부한 몰입 형 앱을 만들고 Apple TV의 기본 제공 앱 스토어를 통해 릴리스 합니다.The Apple TV platform is open to developers, allowing them to create rich, immersive apps and release them through the Apple TV's built-in App Store.

Xamarin.ios 개발에 익숙한 경우 tvOS 매우 간단한 전환을 찾아야 합니다.If you are familiar with Xamarin.iOS development, you should find the transition to tvOS fairly simple. 대부분의 Api와 기능은 동일 하지만 많은 공통 Api (예: WebKit)를 사용할 수 없습니다.Most of the APIs and features are the same, however, many common APIs are unavailable (such as WebKit). 또한 Siri 원격으로을 사용 하 여 작업 하는 경우 터치 스크린 기반 iOS 장치에는 없는 몇 가지 디자인 과제가 있습니다.Additionally, working with the with the Siri Remote poses some design challenges that are not present in touchscreen based iOS devices.

이 가이드에서는 Xamarin 앱에서 tvOS를 사용 하는 방법을 소개 합니다.This guide will give an introduction to working with tvOS in a Xamarin app. TvOS에 대 한 자세한 내용은 apple TV 4k 준비 설명서를 참조 하세요.For more information on tvOS, please see Apple's Get ready for Apple TV 4K documentation.

개요Overview

TvOS를 사용 하면 Swift (또는 객관적인 C) 및 Xcode에서 C# 개발할 때 사용 되는 것과 동일한 OS X 라이브러리 및 인터페이스 컨트롤을 사용 하 여 및 .net에서 완전 한 네이티브 Apple TV 앱을 개발할 수 있습니다.Xamarin.tvOS allows you to develop fully native Apple TV apps in C# and .NET using the same OS X libraries and interface controls that are used when developing in Swift (or Objective-C) and Xcode.

또한 tvOS 앱은 C# 및 .net으로 작성 되므로 일반적으로 백 엔드 코드를 Xamarin.ios, xamarin Android 및 xamarin.ios 앱과 공유할 수 있습니다. 모든 플랫폼에서 기본 환경을 제공 하는 동시에Additionally, since Xamarin.tvOS apps are written in C# and .NET, common, backend code can be shared with Xamarin.iOS, Xamarin.Android and Xamarin.Mac apps; all while delivering a native experience on each platform.

이 문서에서는 단추 클릭 횟수를 계산 하는 기본 Hello, tvOS 앱을 빌드하는 프로세스를 안내 하 여 TvOS 및 Visual Studio를 사용 하 여 Apple TV 앱을 만드는 데 필요한 주요 개념을 소개 합니다.This article will introduce you to the key concepts needed to create an Apple TV App using Xamarin.tvOS and Visual Studio by walking you through the process of building a basic Hello, tvOS app that counts the number of times a button has been clicked:

다음 개념을 다룹니다.We’ll cover the following concepts:

  • Mac용 Visual Studio – Mac용 Visual Studio를 소개 하 고이를 사용 하 여 tvOS 응용 프로그램을 만드는 방법을 소개 합니다.Visual Studio for Mac – Introduction to the Visual Studio for Mac and how to create Xamarin.tvOS applications with it.
  • TvOS 앱의 분석 – tvOS 앱이 구성 되는 항목입니다.Anatomy of a Xamarin.tvOS App – What a Xamarin.tvOS app consists of.
  • 사용자 인터페이스 만들기 –를 사용 하 여 사용자 인터페이스를 만드는 방법 Xamarin Designer for iOS 합니다.Creating a User Interface – How to use to Xamarin Designer for iOS to create a user interface.
  • 배포 및 테스트 – tvOS 시뮬레이터 및 실제 tvOS 하드웨어에서 앱을 실행 하 고 테스트 하는 방법을 설명 합니다.Deployment and Testing – How to run and test your app in the tvOS Simulator and on real tvOS hardware.

Mac용 Visual Studio에서 새 tvOS 앱을 시작 하는 중Starting a new Xamarin.tvOS App in Visual Studio for Mac

위에서 설명한 것 처럼 기본 화면에 단일 단추 및 레이블을 추가 하는 Hello-tvOS 이라는 Apple TV 앱을 만듭니다.As stated above, we’ll create an Apple TV app called Hello-tvOS that adds a single button and label to the main screen. 단추를 클릭하면 레이블에 단추 클릭 횟수가 표시됩니다.When the button is clicked, the label will display the number of times it has been clicked.

시작 하려면 다음을 수행 합니다.To get started, let's do the following:

  1. Mac용 Visual Studio 시작:Start Visual Studio for Mac:

  2. 화면의 왼쪽 위 모서리에 있는 새 솔루션 ... 링크를 클릭 하 여 새 프로젝트 대화 상자를 엽니다.Click on the New Solution... link in the upper left hand corner of the screen to open the New Project dialog box.

  3. TvOS > App > 단일 뷰 앱 을 선택 하 고 다음 단추를 클릭 합니다.Select tvOS > App > Single View App and click the Next button:

  4. 앱 이름에 대 한 Hello, tvOS를 입력 하 고 조직 식별자 를 입력 한 후 다음 단추를 클릭 합니다.Enter Hello, tvOS for the App Name, enter your Organization Identifier and click the Next button:

  5. 프로젝트 이름Hello_tvOS를 입력 하 고 만들기 단추를 클릭 합니다.Enter Hello_tvOS for the Project Name and click the Create button:

Mac용 Visual Studio는 새 tvOS 앱을 만들고 응용 프로그램의 솔루션에 추가 되는 기본 파일을 표시 합니다.Visual Studio for Mac will create the new Xamarin.tvOS app and display the default files that get added to your application's solution:

Mac용 Visual Studio는 Visual Studio와 정확히 동일한 방식으로 솔루션과 프로젝트를 사용 합니다.Visual Studio for Mac uses Solutions and Projects, in the exact same way that Visual Studio does. 솔루션은 하나 이상의 프로젝트를 포함할 수 있는 컨테이너입니다. 프로젝트에는 응용 프로그램, 지원 라이브러리, 테스트 응용 프로그램 등이 포함 될 수 있습니다. 이 경우 Mac용 Visual Studio는 솔루션 및 응용 프로그램 프로젝트를 모두 만들었습니다.A solution is a container that can hold one or more projects; projects can include applications, supporting libraries, test applications, etc. In this case, Visual Studio for Mac has created both a solution and an application project for you.

원하는 경우 공통 된 공유 코드를 포함 하는 하나 이상의 코드 라이브러리 프로젝트를 만들 수 있습니다.If you wanted to, you could create one or more code library projects that contain common, shared code. 이러한 라이브러리 프로젝트는 표준 .NET 응용 프로그램을 빌드하는 경우와 마찬가지로 응용 프로그램 프로젝트에서 사용 하거나 다른 tvOS 앱 프로젝트 (또는 코드 형식에 따라 xamarin.ios, Xamarin.ios 및 Xamarin.ios)와 공유할 수 있습니다.These library projects can be consumed by the application project or shared with other Xamarin.tvOS app projects (or Xamarin.iOS, Xamarin.Android and Xamarin.Mac based on the type of code), just as you would if you were building a standard .NET application.

TvOS 앱의 분석Anatomy of a Xamarin.tvOS App

IOS 프로그래밍에 익숙한 경우 여기에서 많은 유사성을 확인할 수 있습니다.If you’re familiar with iOS programming, you’ll notice a lot of similarities here. 실제로 tvOS 9는 iOS 9의 하위 집합 이므로, 여기에서는 많은 개념이 함께 진행 됩니다.In fact, tvOS 9 is a subset of iOS 9, so a lot of concepts will cross over here.

프로젝트의 파일을 살펴보겠습니다.Let’s take a look at the files in the project:

  • Main.cs - 앱의 진입점을 포함합니다.Main.cs – This contains the main entry point of the app. 앱이 실행되면 첫 번째 클래스와 실행되는 메서드를 포함합니다.When the app is launched, this contains the very first class and method that is run.
  • AppDelegate.cs –이 파일에는 운영 체제에서 이벤트를 수신 하는 기본 응용 프로그램 클래스가 포함 됩니다.AppDelegate.cs – This file contains the main application class that is responsible for listening to events from the operating system.
  • Info.plist –이 파일에는 응용 프로그램 이름, 아이콘 등의 응용 프로그램 속성이 포함 됩니다.Info.plist – This file contains application properties such as the application name, icons, etc.
  • ViewController.cs – 주 창을 나타내며이 클래스의 수명 주기를 제어 하는 클래스입니다.ViewController.cs – This is the class that represents the main window and controls the lifecycle of it.
  • ViewController.designer.cs –이 파일은 주 화면의 사용자 인터페이스와 통합 하는 데 도움이 되는 배관 코드를 포함 합니다.ViewController.designer.cs – This file contains plumbing code that helps you integrate with the main screen’s user interface.
  • Main.storyboard – 주 창에 대 한 UI입니다.Main.storyboard – The UI for the main window. 이 파일은 Xamarin Designer for iOS에서 만들고 유지 관리할 수 있습니다.This file can be created and maintained by the Xamarin Designer for iOS.

다음 섹션에서는 이러한 파일 중 일부를 간략히 살펴보겠습니다.In the following sections, we'll take a quick look through some of these files. 나중에 더 자세히 살펴볼 것 이지만, 이제 기본 사항을 이해 하는 것이 좋습니다.We’ll explore them in more detail later, but it’s a good idea to understand their basics now.

Main.csMain.cs

Main.cs 파일에는 새 tvOS 앱 인스턴스를 만들고 OS 이벤트를 처리 하는 클래스의 이름 (이 경우에는 AppDelegate 클래스)을 전달 하는 정적 Main 메서드가 포함 되어 있습니다.The Main.cs file contains a static Main method which creates a new Xamarin.tvOS app instance and passes the name of the class that will handle OS events, which in our case is the AppDelegate class:

using UIKit;

namespace Hello_tvOS
{
    public class Application
    {
        // This is the main entry point of the application.
        static void Main (string[] args)
        {
            // if you want to use a different Application Delegate class from "AppDelegate"
            // you can specify it here.
            UIApplication.Main (args, null, "AppDelegate");
        }
    }
}

AppDelegate.csAppDelegate.cs

AppDelegate.cs 파일에는 창을 만들고 OS 이벤트를 수신 하는 AppDelegate 클래스가 포함 되어 있습니다.The AppDelegate.cs file contains our AppDelegate class, which is responsible for creating our window and listening to OS events:

using Foundation;
using UIKit;

namespace Hello_tvOS
{
    // The UIApplicationDelegate for the application. This class is responsible for launching the
    // User Interface of the application, as well as listening (and optionally responding) to application events from iOS.
    [Register ("AppDelegate")]
    public class AppDelegate : UIApplicationDelegate
    {
        // class-level declarations

        public override UIWindow Window {
            get;
            set;
        }

        public override bool FinishedLaunching (UIApplication application, NSDictionary launchOptions)
        {
            // Override point for customization after application launch.
            // If not required for your application you can safely delete this method

            return true;
        }

        public override void OnResignActivation (UIApplication application)
        {
            // Invoked when the application is about to move from active to inactive state.
            // This can occur for certain types of temporary interruptions (such as an incoming phone call or SMS message)
            // or when the user quits the application and it begins the transition to the background state.
            // Games should use this method to pause the game.
        }

        public override void DidEnterBackground (UIApplication application)
        {
            // Use this method to release shared resources, save user data, invalidate timers and store the application state.
            // If your application supports background execution this method is called instead of WillTerminate when the user quits.
        }

        public override void WillEnterForeground (UIApplication application)
        {
            // Called as part of the transition from background to active state.
            // Here you can undo many of the changes made on entering the background.
        }

        public override void OnActivated (UIApplication application)
        {
            // Restart any tasks that were paused (or not yet started) while the application was inactive.
            // If the application was previously in the background, optionally refresh the user interface.
        }

        public override void WillTerminate (UIApplication application)
        {
            // Called when the application is about to terminate. Save data, if needed. See also DidEnterBackground.
        }
    }
}

이 코드는 이전에 iOS 응용 프로그램을 빌드하지 않은 경우에 익숙하지 않을 수 있지만 매우 간단 합니다.This code is probably unfamiliar unless you’ve built an iOS application before, but it’s fairly straightforward. 중요 한 줄을 살펴보겠습니다.Let’s examine the important lines.

먼저, 클래스 수준 변수 선언을 살펴보겠습니다.First, let’s take a look at the class-level variable declaration:

public override UIWindow Window {
            get;
            set;
        }

Window 속성은 주 창에 대 한 액세스를 제공 합니다.The Window property provides access to the main window. tvOS는 MVC ( 모델 뷰 컨트롤러 ) 패턴 이라고 하는 기능을 사용 합니다.tvOS uses what’s known as the Model View Controller (MVC) pattern. 일반적으로 사용자가 만드는 모든 창 (그리고 windows 내의 다른 많은 항목)에 대해 창 수명 주기를 담당 하는 컨트롤러가 있습니다. 예를 들어, 창에 새 보기 (컨트롤)를 추가 하 여이를 표시 합니다.Generally, for every window you create (and for many other things within windows), there is a controller, which is responsible for the window’s life cycle, such as showing it, adding new views (controls) to it, etc.

다음으로 FinishedLaunching 메서드가 있습니다.Next, we have the FinishedLaunching method. 이 메서드는 응용 프로그램을 인스턴스화한 후에 실행 되며 실제로 응용 프로그램 창을 만들고 여기에 뷰를 표시 하는 프로세스를 시작 합니다.This method runs after the application has been instantiated, and it’s responsible for actually creating the application window and beginning the process of displaying the view in it. 앱에서 Storyboard를 사용 하 여 UI를 정의 하므로 여기에는 추가 코드가 필요 하지 않습니다.Because our app uses a Storyboard to define its UI, no additional code is required here.

템플릿에는 DidEnterBackgroundWillEnterForeground와 같이 제공 되는 다른 여러 메서드가 있습니다.There are many other methods that are provided in the template such as DidEnterBackground and WillEnterForeground. 응용 프로그램 이벤트를 앱에서 사용 하지 않는 경우 안전 하 게 제거할 수 있습니다.These can be safely removed if the application events are not being used in your app.

ViewController.csViewController.cs

ViewController 클래스는 기본 창의 컨트롤러입니다.The ViewController class is our main window’s controller. 즉, 주 창의 수명 주기를 담당 합니다.That means it’s responsible for the lifecycle of the main window. 이에 대해서는 나중에 자세히 살펴보겠습니다. 이제 간단히 살펴보겠습니다.We’re going to examine this in detail later, for now let's just take a quick look at it:

using System;
using Foundation;
using UIKit;

namespace Hello_tvOS
{
    public partial class ViewController : UIViewController
    {
        public ViewController (IntPtr handle) : base (handle)
        {
        }

        public override void ViewDidLoad ()
        {
            base.ViewDidLoad ();
            // Perform any additional setup after loading the view, typically from a nib.
        }

        public override void DidReceiveMemoryWarning ()
        {
            base.DidReceiveMemoryWarning ();
            // Release any cached data, images, etc that aren't in use.
        }
    }
}

ViewController.Designer.csViewController.Designer.cs

주 창 클래스의 디자이너 파일은 현재 비어 있지만 iOS 디자이너로 사용자 인터페이스를 만들 때 Mac용 Visual Studio에 의해 자동으로 채워집니다.The designer file for the Main Window class is empty right now, but it will be automatically populated by Visual Studio for Mac as we create our User Interface with the iOS Designer:

using Foundation;

namespace HellotvOS
{
    [Register ("ViewController")]
    partial class ViewController
    {
        void ReleaseDesignerOutlets ()
        {
        }
    }
}

일반적으로 디자이너 파일은 Mac용 Visual Studio에 의해 자동으로 관리 되므로 응용 프로그램에서 창이 나 보기에 추가 하는 컨트롤에 대 한 액세스를 허용 하는 필수 배관 코드를 제공 하는 것이 일반적입니다.We aren’t usually concerned with designer files, as they’re just automatically managed by Visual Studio for Mac and just provide the requisite plumbing code that allows access to controls that we add to any window or view in our application.

TvOS 앱을 만들고 해당 구성 요소에 대 한 기본적인 이해를 했으므로 UI를 만드는 방법을 살펴보겠습니다.Now that we have created our Xamarin.tvOS app and we have a basic understanding of its components, let’s look at creating the UI.

사용자 인터페이스 만들기Creating the User Interface

Xamarin Designer for iOS를 사용 하 여 tvOS 앱에 대 한 사용자 인터페이스를 만들 필요가 없습니다. 코드에서 C# 직접 UI를 만들 수 있지만이 문서에서는 다루지 않습니다.You don't have to use Xamarin Designer for iOS to create the User Interface for your Xamarin.tvOS app, the UI can be created directly from C# code but that is beyond the scope of this article. 간단히 하기 위해이 자습서의 나머지 부분 전체에서 iOS Designer를 사용 하 여 UI를 만듭니다.For the sake of simplicity, we'll be using the iOS Designer to create our UI throughout the rest of this tutorial.

UI 만들기를 시작 하려면 솔루션 탐색기 에서 Main.storyboard 파일을 두 번 클릭 하 여 iOS 디자이너에서 편집할 수 있도록 엽니다.To start creating your UI, let's double-click the Main.storyboard file in the Solution Explorer to open it for editing in the iOS Designer:

그러면 디자이너가 시작 되 고 다음과 같이 표시 됩니다.This should launch the Designer and look like the following:

IOS Designer 및 작동 방식에 대 한 자세한 내용은 Xamarin Designer for iOS 가이드 소개 를 참조 하세요.For more information on the iOS Designer and how it works, refer to the Introduction to the Xamarin Designer for iOS guide.

이제 tvOS 앱의 디자인 화면에 컨트롤을 추가 하기 시작할 수 있습니다.We can now start adding controls to the design surface of our Xamarin.tvOS app.

다음을 수행합니다.Do the following:

  1. 디자인 화면 오른쪽에 있는 도구 상자를 찾습니다.Locate the Toolbox, which should be to the right of the design surface:

    여기에서 찾을 수 없는 경우 보기 > 패드 > 도구 상자 로 이동 하 여 봅니다.If you can't locate it here, browse to View > Pads > Toolbox to view it.

  2. 도구 상자 에서 디자인 화면으로 레이블을 끌어 옵니다.Drag a Label from the Toolbox to the design surface:

  3. 속성 패드 에서 title 속성을 클릭 하 고 단추 제목을 Hello, tvOS로 변경 하 고 글꼴 크기 를 128으로 설정 합니다.Click on the Title property in the Property pad and change the button's title to Hello, tvOS and set the Font Size to 128:

  4. 모든 단어가 표시 되도록 레이블의 크기를 조정 하 고 창 위쪽의 가운데에 배치 합니다.Resize the label so that all of the words are visible and place it centered near the top of the window:

  5. 이제 레이블이 의도 한 대로 표시 되도록 해당 위치에 대 한 제약을 받아야 합니다.The label will now need to be constrained to it's position, so that it appears as intended. 화면 크기에 관계 없이regardless of screen size. 이렇게 하려면 T 모양 핸들이 표시 될 때까지 레이블을 클릭 합니다.To do this, click on the label until the T-shaped handle appears:

  6. 레이블을 가로로 제한 하려면 가운데 사각형을 선택 하 고 세로 파선으로 끕니다.To constrain the label horizontally, select the center square and drag it to the vertically dashed line:

    레이블에 주황색을 설정 해야 합니다.The label should turn orange.

  7. 레이블 위쪽에서 T 핸들을 선택 하 고 창의 위쪽 가장자리로 끕니다.Select the T handle at the top of the label, and drag it to the top edge of the window:

  8. 그런 다음 아래 그림과 같이 너비와 높이 뼈 핸들 을 차례로 클릭 합니다.Next, click the width and then the height bone handle as illustrated below:

    뼈 핸들 을 클릭 하면 너비와 높이를 각각 선택 하 여 고정 된 차원을 설정 합니다.When each bone handle is clicked, select both Width and Height respectively to set fixed dimensions.

  9. 완료 되 면 제약 조건은 속성 패드의 레이아웃 탭에 있는 것과 유사 하 게 표시 됩니다.When completed, your Constraints should look similar to those in the Layout tab of the Properties pad:

  10. 도구 상자 에서 단추 를 끌어 레이블 아래에 놓습니다.Drag a Button from the Toolbox and place it under the Label.

  11. 속성 패드 에서 title 속성을 클릭 하 고 단추 제목을 Click Me로 변경 합니다.Click on the Title property in the Property pad and change the button's title to Click Me:

  12. 위의 5 ~ 8 단계를 반복 하 여 tvOS 창에서 단추를 제한 합니다.Repeat steps 5 to 8 above to constrain the button in the tvOS window. 그러나 #7 단계에서와 같이 T 핸들을 창의 맨 위로 끄는 대신 레이블 맨 아래로 끌어 옵니다.However, instead of dragging the T-handle to the top of the window (as in step #7), drag it to the bottom of the label:

  13. 단추 아래에 있는 다른 레이블을 끌어서 첫 번째 레이블과 같은 너비로 크기를 조정 하 고 가운데 맞춤 을 설정 합니다.Drag another label under the button, size it to be the same width as the first label and set its Alignment to Center:

  14. 첫 번째 레이블 및 단추와 마찬가지로이 레이블을 가운데로 설정 하 고 위치 및 크기에 고정 합니다.Like the first label and button, set this label to center and pin it into location and size:

  15. 사용자 인터페이스에 대 한 변경 내용을 저장 합니다.Save your changes to the User Interface.

컨트롤의 크기를 조정 하 고 이동 하는 동안에는 디자이너가 APPLE TV 휴먼 인터페이스 지침을 기반으로 하는 유용한 맞춤 힌트를 제공 하는 것을 알 수 있습니다.As you were resizing and moving controls around, you should have noticed that the designer gives you helpful snap hints that are based on Apple TV Human Interface Guidelines. 이러한 지침은 Apple TV 사용자에 게 친숙 한 모양과 느낌을 주는 고품질 응용 프로그램을 만드는 데 도움이 됩니다.These guidelines will help you create high quality applications that will have a familiar look and feel for Apple TV users.

문서 개요 섹션에 표시 되는 경우 사용자 인터페이스를 구성 하는 요소의 레이아웃과 계층이 표시 되는 방식을 확인 합니다.If you look in the Document Outline section, notice how the layout and hierarchy of the elements that make up our user Interface are shown:

여기에서 필요에 따라 편집 하거나 끌 항목을 선택 하 여 UI 요소를 다시 정렬할 수 있습니다.From here you can select items to edit or drag to reorder UI elements if needed. 예를 들어 다른 요소에서 UI 요소를 검사 하는 경우이 요소를 목록의 맨 아래로 끌어 창에서 맨 위 항목으로 만들 수 있습니다.For example, if a UI element was being covered by another element, you could drag it to the bottom of the list to make it the top-most item on the window.

이제 사용자 인터페이스를 만들었으므로 tvOS에서 코드를 C# 사용 하 여 액세스 하 고 상호 작용할 수 있도록 UI 항목을 노출 해야 합니다.Now that we have our User Interface created, we need to expose the UI items so that Xamarin.tvOS can access and interact with them in C# code.

코드 숨김으로 컨트롤에 액세스Accessing the controls in the code behind

IOS 디자이너에서 코드를 통해 추가 된 컨트롤에 액세스 하는 두 가지 주요 방법이 있습니다.There are two main ways to access the controls that you have added in the iOS designer from code:

  • 컨트롤에 이벤트 처리기를 만듭니다.Creating an event handler on a control.
  • 나중에 참조할 수 있도록 컨트롤의 이름을 지정 합니다.Giving the control a name, so that we can later reference it.

둘 중 하나가 추가 되 면 변경 내용을 반영 하도록 ViewController.designer.cs 내의 partial 클래스가 업데이트 됩니다.When either of these are added, the partial class within the ViewController.designer.cs will be updated to reflect the changes. 이를 통해 뷰 컨트롤러의 컨트롤에 액세스할 수 있습니다.This will allow you to then access the controls in the View Controller.

이벤트 처리기 만들기Creating an event handler

이 샘플 응용 프로그램에서는 단추를 클릭할 때 발생 하는 것을 원하지 않으므로 단추의 특정 이벤트에 이벤트 처리기를 추가 해야 합니다.In this sample application, when the button is clicked we want something to happen, so an event handler needs to be added to a specific event on the button. 이를 설정 하려면 다음을 수행 합니다.To set this up, do the following:

  1. Xamarin iOS 디자이너에서 보기 컨트롤러의 단추를 선택 합니다.In the Xamarin iOS Designer, select the button on the View Controller.

  2. 속성 패드에서 이벤트 탭을 선택 합니다.In the Properties pad, select the Events tab:

  3. TouchUpInside 이벤트를 찾아 Clicked이라는 이벤트 처리기를 제공 합니다.Locate the TouchUpInside event, and give it an event handler named Clicked:

  4. Enter키를 누르면 코드에서 이벤트 처리기에 대 한 위치를 제안 하는 viewcontroller.cs 파일이 열립니다.When you press Enter, the ViewController.cs file will open, suggesting locations for your event handler in code. 키보드의 화살표 키를 사용 하 여 위치를 설정 합니다.Use the arrow keys on your keyboard to set the location:

  5. 이렇게 하면 아래와 같이 부분 메서드를 만듭니다.This will create a partial method as shown below:

이제 단추를 사용할 수 있는 일부 코드를 추가 하기 시작할 준비가 되었습니다.We are now ready to start adding some code to allow the button to function.

컨트롤 이름 지정Naming a control

단추를 클릭 하면 클릭 횟수에 따라 레이블이 업데이트 됩니다.When the button is clicked, the label should update based on the number of clicks. 이렇게 하려면 코드에서 레이블에 액세스 해야 합니다.To do this, we will need to access the label in code. 이름을 지정 하 여이 작업을 수행 합니다.This is done by giving it a name. 다음을 수행합니다.Do the following:

  1. 스토리 보드를 열고 보기 컨트롤러의 맨 아래에 있는 레이블을 선택 합니다.Open the Storyboard, and select the Label at the bottom of the View Controller.

  2. 속성 패드에서 위젯 탭을 선택 합니다.In the Properties pad, select the Widget tab:

  3. Id > 이름아래에서 ClickedLabel를 추가 합니다.Under Identity > Name, add ClickedLabel:

이제 레이블 업데이트를 시작할 준비가 되었습니다.We are now ready to start updating the label!

컨트롤에 액세스 하는 방법How controls are accessed

솔루션 탐색기 에서 ViewController.designer.cs를 선택 하는 경우 ClickedLabel 레이블 및 Clicked 이벤트 처리기가의 C# 콘센트동작 에 매핑되는 방법을 확인할 수 있습니다.If you select the ViewController.designer.cs in the Solution Explorer you'll be able to see how the ClickedLabel label and the Clicked event handler have been mapped to an Outlet and Action in C#:

ViewController.designer.cs partial 클래스 이므로 Mac용 Visual Studio는 클래스에 대 한 모든 변경 내용을 덮어쓰는 ViewController.cs를 수정할 필요가 없습니다.You may also notice that ViewController.designer.cs is a partial class, so that Visual Studio for Mac doesn't have to modify ViewController.cs which would overwrite any changes that we have made to the class.

이러한 방식으로 UI 요소를 노출 하면 뷰 컨트롤러에서 UI 요소에 액세스할 수 있습니다.Exposing the UI elements in this way, allows you to access them in the View Controller.

일반적으로 ViewController.designer.cs를 직접 열 필요가 없습니다. 여기에는 교육용 으로만 제공 됩니다.You normally will never need to open the ViewController.designer.cs yourself, it was presented here for educational purposes only.

코드 작성Writing the Code

사용자 인터페이스를 만들고, 해당 UI 요소가 콘센트작업을 통해 코드에 노출 되 면 프로그램 기능을 제공 하는 코드를 작성할 준비가 된 것입니다.With our User Interface created and its UI elements exposed to code via Outlets and Actions, we are finally ready to write the code to give the program functionality.

응용 프로그램에서 첫 번째 단추를 클릭할 때마다 단추를 클릭 한 횟수를 표시 하는 레이블을 업데이트할 예정입니다.In our application, every time the first button is clicked, we’re going to update our label to show how many times the button has been clicked. 이렇게 하려면 Solution Pad에서 ViewController.cs 파일을 두 번 클릭 하 여 편집 해야 합니다.To accomplish this, we need to open the ViewController.cs file for editing by double-clicking it in the Solution Pad:

먼저, ViewController 클래스에서 클래스 수준 변수를 만들어 발생 한 클릭 수를 추적 해야 합니다.First, we need to create a class-level variable in our ViewController class to track the number of clicks that have happened. 클래스 정의를 편집하고 다음과 비슷하게 만듭니다.Edit the class definition and make it look like the following:

using System;
using Foundation;
using UIKit;

namespace Hello_tvOS
{
    public partial class ViewController : UIViewController
    {
        private int numberOfTimesClicked = 0;
        ...

그런 다음 동일한 클래스 (ViewController)에서 ViewDidLoad 메서드를 재정의 하 고 레이블에 대 한 초기 메시지를 설정 하는 코드를 추가 해야 합니다.Next, in the same class (ViewController), we need to override the ViewDidLoad method and add some code to set the initial message for our label:

public override void ViewDidLoad ()
{
    base.ViewDidLoad ();

    // Set the initial value for the label
    ClickedLabel.Text = "Button has not been clicked yet.";
}

OS가 .storyboard 파일에서 사용자 인터페이스를 로드 하 고 인스턴스화한 ViewDidLoad가 호출 되기 때문에 Initialize같은 다른 방법 대신 ViewDidLoad를 사용 해야 합니다.We need to use ViewDidLoad, instead of another method such as Initialize, because ViewDidLoad is called after the OS has loaded and instantiated the User Interface from the .storyboard file. .storyboard 파일이 완전히 로드 되어 인스턴스화되기 전에 레이블 컨트롤에 액세스 하려고 하면 레이블 컨트롤이 아직 만들어지지 않았기 때문에 NullReferenceException 오류가 발생 합니다.If we tried to access the label control before the .storyboard file has been fully loaded and instantiated, we’d get a NullReferenceException error because the label control would not be created yet.

다음으로 단추를 클릭 하 여 사용자에 게 응답 하는 코드를 추가 해야 합니다.Next, we need to add the code to respond to the user clicking the button. 만든 partial 클래스에 다음을 추가 합니다.Add the following to partial class to that we created:

partial void Clicked (UIButton sender)
{
    ClickedLabel.Text = string.Format("The button has been clicked {0} time{1}.", ++numberOfTimesClicked, (numberOfTimesClicked

이 코드는 사용자가 단추를 클릭할 때마다 호출 됩니다.This code will be called any time the user clicks our button.

모든 것이 준비 되었으므로 이제 tvOS 응용 프로그램을 빌드하고 테스트할 준비가 되었습니다.With everything in place, we are now ready to build and test our Xamarin.tvOS application.

애플리케이션 테스트Testing the Application

응용 프로그램을 빌드하고 실행 하 여 예상 대로 실행 되는지 확인 해야 합니다.It’s time to build and run our application to make sure it runs as expected. 모든 단계를 한 번에 빌드하고 실행 하거나 실행 하지 않고 빌드할 수 있습니다.We can build and run all in one step, or we can build it without running it.

응용 프로그램을 빌드할 때마다 원하는 빌드 종류를 선택할 수 있습니다.Whenever we build an application, we can choose what kind of build we want:

  • 디버그 – 디버그 빌드는 응용 프로그램이 실행 되는 동안 발생 하는 상황을 디버그할 수 있도록 하는 추가 메타 데이터를 포함 하는 ' ' (응용 프로그램) 파일로 컴파일됩니다.Debug – A debug build is compiled into an `` (application) file with extra metadata that allows us to debug what’s happening while the application is running.
  • 릴리스 – 릴리스 빌드는 ' ' 파일도 만들지만 디버그 정보를 포함 하지 않으므로 더 작고 더 빠르게 실행 됩니다.Release – A release build also creates an `` file, but it doesn’t include debug information, so it’s smaller and executes faster.

Mac용 Visual Studio 화면의 왼쪽 위 모서리에 있는 구성 선택기에서 빌드 유형을 선택할 수 있습니다.You can select the type of build from the Configuration Selector at the upper left hand corner of the Visual Studio for Mac screen:

애플리케이션 빌드Building the Application

이 경우 디버그 빌드를 원하는 것 이므로 디버그 가 선택 되어 있는지 확인 합니다.In our case, we just want a debug build, so let’s make sure that Debug is selected. 먼저 ⌘ B를 누르거나 빌드 메뉴에서 모두 빌드를 선택 하 여 응용 프로그램을 빌드 해 보겠습니다.Let's build our application first by either pressing ⌘B, or from the Build menu, choose Build All.

오류가 발생 하지 않으면 Mac용 Visual Studio의 상태 표시줄에 빌드 성공 메시지가 표시 됩니다.If there weren't any errors, you’ll see a Build Succeeded message in Visual Studio for Mac's status bar. 오류가 있는 경우 프로젝트를 검토 하 고 단계를 올바르게 수행 했는지 확인 합니다.If there were errors, review your project and make sure that you’ve followed the steps correctly. 먼저 코드 (Xcode 및 Mac용 Visual Studio)가 자습서의 코드와 일치 하는지 확인 합니다.Start by confirming that your code (both in Xcode and in Visual Studio for Mac) matches the code in the tutorial.

애플리케이션 실행Running the Application

응용 프로그램을 실행 하려면 다음 세 가지 옵션을 사용할 수 있습니다.To run the application, we have three options:

  • ⌘ + Enter를 누릅니다.Press ⌘+Enter.
  • 실행 메뉴에서 디버그를 선택합니다.From the Run menu, choose Debug.
  • Mac용 Visual Studio 도구 모음에서 재생 단추를 클릭합니다(솔루션 탐색기 바로 위에 있음).Click the Play button in the Visual Studio for Mac toolbar (just above the Solution Explorer).

응용 프로그램이 빌드되고 (아직 빌드되지 않은 경우), 디버그 모드에서 시작 되 면 tvOS 시뮬레이터가 시작 되 고 앱이 시작 되 고 기본 인터페이스 창이 표시 됩니다.The application will build (if it hasn’t been built already), start in debug mode, the tvOS Simulator will start and the app will launch and display it's main interface window:

샘플 앱 홈 화면The sample app home screen

하드웨어 메뉴에서 시뮬레이터를 제어할 수 있도록 Apple TV 원격 표시 를 선택 합니다.From the Hardware menu select Show Apple TV Remote so you can control the simulator.

시뮬레이터의 원격을 사용 하 여 단추를 몇 번 클릭 하면 레이블이 다음 개수로 업데이트 됩니다.Using the Simulator's remote, if you click the button a few times the label should be updated with the count:

지금까지Congratulations! 여기에서는 많은 사항을 설명 했지만이 자습서를 처음부터 끝까지 수행한 경우 tvOS 앱의 구성 요소와 이러한 구성 요소를 만드는 데 사용 되는 도구에 대해 확실 하 게 이해 해야 합니다.We covered a lot of ground here, but if you followed this tutorial from start to finish, you should now have a solid understanding of the components of a Xamarin.tvOS app as well as the tools used to create them.

다음 위치Where to Next?

Apple TV 앱을 개발 하는 경우 사용자와 인터페이스 간의 연결 끊기 (사용자의 손을 사용 하지 않는 공간에 있음)와 앱 크기 및 저장소에 대 한 제한 tvOS 때문에 몇 가지 문제를 해결할 수 있습니다.Developing Apple TV apps presents a few challenges because of the disconnect between the user and the interface (it's across the room not in the user's hand) and the limitations tvOS places on app size and storage.

결과적으로 tvOS 앱의 디자인으로 이동 하기 전에 다음 문서를 읽을 것을 적극 권장 합니다.As a result, we highly suggest that your read the following documents before jumping into a Xamarin.tvOS app's design:

  • TvOS 9 소개 -이 문서에서는 tvOS 9의 tvOS 개발자에 게 제공 되는 새로운 api 및 수정 된 api 및 기능을 소개 합니다.Introduction to tvOS 9 – This article introduces all of the new and modified APIs and features available in tvOS 9 for Xamarin.tvOS developers.
  • 탐색 및 포커스 작업 -tvOS 앱의 사용자는 장치 화면에서 이미지를 탭 하지만 Siri 원격을 사용 하 여 대화방에서 간접적으로 사용 하는 iOS와 마찬가지로이 인터페이스와 직접 상호 작용 하지 않습니다.Working with Navigation and Focus – Users of your Xamarin.tvOS app will not be interacting with it's interface directly as with iOS where they tap images on the device's screen, but indirectly from across the room using the Siri Remote. 이 문서에서는 tvOS 앱의 사용자 인터페이스에서 탐색을 처리 하는 데 중점의 개념과이를 사용 하는 방법을 설명 합니다.This article covers the concept of Focus and how it is used to handle Navigation in a Xamarin.tvOS app's User Interface.
  • Siri 원격 및 Bluetooth 컨트롤러 – 사용자가 Apple TV와 상호 작용 하는 기본 방법인 tvOS 앱은 포함 된 Siri 원격을 통해 진행 됩니다.Siri Remote and Bluetooth Controllers – The main way that users will be interacting with the Apple TV, and your Xamarin.tvOS app, is through the included Siri Remote. 앱이 게임 인 경우에는 앱에서 iOS (MFI) Bluetooth 게임 컨트롤러에 대해 만든 타사에 대 한 지원을 선택적으로 빌드할 수 있습니다.If your app is a game, you can optionally build in support for 3rd party, Made For iOS (MFI) Bluetooth Game Controllers in your app as well. 이 문서에서는 tvOS 앱에서 새 Siri 원격 및 Bluetooth 게임 컨트롤러를 지 원하는 방법을 설명 합니다.This article covers supporting the new Siri Remote and Bluetooth game controllers in your Xamarin.tvOS apps.
  • 리소스 및 데이터 저장소 – iOS 장치와 달리 새로운 Apple TV는 tvOS apps에 대 한 영구 로컬 저장소를 제공 하지 않습니다.Resources and Data Storage – Unlike iOS devices, the new Apple TV does not provide persistent, local storage for tvOS apps. 결과적으로 tvOS 앱이 정보 (예: 사용자 기본 설정)를 유지 해야 하는 경우 iCloud에서 해당 데이터를 저장 하 고 검색 해야 합니다.As a result, if your Xamarin.tvOS app needs to persist information (such as user preferences) it must store and retrieve that data from iCloud. 이 문서에서는 tvOS 앱에서 리소스 및 영구 데이터 저장소를 사용 하는 방법을 설명 합니다.This article covers working with resources and persistent data storage in a Xamarin.tvOS app.
  • 아이콘 및 이미지 작업 -captivating 아이콘 및 이미지 만들기는 Apple TV 앱에 대 한 몰입 형 사용자 환경을 개발 하는 데 중요 한 부분입니다.Working with Icons and Images – Creating captivating icons and imagery are a critical part of developing an immersive user experience for your Apple TV apps. 이 가이드는 tvOS 앱에 필요한 그래픽 자산을 만들고 포함 하는 데 필요한 단계를 다룹니다.This guide will cover the steps required to create and include the necessary graphic assets for your Xamarin.tvOS apps.
  • 사용자 인터페이스 – tvOS로 작업할 때 UI (사용자 인터페이스) 컨트롤을 포함 하 여 Xcode의 INTERFACE BUILDER 및 ux 디자인 원칙을 포함 하 여 일반 Ux (사용자 환경) 범위입니다.User Interface – General User Experience (UX) coverage including User Interface (UI) controls, use Xcode's Interface Builder and UX design principles when working with Xamarin.tvOS.
  • 배포 및 테스트 -이 섹션에서는 앱을 배포 하는 방법 뿐만 아니라 앱을 테스트 하는 데 사용 되는 항목을 설명 합니다.Deployment and Testing – This section covers topics used to test an app as well as how to distribute it. 이러한 항목에는 디버깅에 사용 되는 도구, 테스터에 게 배포 및 Apple TV 앱 스토어에 응용 프로그램을 게시 하는 방법이 포함 됩니다.Topics here include things such as tools used for debugging, deployment to testers and how to publish an application to the Apple TV App Store.

TvOS와 관련 된 문제가 발생 하는 경우 문제 및 해결 방법에 대 한 목록은 문제 해결 설명서를 참조 하세요.If you run into any problems working with Xamarin.tvOS, please see our Troubleshooting documentation for a list on know issues and solutions.

요약Summary

이 문서에서는 간단한 Hello, tvOS 앱을 만들어 Mac용 Visual Studio으로 tvOS 앱을 개발 하는 빠른 시작을 제공 했습니다.This article provided a quick start to developing apps for tvOS with Visual Studio for Mac by creating a simple Hello, tvOS app. TvOS 장치 프로 비전, 인터페이스 생성, tvOS 코딩, tvOS 시뮬레이터에서의 테스트에 대 한 기본 사항에 대해 설명 했습니다.It covered the basics of tvOS device provisioning, interface creation, coding for tvOS and testing on the tvOS simulator.