플랫폼 간 앱 사례 연구: Tasky

아티클
01/10/2024

TaskyPortable 은 간단한 할 일 목록 애플리케이션입니다. 이 문서에서는 플랫폼 간 애플리케이션 빌드 문서의 지침 에 따라 설계 및 빌드 방법을 설명합니다 . 토론은 다음 영역을 다룹니다.

디자인 프로세스

코딩을 시작하기 전에 달성하려는 작업에 대한 로드맵을 만드는 것이 좋습니다. 이는 여러 가지 방법으로 노출되는 기능을 빌드하는 플랫폼 간 개발의 경우 특히 그렇습니다. 빌드하는 내용에 대한 명확한 아이디어부터 시작하여 개발 주기의 뒷부분에서 시간과 노력을 절약할 수 있습니다.

요구 사항

애플리케이션을 디자인하는 첫 번째 단계는 원하는 기능을 식별하는 것입니다. 대략적인 목표 또는 자세한 사용 사례일 수 있습니다. Tasky에는 간단한 기능 요구 사항이 있습니다.

작업 목록 보기
작업 추가, 편집 및 삭제
작업의 상태 '완료'로 설정

플랫폼별 기능의 사용을 고려해야 합니다. Tasky가 iOS 지오펜싱 또는 Windows 전화 라이브 타일을 활용할 수 있나요? 첫 번째 버전에서 플랫폼별 기능을 사용하지 않더라도 비즈니스 및 데이터 계층이 이를 수용할 수 있도록 미리 계획해야 합니다.

사용자 인터페이스 설계

대상 플랫폼에서 구현할 수 있는 개략적인 디자인부터 시작합니다. 플랫폼 사양 UI 제약 조건에 유의하세요. 예를 들어 iOS의 TabBarController 경우 5개 이상의 단추를 표시할 수 있지만 Windows 전화 해당하는 단추는 최대 4개까지 표시할 수 있습니다. 선택한 도구를 사용하여 화면 흐름을 그립니다(용지 작동).

데이터 모델

어떤 데이터를 저장해야 하는지 알면 사용할 지속성 메커니즘을 결정하는 데 도움이 됩니다. 사용 가능한 스토리지 메커니즘에 대한 자세한 내용과 플랫폼 간 데이터 액세스를 참조하세요. 이 프로젝트의 경우 SQLite.NET 사용하겠습니다.

Tasky는 각 'TaskItem'에 대한 세 가지 속성을 저장해야 합니다.

이름 – 문자열
참고 - 문자열
완료 – 부울

핵심 기능

사용자 인터페이스가 요구 사항을 충족하기 위해 사용해야 하는 API를 고려합니다. 할 일 목록에는 다음 함수가 필요합니다.

모든 작업 나열 - 사용 가능한 모든 작업의 기본 화면 목록을 표시합니다.
하나의 작업 가져오기 - 작업 행을 터치할 때
하나의 작업 저장 - 작업을 편집할 때
하나의 작업 삭제 - 작업이 삭제될 때
빈 작업 만들기 - 새 작업이 만들어지는 경우

코드를 다시 사용하려면 이식 가능한 클래스 라이브러리에서 이 API를 한 번 구현해야 합니다.

구현

애플리케이션 디자인이 합의되면 플랫폼 간 애플리케이션으로 구현되는 방법을 고려합니다. 애플리케이션의 아키텍처가 됩니다. 플랫폼 간 애플리케이션 빌드 문서의 지침에 따라 애플리케이션 코드를 다음 부분으로 세분화해야 합니다.

Common Code – 작업 데이터를 저장하는 데 다시 사용할 수 있는 코드를 포함하는 공통 프로젝트입니다. 모델 클래스 및 API를 노출하여 데이터 저장 및 로드를 관리합니다.
플랫폼별 코드 – 공통 코드를 '백 엔드'로 활용하여 각 운영 체제에 대한 네이티브 UI를 구현하는 플랫폼별 프로젝트입니다.

이 두 부분은 다음 섹션에서 설명합니다.

일반(PCL) 코드

Tasky Portable은 일반 코드를 공유하기 위해 이식 가능한 클래스 라이브러리 전략을 사용합니다. 코드 공유 옵션에 대한 설명은 코드 공유 옵션 문서를 참조하세요.

데이터 액세스 계층, 데이터베이스 코드 및 계약을 포함한 모든 공통 코드는 라이브러리 프로젝트에 배치됩니다.

전체 PCL 프로젝트는 아래에 나와 있습니다. 이식 가능한 라이브러리의 모든 코드는 각 대상 플랫폼과 호환됩니다. 배포될 때 각 네이티브 앱은 해당 라이브러리를 참조합니다.

When deployed, each native app will reference that library

아래 클래스 다이어그램은 계층별로 그룹화된 클래스를 보여 줍니다. 클래스는 SQLiteConnection Sqlite-NET 패키지의 상용구 코드입니다. 나머지 클래스는 Tasky에 대한 사용자 지정 코드입니다. 및 TaskItem 클래스는 TaskItemManager 플랫폼별 애플리케이션에 노출되는 API를 나타냅니다.

네임스페이스를 사용하여 레이어를 구분하면 각 계층 간의 참조를 관리하는 데 도움이 됩니다. 플랫폼별 프로젝트에는 비즈니스 계층에 using 대한 문만 포함되어야 합니다. 데이터 액세스 계층 및 데이터 계층은 비즈니스 계층에 의해 노출되는 API에 의해 TaskItemManager 캡슐화되어야 합니다.

참조

이식 가능한 클래스 라이브러리는 플랫폼 및 프레임워크 기능에 대한 다양한 수준의 지원이 있는 여러 플랫폼에서 사용할 수 있어야 합니다. 따라서 패키지 및 프레임워크 라이브러리를 사용할 수 있는 제한 사항이 있습니다. 예를 들어 Xamarin.iOS는 c# dynamic 키워드(keyword) 지원하지 않으므로 이식 가능한 클래스 라이브러리는 이러한 코드가 Android에서 작동하더라도 동적 코드에 의존하는 패키지를 사용할 수 없습니다. Mac용 Visual Studio 호환되지 않는 패키지 및 참조를 추가하는 것을 방지하지만 나중에 놀라움을 피하기 위해 제한 사항을 염두에 두어야 합니다.

참고: 프로젝트에서 사용하지 않은 프레임워크 라이브러리를 참조하는 것을 볼 수 있습니다. 이러한 참조는 Xamarin 프로젝트 템플릿의 일부로 포함됩니다. 앱을 컴파일하면 연결 프로세스는 참조되지 않은 코드를 제거하므로 참조된 경우에도 System.Xml Xml 함수를 사용하지 않으므로 최종 애플리케이션에 포함되지 않습니다.

데이터 계층(DL)

데이터 계층에는 데이터베이스, 플랫 파일 또는 기타 메커니즘에 관계없이 데이터의 물리적 스토리지를 수행하는 코드가 포함되어 있습니다. Tasky 데이터 계층은 SQLite-NET 라이브러리와 연결하기 위해 추가된 사용자 지정 코드의 두 부분으로 구성됩니다.

Tasky는 SQLite-net NuGet 패키지(Frank Krueger가 게시)를 사용하여 ORM(개체 관계형 매핑) 데이터베이스 인터페이스를 제공하는 SQLite-NET 코드를 포함합니다. 클래스는 TaskItemDatabase SQLite에서 SQLiteConnection 데이터를 읽고 쓰는 데 필요한 CRUD(Create, Read, Update, Delete) 메서드를 상속하고 추가합니다. 다른 프로젝트에서 다시 사용할 수 있는 제네릭 CRUD 메서드의 간단한 상용구 구현입니다.

이 TaskItemDatabase 싱글톤은 동일한 인스턴스에 대해 모든 액세스가 발생하도록 합니다. 잠금은 여러 스레드에서 동시 액세스를 방지하는 데 사용됩니다.

Windows 전화 SQLite

iOS와 Android는 모두 운영 체제의 일부로 SQLite와 함께 제공되지만 Windows 전화 호환되는 데이터베이스 엔진을 포함하지 않습니다. 세 플랫폼 모두에 걸쳐 코드를 공유하려면 Windows 휴대폰 네이티브 버전의 SQLite가 필요합니다. Sqlite용 Windows 전화 프로젝트 설정에 대한 자세한 내용은 로컬 데이터베이스 작업을 참조하세요.

인터페이스를 사용하여 데이터 액세스 일반화

데이터 계층은 기본 키가 필요한 추상 데이터 액세스 메서드를 구현할 수 있도록 종속성을 BL.Contracts.IBusinessIdentity 사용합니다. 그런 다음 인터페이스를 구현하는 모든 비즈니스 계층 클래스를 데이터 계층에 유지할 수 있습니다.

인터페이스는 기본 키 역할을 하는 정수 속성만 지정합니다.

public interface IBusinessEntity {
    int ID { get; set; }
}

기본 클래스는 인터페이스를 구현하고 SQLite-NET 특성을 추가하여 자동 증가 기본 키로 표시합니다. 그런 다음, 이 기본 클래스를 구현하는 비즈니스 계층의 모든 클래스를 데이터 계층에 유지할 수 있습니다.

public abstract class BusinessEntityBase : IBusinessEntity {
    public BusinessEntityBase () {}
    [PrimaryKey, AutoIncrement]
    public int ID { get; set; }
}

인터페이스를 사용하는 데이터 계층의 제네릭 메서드 예는 다음과 GetItem<T> 같습니다.

public T GetItem<T> (int id) where T : BL.Contracts.IBusinessEntity, new ()
{
    lock (locker) {
        return Table<T>().FirstOrDefault(x => x.ID == id);
    }
}

동시 액세스를 방지하기 위한 잠금

데이터베이스에 대한 동시 액세스를 방지하기 위해 TaskItemDatabase 클래스 내에서 잠금이 구현됩니다. 이는 다른 스레드의 동시 액세스가 직렬화되도록 하기 위한 것입니다(그렇지 않으면 UI 구성 요소가 백그라운드 스레드가 데이터베이스를 업데이트하는 동시에 데이터베이스를 읽으려고 시도할 수 있습니다). 잠금이 구현되는 방법의 예는 다음과 같습니다.

static object locker = new object ();
public IEnumerable<T> GetItems<T> () where T : BL.Contracts.IBusinessEntity, new ()
{
    lock (locker) {
        return (from i in Table<T> () select i).ToList ();
    }
}
public T GetItem<T> (int id) where T : BL.Contracts.IBusinessEntity, new ()
{
    lock (locker) {
        return Table<T>().FirstOrDefault(x => x.ID == id);
    }
}

대부분의 데이터 계층 코드는 다른 프로젝트에서 다시 사용할 수 있습니다. 계층의 유일한 애플리케이션별 코드는 생성자의 호출입니다 CreateTable<TaskItem>TaskItemDatabase .

DAL(데이터 액세스 계층)

클래스는 TaskItemRepository 개체를 만들고, 삭제하고, 검색하고, 업데이트할 수 있도록 하는 TaskItem 강력한 형식의 API를 사용하여 데이터 스토리지 메커니즘을 캡슐화합니다.

조건부 컴파일 사용

클래스는 조건부 컴파일을 사용하여 파일 위치를 설정합니다. 이는 플랫폼 분기를 구현하는 예입니다. 경로를 반환하는 속성은 각 플랫폼의 다른 코드로 컴파일됩니다. 코드 및 플랫폼별 컴파일러 지시문은 다음과 같습니다.

public static string DatabaseFilePath {
    get {
        var sqliteFilename = "TaskDB.db3";
#if SILVERLIGHT
        // Windows Phone expects a local path, not absolute
        var path = sqliteFilename;
#else
#if __ANDROID__
        // Just use whatever directory SpecialFolder.Personal returns
        string libraryPath = Environment.GetFolderPath(Environment.SpecialFolder.Personal); ;
#else
        // we need to put in /Library/ on iOS5.1+ to meet Apple's iCloud terms
        // (they don't want non-user-generated data in Documents)
        string documentsPath = Environment.GetFolderPath (Environment.SpecialFolder.Personal); // Documents folder
        string libraryPath = Path.Combine (documentsPath, "..", "Library"); // Library folder
#endif
        var path = Path.Combine (libraryPath, sqliteFilename);
                #endif
                return path;
    }
}

플랫폼에 따라 출력은 iOS용 "<앱 경로>/라이브러리/TaskDB.db3", Android의 경우 "<앱 경로>/문서/TaskDB.db3" 또는 Windows 전화 대한 "TaskDB.db3"입니다.

BL(비즈니스 계층)

비즈니스 계층은 모델 클래스와 외관을 구현하여 관리합니다. Tasky에서 모델은 클래스이며 TaskItemTaskItemManager 외관 패턴을 구현하여 관리용 API를 TaskItems제공합니다.

Façade

TaskItemManagerDAL.TaskItemRepository 는 애플리케이션 및 UI 계층에서 참조할 Get, Save 및 Delete 메서드를 제공하기 위해 래핑합니다.

비즈니스 규칙 및 논리는 필요한 경우 여기에 배치됩니다. 예를 들어 개체를 저장하기 전에 충족해야 하는 유효성 검사 규칙입니다.

플랫폼별 코드에 대한 API

공용 코드가 작성되면 사용자가 노출한 데이터를 수집하고 표시하기 위해 사용자 인터페이스를 빌드해야 합니다. 이 클래스는 TaskItemManager 외관 패턴을 구현하여 애플리케이션 코드가 액세스할 수 있는 간단한 API를 제공합니다.

각 플랫폼별 프로젝트에서 작성된 코드는 일반적으로 해당 디바이스의 네이티브 SDK와 긴밀하게 결합되며, 정의된 API를 사용하여 공통 코드에 TaskItemManager만 액세스합니다. 여기에는 다음과 같이 TaskItem노출하는 메서드 및 비즈니스 클래스가 포함됩니다.

이미지는 플랫폼 간에 공유되지 않고 각 프로젝트에 독립적으로 추가됩니다. 각 플랫폼은 서로 다른 파일 이름, 디렉터리 및 해상도를 사용하여 이미지를 다르게 처리하기 때문에 중요합니다.

다시 기본 섹션에서는 Tasky UI의 플랫폼별 구현 세부 정보를 설명합니다.

iOS 앱

데이터를 저장하고 검색하기 위해 공통 PCL 프로젝트를 사용하여 iOS Tasky 애플리케이션을 구현하는 데 필요한 클래스는 소수에 불과합니다. 전체 iOS Xamarin.iOS 프로젝트는 다음과 같습니다.

iOS project is shown here

클래스는 계층으로 그룹화된 이 다이어그램에 표시됩니다.

참조

iOS 앱은 플랫폼별 SDK 라이브러리(예: )를 참조합니다. Xamarin.iOS 및 MonoTouch.Dialog-1.

또한 PCL 프로젝트를 참조 TaskyPortableLibrary 해야 합니다. 참조 목록은 다음과 같습니다.

The references list is shown here

애플리케이션 계층 및 사용자 인터페이스 계층은 이러한 참조를 사용하여 이 프로젝트에서 구현됩니다.

애플리케이션 계층(AL)

애플리케이션 계층에는 PCL에서 노출하는 개체를 UI에 '바인딩'하는 데 필요한 플랫폼별 클래스가 포함되어 있습니다. iOS 관련 애플리케이션에는 작업을 표시하는 데 도움이 되는 두 가지 클래스가 있습니다.

EditingSource – 이 클래스는 작업 목록을 사용자 인터페이스에 바인딩하는 데 사용됩니다. 작업 목록에 사용되었으므로 MonoTouch.Dialog 이 도우미를 구현하여 에서 살짝 밀기-삭제 기능을 UITableView 사용하도록 설정해야 합니다. 살짝 밀기-삭제는 iOS에서 일반적이지만 Android 또는 Windows 전화 없으므로 iOS 특정 프로젝트가 구현하는 유일한 프로젝트입니다.
TaskDialog – 이 클래스는 단일 작업을 UI에 바인딩하는 데 사용됩니다. 리플렉션 API를 사용하여 MonoTouch.Dialog 올바른 특성이 포함된 클래스로 개체를 '래핑' TaskItem 하여 입력 화면의 서식을 올바르게 지정할 수 있습니다.

클래스는 TaskDialog 특성을 사용하여 MonoTouch.Dialog 클래스의 속성에 따라 화면을 만듭니다. 이 클래스는 다음과 같습니다.

public class TaskDialog {
    public TaskDialog (TaskItem task)
    {
        Name = task.Name;
        Notes = task.Notes;
        Done = task.Done;
    }
    [Entry("task name")]
    public string Name { get; set; }
    [Entry("other task info")]
    public string Notes { get; set; }
    [Entry("Done")]
    public bool Done { get; set; }
    [Section ("")]
    [OnTap ("SaveTask")]    // method in HomeScreen
    [Alignment (UITextAlignment.Center)]
    public string Save;
    [Section ("")]
    [OnTap ("DeleteTask")]  // method in HomeScreen
    [Alignment (UITextAlignment.Center)]
    public string Delete;
}

특성에는 OnTap 메서드 이름이 필요합니다. 이러한 메서드는 만들어진 클래스 MonoTouch.Dialog.BindingContext 에 있어야 합니다(이 경우 HomeScreen 다음 섹션에서 설명하는 클래스).

UI(사용자 인터페이스 계층)

사용자 인터페이스 계층은 다음 클래스로 구성됩니다.

AppDelegate – 애플리케이션에서 사용되는 글꼴 및 색의 스타일을 지정하는 모양 API에 대한 호출을 포함합니다. Tasky는 간단한 애플리케이션이므로 실행 중인 FinishedLaunching 다른 초기화 작업이 없습니다.
화면 – 각 화면과 해당 동작을 정의하는 서브클래스 UIViewController 입니다. 화면은 UI를 애플리케이션 계층 클래스 및 공통 API( TaskItemManager )와 연결합니다. 이 예제에서는 화면이 코드로 만들어지지만 Xcode의 인터페이스 작성기 또는 스토리보드 디자이너를 사용하여 디자인되었을 수 있습니다.
이미지 – 시각적 요소는 모든 애플리케이션에서 중요한 부분입니다. Tasky에는 시작 화면 및 아이콘 이미지가 있으며 iOS용은 일반 및 망토 해상도로 제공되어야 합니다.

홈 화면

홈 화면은 MonoTouch.Dialog SQLite 데이터베이스의 작업 목록을 표시하는 화면입니다. 표시할 개체 컬렉션을 TaskItem 포함하도록 설정하는 Root 코드를 상속 DialogViewController 하고 구현합니다.

작업 목록 표시 및 상호 작용과 관련된 두 가지 기본 방법은 다음과 같습니다.

PopulateTable – 비즈니스 계층의 TaskManager.GetTasks 메서드를 사용하여 표시할 개체 컬렉션을 TaskItem 검색합니다.
선택됨 – 행을 터치하면 새 화면에 작업을 표시합니다.

작업 세부 정보 화면

작업 세부 정보는 작업을 편집하거나 삭제할 수 있는 입력 화면입니다.

Tasky는 '리플렉션 API를 사용하여 MonoTouch.Dialog화면을 표시하므로 구현이 없습니다 UIViewController . 대신 클래스는 HomeScreen 애플리케이션 계층에서 using 클래스를 DialogViewControllerTaskDialog 인스턴스화하고 표시합니다.

이 스크린샷은 이름 및 메모 필드에서 워터마크 텍스트를 설정하는 특성을 보여 Entry 주는 빈 화면을 보여줍니다.

작업 세부 정보 화면의 기능(예: 작업 저장 또는 삭제)은 클래스에서 HomeScreen 구현되어야 합니다. 이 위치가 만들어지는 위치 MonoTouch.Dialog.BindingContext 이기 때문입니다. 다음 HomeScreen 메서드는 작업 세부 정보 화면을 지원합니다.

ShowTaskDetails – 화면을 렌더링하는 방법을 만듭니다 MonoTouch.Dialog.BindingContext . 리플렉션을 사용하여 입력 화면을 만들어 클래스에서 속성 이름과 형식을 검색합니다 TaskDialog . 입력 상자의 워터마크 텍스트와 같은 추가 정보는 속성의 특성을 사용하여 구현됩니다.
SaveTask – 이 메서드는 특성을 통해 OnTap 클래스에서 TaskDialog 참조됩니다. 저장을 누를 때 호출되며, 다음을 MonoTouch.Dialog.BindingContext 사용하여 변경 내용을 저장하기 전에 사용자가 입력한 데이터를 검색하는 데 사용합니다 TaskItemManager .
DeleteTask – 이 메서드는 특성을 통해 OnTap 클래스에서 TaskDialog 참조됩니다. 기본 키(ID 속성)를 사용하여 데이터를 삭제하는 데 사용됩니다 TaskItemManager .

Android 앱

전체 Xamarin.Android 프로젝트는 아래 그림과 같습니다.

Android project is pictured here

클래스가 계층별로 그룹화된 클래스 다이어그램:

참조

Android 앱 프로젝트는 Android SDK에서 클래스에 액세스하려면 플랫폼별 Xamarin.Android 어셈블리를 참조해야 합니다.

PCL 프로젝트도 참조해야 합니다(예: TaskyPortableLibrary) - 공통 데이터 및 비즈니스 계층 코드에 액세스합니다.

TaskyPortableLibrary to access the common data and business layer code

애플리케이션 계층(AL)

앞에서 살펴본 iOS 버전과 마찬가지로 Android 버전의 애플리케이션 계층에는 Core에서 노출한 개체를 UI에 '바인딩'하는 데 필요한 플랫폼별 클래스가 포함되어 있습니다.

TaskListAdapter – 개체 목록 T>를<표시하려면 어댑터를 구현하여 사용자 지정 개체를 표시해야 합니다ListView. 어댑터는 목록의 각 항목에 사용되는 레이아웃을 제어합니다. 이 경우 코드는 Android 기본 제공 레이아웃 SimpleListItemChecked을 사용합니다.

UI(사용자 인터페이스)

Android 앱의 사용자 인터페이스 계층은 코드와 XML 태그의 조합입니다.

리소스/레이아웃 – 화면 레이아웃 및 AXML 파일로 구현된 행 셀 디자인. AXML은 직접 작성하거나 Android용 Xamarin UI 디자이너를 사용하여 시각적으로 배치할 수 있습니다.
리소스/그리기 가능 – 이미지(아이콘) 및 사용자 지정 단추.
화면 – 각 화면과 해당 동작을 정의하는 활동 서브클래스입니다. UI를 애플리케이션 계층 클래스 및 공통 API(TaskItemManager)와 연결합니다.

홈 화면

홈 화면은 작업 하위 클래스 HomeScreen 와 레이아웃(단추 및 HomeScreen.axml 작업 목록의 위치)을 정의하는 파일로 구성됩니다. 화면은 다음과 같습니다.

홈 화면 코드는 단추를 클릭하고 목록에서 항목을 클릭할 뿐만 아니라 메서드의 OnResume 목록을 채우기 위한 처리기를 정의합니다(작업 세부 정보 화면의 변경 내용을 반영함). 비즈니스 계층과 애플리케이션 계층 TaskItemManager 을 TaskListAdapter 사용하여 데이터를 로드합니다.

작업 세부 정보 화면

작업 세부 정보 화면은 하위 클래스 및 AXML 레이아웃 파일로도 구성됩니다 Activity . 레이아웃은 입력 컨트롤의 위치를 결정하고 C# 클래스는 개체를 로드하고 저장하는 TaskItem 동작을 정의합니다.

PCL 라이브러리에 대한 모든 참조는 클래스를 통해 제공됩니다 TaskItemManager .

Windows 전화 앱

전체 Windows 전화 프로젝트:

Windows Phone App The complete Windows Phone project

아래 다이어그램은 계층으로 그룹화된 클래스를 제공합니다.

참조

플랫폼별 프로젝트는 유효한 Windows 전화 애플리케이션을 만드는 데 필요한 플랫폼별 라이브러리(예: Microsoft.Phone 및System.Windows)를 참조해야 합니다.

또한 클래스 및 데이터베이스를 활용 TaskItem 하려면 PCL 프로젝트(예TaskyPortableLibrary: )를 참조해야 합니다.

TaskyPortableLibrary to utilize the TaskItem class and database

애플리케이션 계층(AL)

iOS 및 Android 버전과 마찬가지로 애플리케이션 계층은 사용자 인터페이스에 데이터를 바인딩하는 데 도움이 되는 시각적 요소가 아닌 요소로 구성됩니다.

ViewModels

ViewModels는 PCL( TaskItemManager)의 데이터를 래핑하고 Silverlight/XAML 데이터 바인딩에서 사용할 수 있는 방식으로 제공합니다. 플랫폼별 동작의 예입니다(플랫폼 간 애플리케이션 문서에 설명된 대로).

UI(사용자 인터페이스)

XAML에는 태그에서 선언하고 개체를 표시하는 데 필요한 코드 양을 줄일 수 있는 고유한 데이터 바인딩 기능이 있습니다.

Pages – XAML 파일 및 해당 codebehind는 사용자 인터페이스를 정의하고 ViewModels 및 PCL 프로젝트를 참조하여 데이터를 표시하고 수집합니다.
이미지 – 시작 화면, 배경 및 아이콘 이미지는 사용자 인터페이스의 핵심 부분입니다.

MainPage

MainPage 클래스는 XAML의 데이터 바인딩 기능을 사용하여 데이터를 표시하는 데 사용합니다 TaskListViewModel . 페이지 DataContext 가 비동기적으로 채워지는 보기 모델로 설정됩니다. XAML의 구문은 {Binding} 데이터가 표시되는 방식을 결정합니다.

TaskDetailsPage

각 작업은 TaskDetailsPage.xaml에 정의된 XAML에 바인딩 TaskViewModel 하여 표시됩니다. 작업 데이터는 비즈니스 계층에서 TaskItemManager 검색됩니다.

결과

결과 애플리케이션은 각 플랫폼에서 다음과 같이 표시됩니다.

iOS

애플리케이션은 탐색 모음에 배치되고 기본 제공 더하기(+) 아이콘을 사용하는 '추가' 단추와 같은 iOS 표준 사용자 인터페이스 디자인을 사용합니다. 또한 기본 UINavigationController '뒤로' 단추 동작을 사용하고 테이블에서 '살짝 밀기-삭제'를 지원합니다.

Android

Android 앱은 '틱'이 표시되어야 하는 행의 기본 제공 레이아웃을 비롯한 기본 제공 컨트롤을 사용합니다. 하드웨어/시스템 뒤로 동작은 화면 뒤로 단추 외에 지원됩니다.

Windows Phone

Windows 전화 앱은 표준 레이아웃을 사용하여 위쪽의 탐색 모음 대신 화면 아래쪽에 있는 앱 바를 채웁다.

요약

이 문서에서는 iOS, Android 및 Windows 전화 세 가지 모바일 플랫폼에서 코드를 재사용할 수 있도록 계층화된 애플리케이션 디자인의 원칙이 간단한 애플리케이션에 어떻게 적용되었는지에 대한 자세한 설명을 제공했습니다.

애플리케이션 계층을 디자인하는 데 사용되는 프로세스를 설명하고 각 계층에서 구현된 코드 및 기능에 대해 설명했습니다.

github에서 코드를 다운로드할 수 있습니다.

플랫폼 간 앱 사례 연구: Tasky

디자인 프로세스

요구 사항

사용자 인터페이스 설계

데이터 모델

핵심 기능

구현

일반(PCL) 코드

참조

데이터 계층(DL)

Windows 전화 SQLite

인터페이스를 사용하여 데이터 액세스 일반화

동시 액세스를 방지하기 위한 잠금

DAL(데이터 액세스 계층)

조건부 컴파일 사용

BL(비즈니스 계층)

Façade

플랫폼별 코드에 대한 API

iOS 앱

참조

애플리케이션 계층(AL)

UI(사용자 인터페이스 계층)

홈 화면

작업 세부 정보 화면

Android 앱

참조

애플리케이션 계층(AL)

UI(사용자 인터페이스)

홈 화면

작업 세부 정보 화면

Windows 전화 앱

참조

애플리케이션 계층(AL)

ViewModels

UI(사용자 인터페이스)

MainPage

TaskDetailsPage

결과

iOS

Android

Windows Phone

요약

관련 링크

추가 리소스