이 자습서 시리즈에서는 XAML 및 C#을 사용하여 WinUI 앱을 만드는 방법을 보여 줍니다. 만들 앱은 사용자가 여러 노트를 만들고 저장하고 로드할 수 있는 메모 앱입니다. GitHub 리포지토리 이 자습서의 코드를 다운로드하거나 볼 수 있습니다.
빈 프로젝트를 빌드하고 실행할 수 있으면 여기에서 시작합니다. 이는 Visual Studio 사용하는 WinUI 3 기본 사항에 대한 단계별 소개입니다. AI 코딩 도우미 또는 MVVM 도구 키트가 필요하지 않습니다.
이 튜토리얼에서는 다음을 배우게 됩니다:
- XAML 태그를 사용하여 앱의 사용자 인터페이스를 정의합니다.
- C# 코드를 통해 XAML 요소와 상호 작용합니다.
- 로컬 파일 시스템에서 파일을 저장하고 로드합니다.
- 뷰를 만들고 데이터에 바인딩합니다.
- 탐색을 사용하여 앱의 페이지로 이동
- 설명서 및 샘플 앱과 같은 리소스를 사용하여 고유한 앱을 만듭니다.
메모를 입력하고 로컬 앱 스토리지에 저장하는 데 사용할 수 있는 앱을 만듭니다. 앱에는 다음 두 페이지가 있습니다.
-
NotePage- 단일 노트를 편집하기 위한 페이지입니다. -
AllNotesPage- 저장된 모든 노트를 표시하는 페이지입니다.
최종 애플리케이션은 다음과 같습니다.
AllNotesPage
NotePage
Visual Studio project 만들기
빠른 시작의 Visual Studio 경로를 따릅니다. 도구 설치 및 프로젝트 만들기를 위해 WinUI 3 프로젝트를 만들고 실행합니다. 다음 자습서별 설정에서 패키지된 C# 프로젝트를 사용합니다.
Project 이름
이 값은
WinUINotes로 설정해야 합니다. project 이름이 다른 경우 이 자습서에서 복사하여 붙여넣는 코드로 인해 빌드 오류가 발생할 수 있습니다. Visual Studio 앱 코드에 project 이름을 기본 namespace 사용하기 때문입니다.Windows 앱 SDK
이 자습서에서는 Windows 앱 SDK 1.7 이상에서 사용할 수 있는 기능을 사용합니다. Windows 앱 SDK NuGet 패키지가 버전 1.7 이상으로 업데이트되었는지 확인합니다.
계속하기 전에 빈 WinUINotes 프로젝트를 빌드하고 시작합니다. 다음과 같은 빈 창이 표시됩니다.
팁 (조언)
Windows 앱을 빌드하는 동안 API 참조 문서 및 개념 문서를 자주 참조합니다. 이 자습서에서는 텍스트와 "문서에서 자세히 알아보기:"라는 레이블이 지정된 그룹에 인라인으로 링크가 표시됩니다. 이러한 링크는 선택 사항입니다. 자습서를 완료하기 위해 팔로우할 필요가 없습니다. 사용자 고유의 앱을 만들기 시작할 때 필요한 정보를 찾을 위치를 기록하려는 경우에 제공됩니다.
Windows developer