デスクトップのクラウディアさんが声で励ましてくれるプログラムを作る

連載 :

2013年5月7日(火)

ピクチャライブラリへのアクセス許可

ピクチャライブラリに内に、claudiaXMLというフォルダを作成して、claudiaInfo.xmlを保存しますので、ピクチャライブラリへのアクセス権が必要になります。ソリューションエクスプローラー内のPackage.appxmanifestをダブルクリックして開きます。「機能」タブ内の「画像ライブラリ」にチェックを付けます（図4）。

図4：Package.appxmanifestを開いて「画像ライブラリ」にチェックを付ける（クリックで拡大）

Windows ストア空白のページの作成(ClaudiaShowPage.xaml)

VS2012のメニューの「プロジェクト(P)／新しい項目の追加(W)」と選択して、左に表示される項目からWindows ストアを選択します。右に表示されるテンプレートから「空白のページ」を選択します。「名前(N):」にはClaudiaShowPage.xamlと指定して、[追加(A)]ボタンをクリックします。

コントロールの配置

ツールボックスからClaudiaShowPage.xamlのデザイン画面上にコントロールを配置します。
Imageコントロールを1個、MediaElementコントロールを1個、Buttonコントロールを2個、TextBlockコントロールを1個配置します。
書き出されるXAMLコードはリスト3、レイアウトは図5のようになります。

リスト3　書き出されたXAMLコード(ClaudiaShowPage.xaml)

（1）名前がClaudiaImageという要素を配置しています。
（2）名前がMediaElement1という要素を配置しています。IsLoopingプロパティにTrueを指定していますので、[Stop]ボタンがタップされるまで言葉を喋り続けます。
（3）名前がplayButtonという
（4） stopButtonという名前の
（5）メッセージを表示する要素を配置しています。

01<Page
02  x:Class="Claudia.ClaudiaShowPage"
03  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
04  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
05  xmlns:local="using:Claudia"
06  xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
07  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
08  mc:Ignorable="d">
09  <Grid Background="{StaticResourceApplicationPageBackgroundThemeBrush}">
10    <Image x:Name="ClaudiaImage" HorizontalAlignment="Left" Height="642" Margin="600,59,0,0" VerticalAlignment="Top" Width="221"/>■（1）
11    <MediaElementx:Name="MediaElement1" HorizontalAlignment="Left" Height="61" Margin="1015,336,0,0" VerticalAlignment="Top" Width="273" IsLooping="True"/>■（2）
12    <Button x:Name="playButton" HorizontalAlignment="Left" Height="95" Margin="863,263,0,0" VerticalAlignment="Top" Width="100" Style="{StaticResourcePlayAppBarButtonStyle}" IsEnabled="False"/>■（3）
13    <Button x:Name="stopButton" HorizontalAlignment="Left" Height="85" Margin="863,363,0,0" VerticalAlignment="Top" Width="100" Style="{StaticResourceStopAppBarButtonStyle}"/>■（4）
14    <TextBlockHorizontalAlignment="Left" Height="144" Margin="42,614,0,0" TextWrapping="Wrap" Text="Stopアイコンで音声を中止してから戻ってください。" VerticalAlignment="Top" Width="524" FontFamily="Meiryo UI" FontSize="48" FontWeight="Bold" Foreground="Crimson"/>■（5）
15  </Grid>
16</Page>

図5：各種コントロールを配置した（クリックで拡大）

次に、ソリューションエクスプローラー内のMainWindow.xamlを展開して表示される、MainWindow.xaml.vbをダブルクリックしてリスト4のコードを記述します。

ロジックコードを記述する

リスト4　(MainWindow.xaml.vb)

`1`	`Option Strict On`

ファイルやフォルダ、およびアプリケーションの設定を管理するクラスの含まれる、Windows.Storage名前空間をインポートします。

`1`	`Imports Windows.Storage`

シーケンシャルアクセスストリームおよびランダムアクセスストリームに対する読み込みと書き込みのサポートを提供するクラスの含まれる、Windows.Storage.Streams名前空間をインポートします。

`1`	`Imports Windows.Storage.Streams`

ClaudiaInfo構造体を定義します。文字列型のClaudiaImageとmyWavプロパティを定義しておきます。

1Structure ClaudiaInfo
2  Property ClaudiaImage As String
3  Property myWav As String
4End Structure
5Public NotInheritable Class MainPage
6  Inherits Page

XMLの要素を表すXElementクラス型のメンバ変数、xmldocとwavXmldocを宣言しておきます。

1Dim xmldoc As XElement
2Dim wavXmldoc As XElement
3 
4Dim claudiaSelectedImage As String
5Dim wavSelectedFile As String

ページがアクティブになった時の処理

ピクチャライブラリにアクセスします。
CreateFolderAsyncメソッドでピクチャライブラリ内にclaudiaXMLというサブフォルダを作成します。
CreationCollisionOption.OpenIfExistsを指定すると、既に同名フォルダが存在する場合は、そのフォルダ名を返し、存在しない場合は新規に作成されます。

GetFilesAsyncメソッドでclaudiaXML内のファイルを取得します。CountプロパティでclaudiaXMLサブフォルダ内にあるファイルの個数を取得し、0より大きい場合、つまりファイルが存在する場合は、Folderアイコンの使用を可能にします。それ以外は使用不可とします。

XElement.LoadメソッドでXML文書ファイル(Claudia.xml)を読み込みます。

ClaudiaInfo構造体型の新しいリストであるmyClaudiaInfoを作成します。
Descendantsメソッドで全ての子孫要素のコレクションに対して、その要素を変数resultに格納しながら反復処理を行います。
ClaudiaInfo構造体のClaudiaImageプロパティに、ms-appx:///Images/という文字列と要素の属性”small”の値を連結して指定します。その値をAddメソッドでmyClaudiaInfoオブジェクトに追加します。
claudiaListBoxのItemsSourceプロパティにmyClaudiaInfoオブジェクトを指定します。
リストボックス内に小さなクラウディアの一覧が表示されます。

XElement.LoadメソッドでXML文書ファイル(sound.xml)を読み込みます。

ClaudiaInfo構造体型の新しいリストであるmySoundListを作成します。
Descendantsメソッドで全ての子孫要素のコレクションに対して、その要素を変数resultに格納しながら反復処理を行います。
ClaudiaInfo構造体のmyWavプロパティに、要素の属性”word”の値を指定します。
その値をAddメソッドでmySoundListオブジェクトに追加します。
wavListBoxのItemsSourceプロパティにmySoundListオブジェクトを指定します。
するとリストボックス内に言葉の一覧が表示されます。

非同期処理で行われるため、メソッドの先頭にAsyncを追加します。

01Protected Overrides Async Sub OnNavigatedTo(e As Navigation.NavigationEventArgs)
02  Dim myStorageFolder As StorageFolder = Windows.Storage.KnownFolders.PicturesLibrary
03  Dim mySubFolder = Await myStorageFolder.CreateFolderAsync("claudiaXML", CreationCollisionOption.OpenIfExists)
04  Dim myFile = Await mySubFolder.GetFilesAsync()
05  If myFile.Count> 0 Then
06    openButton.IsEnabled = True
07  Else
08    openButton.IsEnabled = False
09  End If
10 
11  xmldoc = XElement.Load("claudia.xml")
12  Dim myClaudiaInfo As New List(Of ClaudiaInfo)
13  For Each result In From c In xmldoc.Descendants("Item") Select c
14    With myClaudiaInfo
15      .Add(New ClaudiaInfo With {.ClaudiaImage = "ms-appx:///Images/" &result.Attribute("small").Value})
16    End With
17  Next
18  claudiaListBox.ItemsSource = myClaudiaInfo
19 
20  wavXmldoc = XElement.Load("sound.xml")
21  Dim mySoundList As New List(Of ClaudiaInfo)
22  For Each result In From c In wavXmldoc.Descendants("Item") Select c
23    With mySoundList
24      .Add(New ClaudiaInfo With {.myWav = result.Attribute("word").Value})
25    End With
26  Next
27  wavListBox.ItemsSource = mySoundList
28End Sub

クラウディアの表示されているリストボックスからクラウディアが選択された時の処理

claudiaListBoxの選択されたインデックスの値が0かそれより大きく、且つwavListBoxの選択されたインデックスの値が0かそれより大きい場合、つまり、claudiaListBoxからクラウディアが選択され、且つ喋る言葉が選択された場合は、[Save]アイコンの使用を可能にします。それ以外は使用不可とします。

1Private Sub claudiaListBox_SelectionChanged(sender As Object, e As SelectionChangedEventArgs) Handles claudiaListBox.SelectionChanged
2  If claudiaListBox.SelectedIndex>= 0 AndAlsowavListBox.SelectedIndex>= 0 Then
3    saveButton.IsEnabled = True
4  Else
5    saveButton.IsEnabled = False
6  End If
7End Sub

開発 / Windows 8 / サンプルアプリ / クラウディア / Windows8 ストア

クラウディアのプログラムサンプル

4073_1.zip

著者

薬師寺国安

この著者の記事一覧この著者の
記事一覧

薬師寺国安事務所

薬師寺国安事務所代表。Visual Basic プログラミングと、マイクロソフト系の技術をテーマとした、書籍や記事の執筆を行う。
1950年生まれ。事務系のサラリーマンだった40歳から趣味でプログラミングを始め、1996年より独学でActiveXに取り組む。1997年に薬師寺聖とコラボレーション・ユニット PROJECT KySS を結成。2003年よりフリーになり、PROJECT KySS の活動に本格的に参加、.NETやRIAに関する書籍や記事を多数執筆する傍ら、受託案件のプログラミングも手掛ける。Windows Phoneアプリ開発を経て、現在はWindows ストアアプリを多数公開中。

Microsoft MVP for Development Platforms - Client App Dev （Oct 2003-Sep 2012）。Microsoft MVP for Development Platforms - Windows Phone Development（Oct 2012-Sep 2013）。Microsoft MVP for Development Platforms - Client Development（Oct 2013-Sep 2014）。Microsoft MVP for Development Platforms-Windows Platform Development (Oct 2014-Sep 2015）。