毎度のお約束、本記事はプレビュー状態のOS、IDE、SDKを利用しております。製品版では異なる可能性があります。
本記事はWindows 10向けのユニバーサルWindowsアプリについて学んだことを残して行く記事です。
これまでの記事はカテゴリ「UWP(Win 10) Preview」を参照ください。
前回紹介したGitHubのサンプルコードの一つを眺めてみることにします。
ユニバーサルWindowsアプリの作り方などの参考になりそうな部分をピックアップしてみようと思います。
サンプルはGitHubからクローンするかZip形式でダウンロードしてきます。
まずはfileaccessプロジェクトを覗いてみます。基本となるファイル操作処理っぽいプロジェクト名なので、読みやすいと予想。
ファイルの構成はこんな感じ。
MainPage.xamlがあって、それぞれのシナリオに対応したxamlファイルがそれぞれある感じですね。
Windows Phone側の動作はこんな感じ。
各シナリオがリストになったメニューが表示されますが、左上の横線4本のアイコンで表示非表示が切り替え可能。このコントロールは便利そう。
メニューを消すとこんな感じ。
ストアアプリは画面幅に余裕があるので、こんな表示に。ストアアプリでもWindows Phoneでも同じXAMLっぽいですね。Win8.1の知識だとMainPage.xamlが大枠でFrameか何かを使ってそれぞれのシナリオ用のxamlを中に読み込んで切り替えるという方法かな。さて、どうでしょう。
MainPage.xamlを開いてみます。
XAMLエディターのデザインビューを見ると、左上のプルダウンで画面幅などを変更してデザインを確認できることがわかります。
MainPage.xamlのコードを見ると見慣れないコントロールがあります。RelativePanelとSplitViewというレイアウト系と思しきコントロールが二つ。メニューの仕組みなどはこの辺に答えがありそうですが、とりあえず先に進みましょう。
各ページはFrameコントロールで読み込んでいるのは予想通り。基本はWinRTの知識で行ける感は更に強まりました。
MainPage.xamlのコードビハインドを確認。
staticな変数としてMainPage(自分自身)を保持しています。
public static MainPage Current;
Frameで読み込んだ各ページから親ページの操作を行いたい場合などに利用するのかなぁ。
画面表示時に画面幅に応じてScenarioControlというname属性を持つリストボックスのSelectedIndexの値を操作しています。
protected override void OnNavigatedTo(NavigationEventArgs e) { // Populate the scenario list from the SampleConfiguration.cs file ScenarioControl.ItemsSource = scenarios; if (Window.Current.Bounds.Width < 640) { ScenarioControl.SelectedIndex = -1; } else { ScenarioControl.SelectedIndex = 0; } }
手元に横幅640以下を実現できる端末が無いなぁと困りましたが、ローカルで実行するストアアプリは幅を狭めた状態で終了すると、その時の幅で次回起動するので、それで再現。
横幅が狭い場合は、下画像のようにシナリオが選択されていない状態で起動し、ユーザーがどれかシナリオを選択することでメニューが消えて画面にシナリオが表示されるという流れになるような設定でした。確かにこの幅だと最初に何も選択されていない方が自然な動作ですね。
コードを眺めた感じ、サンプルということで、すごく処理が追いやすいコードになっています。Win 8の頃のサンプルは探し難かったなぁという苦い思い出は過去のものとなったようです。
今回はコードをざっくり眺めてみるのが主眼でしたが、ファイル操作の部分も折角なので見てみましょう。
StorageFolder storageFolder = KnownFolders.PicturesLibrary; rootPage.sampleFile = await storageFolder.CreateFileAsync(MainPage.filename, CreationCollisionOption.ReplaceExisting);
WinRTのファイル操作とほとんど同じ感覚ですね。
IoTとかだとKnownFoldersどうなるんだろとか、セキュリティサンドボックスはどう変わるのかなど細かく気になることがありますがこれも後に調べることにします。
Please give us your valuable comment