uwp チュートリアル => uwpを使い始める

備考

このセクションでは、uwpの概要と、なぜ開発者がそれを使いたいのかを概説します。

また、uwp内の大きなテーマについても言及し、関連するトピックにリンクする必要があります。 uwpのドキュメントは新しくなっているので、それらの関連トピックの初期バージョンを作成する必要があります。

インストールまたはセットアップ

UWPをセットアップまたはインストールするための詳しい手順。

要件

ウィンドウズ10
Visual Studio 2015

ステップ

Visual Studio 2015をダウンロードしてカスタムインストールし、 Universal Windows App Development Toolsがそのサブオプションと共に選択されていることを確認します。
a） ツールとWindows SDK
b） Windows Phone用エミュレータ
開発時およびデプロイ時に開発者モードを有効にしてください。
使用する言語に基づいてテンプレートを選択します。
C＃、 Visual Basic 、 C ++、またはJavaScriptを使用します 。
次に、空白のアプリケーション（ユニバーサルWindows）を作成します。
アプリケーションに適したWindows 10のターゲットと最小バージョンを選択します。
選択するバージョンが不明な場合はここをクリックするか、オプションをデフォルト値のままにして、[OK]をクリックして開始してください。

スナップショット

Installation

Creating a new project

Selecting Target and minimum version for your Application

最初のUWPアプリケーションを作成する

この例では、単純なUWPアプリケーションを開発する方法を示します。

「ブランクアプリケーション（ユニバーサルWindows）」プロジェクトの作成時には、ソリューションに多数の重要なファイルが作成されます。

プロジェクト内のすべてのファイルは、 ソリューションエクスプローラに表示されます。

プロジェクトの重要なファイルのいくつかは次のとおりです。

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！」に変更します。これを行うには、最初にボタンをタップして選択し、プロパティウィンドウをスクロールしてコンテンツを探し、テキストを目的の文字列に変更します（「話す！」）。
また、ページの背景色も変更します。各ページには、他のすべての要素を含む親要素（通常はグリッド）があります。したがって、親グリッドの色を変更します。これを行うにはグリッドをタップし、 ブラシ>背景をプロパティウィンドウから目的の色に変更します。

UIはカスタマイズした後、このようになります。

コードの背後
今すぐボタンをクリックして何かをやりましょう！
ボタンをクリックするとイベントがトリガされ、ボタンをクリックしたときに便利な処理をするためにイベントを処理する必要があります。
イベントハンドラの追加
クリックイベントハンドラをボタンに追加するには、ボタンを選択してプロパティウィンドウに移動し、 稲妻アイコンを選択します。このウィンドウは、選択した要素（この場合はボタン）で使用可能なすべてのイベントで構成されています。次に、 クリックイベントの横にあるテキストボックスをダブルクリックして、ボタンクリックイベントのハンドラを自動生成します。

この後、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アプリケーションを作成する

入門