uwp 튜토리얼 => uwp 시작하기

비고

이 절에서는 uwp가 무엇인지, 왜 개발자가 그것을 사용하고 싶어하는지에 대한 개요를 제공합니다.

또한 uwp 내의 모든 큰 주제를 언급하고 관련 주제에 링크해야합니다. uwp에 대한 설명서는 새로운 기능이므로 해당 관련 항목의 초기 버전을 만들어야 할 수 있습니다.

설치 또는 설정

UWP 설정 또는 설치에 대한 자세한 지침.

요구 사항

윈도우 10
Visual Studio 2015

단계

Universal Windows App Development Tools 가 하위 옵션과 함께 선택되어 있는지 확인하면서 Visual Studio 2015를 다운로드하고 사용자 지정 설치합니다.
a) 도구 및 Windows SDK
b) Windows Phone 용 에뮬레이터
개발 및 배포시 개발자 모드 활성화를 확인하십시오.
사용할 언어에 따라 템플릿을 선택하십시오.
C # , Visual Basic , C ++ 또는 JavaScript .
다음으로 빈 응용 프로그램을 만듭니다 (범용 Windows).
응용 프로그램에 적합한 Windows 10의 대상 및 최소 버전을 선택하십시오.
어떤 버전을 선택해야할지 잘 모르겠 으면 여기를 클릭하거나 옵션을 기본값으로두고 '확인'을 클릭하여 시작하십시오!

스냅 샷

Installation

Creating a new project

Selecting Target and minimum version for your Application

첫 번째 UWP 응용 프로그램 만들기

이 예제는 간단한 UWP 애플리케이션을 개발하는 방법을 보여줍니다.

"빈 응용 프로그램 (유니버설 윈도우)"프로젝트를 만들 때 솔루션에 많은 필수 파일이 생성됩니다.

프로젝트의 모든 파일은 솔루션 탐색기 에서 볼 수 있습니다.

프로젝트의 중요한 파일 중 일부는 다음과 같습니다.

App.xaml 및 App.xaml.cs - App.xaml은 응용 프로그램에서 사용할 수있는 리소스를 선언하는 데 사용되며 App.xaml.cs는 해당 응용 프로그램의 백엔드 코드입니다. App.xaml.cs는 응용 프로그램의 기본 진입 점입니다.
MainPage.xaml - 응용 프로그램의 기본 시작 UI 페이지입니다 (App.xaml.cs의 응용 프로그램 시작 페이지를 변경할 수도 있음).
Package.appxmanifest -이 파일에는 표시 이름, 진입 점, 시각적 자산, 기능 목록, 패키지 정보 등 응용 프로그램의 중요한 정보가 들어 있습니다.

시작하기

페이지에 버튼 추가하기
UI 요소 또는 도구를 페이지에 추가하려면 도구 상자 창에서 요소를 끌어서 놓기 만하면됩니다. 도구 상자에서 '버튼'도구를 검색하여 앱 페이지에 드롭합니다.

UI 사용자 정의
특정 도구의 모든 특성은 오른쪽 하단의 특성 창에 표시됩니다.
여기서는 버튼 안의 텍스트를 "Speak it!"으로 바꿀 것입니다. 이렇게하려면 먼저 버튼을 탭하여 선택하고 속성 창을 스크롤하여 내용 을 찾고 텍스트를 원하는 문자열 ( "Speak it!")로 변경하십시오.
페이지의 배경색도 변경합니다. 각 페이지에는 다른 모든 요소가 포함 된 상위 요소 (일반적으로 표)가 있습니다. 따라서 우리는 부모 그리드의 색을 바꿀 것입니다. 그리드를 탭하고 속성 창에서 브러시> 배경 을 원하는 색상으로 변경하십시오.

사용자 인터페이스를 사용자 정의한 후에 UI는 이와 유사합니다.

코드 숨김
이제 버튼 클릭만으로 뭔가를 할 수 있습니다!
버튼을 클릭하면 이벤트가 트리거되고 버튼을 클릭 할 때 유용하게 사용할 이벤트를 처리해야합니다.
이벤트 핸들러 추가하기
버튼에 클릭 이벤트 핸들러를 추가하려면 버튼을 선택하고 속성 창으로 이동하여 번개 모양 아이콘을 선택 합니다 . 이 창은 우리가 선택한 요소에 사용할 수있는 모든 이벤트로 구성됩니다 (이 경우에는 버튼). 그런 다음 "Click" 이벤트 옆에있는 텍스트 상자를 두 번 클릭하면 버튼 클릭 이벤트에 대한 핸들러가 자동으로 생성됩니다.

이 후 ac # 페이지 (MainPage.xaml.cs)로 리디렉션됩니다. 이벤트 처리기 메서드에 다음 코드를 추가합니다.

 MediaElement mediaElement = new MediaElement();
        var synth = new Windows.Media.SpeechSynthesis.SpeechSynthesizer();
        Windows.Media.SpeechSynthesis.SpeechSynthesisStream stream = await synth.SynthesizeTextToStreamAsync("Hello, World!");
        mediaElement.SetSource(stream, stream.ContentType);
        mediaElement.Play();

그런 다음 이벤트 핸들러에 async 키워드를 추가하십시오.

클래스 위에 코드를 추가 한 후 다음과 같이 표시됩니다.

public sealed partial class MainPage : Page
{
    string speakIt = "Hello, World!";
    public MainPage()
    {
        this.InitializeComponent();
    }

    private async void button_Click(object sender, RoutedEventArgs e)
    {
        MediaElement mediaElement = new MediaElement();
        var synth = new Windows.Media.SpeechSynthesis.SpeechSynthesizer();
        Windows.Media.SpeechSynthesis.SpeechSynthesisStream stream = await synth.SynthesizeTextToStreamAsync(speakIt);
        mediaElement.SetSource(stream, stream.ContentType);
        mediaElement.Play();

    }
}

앱을 실행하십시오!
귀하의 응용 프로그램을 시작할 준비가되었습니다. F5 키를 눌러 응용 프로그램을 시작하거나 응용 프로그램을 배포 및 디버깅 할 장치를 선택하고 시작 단추를 클릭 할 수 있습니다.

빌드 한 후에는 응용 프로그램이 장치에 배포됩니다. 장치의 해상도와 화면 크기에 따라 응용 프로그램이 자동으로 레이아웃을 구성합니다. (창의 크기를 조정하여 얼마나 원활하게 작동하는지 확인할 수 있습니다)

더 나아가 다.
이제 첫 번째 응용 프로그램을 만들었으므로 한 단계 더 나아가십시오!
페이지에 텍스트 상자를 추가하고 버튼을 클릭하면 응용 프로그램은 텍스트 상자에 쓰여진 내용을 말합니다.
TextBox 컨트롤을 도구 상자에서 레이아웃으로 드래그 앤 드롭하여 시작하십시오. 그런 다음 속성 메뉴에서 TextBox에 이름을 지정하십시오. 왜이 컨트롤을 쉽게 사용할 수 있도록 이름을 지정해야합니까?
Visual Studio는 기본적으로 컨트롤에 이름을 지정하지만 컨트롤의 이름이나 관련 내용에 따라 컨트롤 이름을 지정하는 것이 좋습니다.
내 텍스트 상자의 이름을 " speakText "로 지정합니다.

    private async void button_Click(object sender, RoutedEventArgs e)
    {
        //checking if the text provided in the textbox is null or whitespace
        if (!string.IsNullOrWhiteSpace(speakText.Text))
            speakIt = speakText.Text;
        else
            speakIt = "Please enter a valid string!";

        MediaElement mediaElement = new MediaElement();
        var synth = new Windows.Media.SpeechSynthesis.SpeechSynthesizer();
        Windows.Media.SpeechSynthesis.SpeechSynthesisStream stream = await synth.SynthesizeTextToStreamAsync(speakIt);
        mediaElement.SetSource(stream, stream.ContentType);
        mediaElement.Play();

    }

이제 코드를 배포하십시오 !!

이제 응용 프로그램에서 제공 한 유효한 문자열을 말할 수 있습니다!

축하해! 자신 만의 UWP 응용 프로그램을 성공적으로 만들었습니다!

Modified text is an extract of the original Stack Overflow Documentation

아래 라이선스 CC BY-SA 3.0

와 제휴하지 않음 Stack Overflow

uwp 튜토리얼
uwp 시작하기

수색…

비고

설치 또는 설정

스냅 샷

첫 번째 UWP 응용 프로그램 만들기

시작하기