ロジックヴィジュアル、サウンド、テキスト、コードの間を彷徨いながら、感じたこと考えたことを綴ります。検索アプリケーションの作成、前回からの続きです。前回の手順のように作業を進めると、XAMLデザイン画面にタイトルとPanoramaコントロールが重なっています。~~略~</controls:Panorama></Grid>といった構造にしておきます。この記事では一手順ずつ作業を進めるため、<controls:PanoramaItem>要素もitem1の1個だけにして、item2の要素は削除しておいてください。<controls:Panorama>要素の中に、最初の子として(<controls:PanoramaItem>の先の兄弟要素として)、次の3行を追加します。/></controls:Panorama.Background>※注意!本稿では執筆速度の都合上、大なり記号や小なり記号を、全角の<>で入力しています。そのため、記事のコードをそのままコピー&ペーストして利用しても動作しません。コピペで済ませたい場合は、テキストエディタなどで半角記号に置換してください。<controls:PanoramaItem>の子としてListBoxコントロールを追加し、その子として複数のTextBlockコントロールとImageコントロールを、次のような順番に並ぶように追加します。Name="TextBlock6"コントロールを配置できたら、コントロールの各種プロパティを追加、設定します。VS2010のインテリセンス機能はすばらしく、プロパティ名を入力すれば値の候補が表示されますから、XAMLコードを直接編集しても、さほど手間はかかりません。コントロールのコード内をクリックし、VS2010の画面右側のプロパティから設定することもできます。TextBlockには、処理を記述する際分かりやすいように、Textを追加しておきます。長い文字列が表示される可能性があるTextBlockには、テキスト回り込み(TextWrapping="Wrap")を設定しておきます。本サンプルでは、最低限のプロパティを設定しています。処理との絡みから設定不要のプロパティもありますので、注意深く作業を進めてください。/></ListBox></controls:PanoramaItem></controls:Panorama></Grid>ここで、アプリケーションの背景に画像を敷きます。1024×768のpng画像を用意してください。適当な手持ちの画像がない場合は、下記のサンプル画像を保存して利用してください。(単なる格子柄のテーブルクロスの画像です)プロジェクト名を右クリックして「追加/新規フォルダ」を選択し、imageという名前のフォルダを作成します。作成したフォルダを右クリックして「既存のアイテム」を選択し、png画像を追加します。/>の中をクリックし、VS2010の画面右側のプロパティのImageSourceの「...」をクリックして、いま追加した画像ファイルを選択して「OK」をクリックします。コードは次のようになります。/></controls:Panorama.Background>この段階では、まだ、XAMLデザイン画面の背景は、デフォルトの黒のままです。ここで一度デバッグしてみましょう。「エミュレーター」を選択します。「デバッグ/デバッグの開始」を選択します。図のように、XAMLデザイン画面に背景が敷かれました。TextBlockのTextプロパティに指定した文字列も表示されています。確認できたら、「デバッグ/デバッグの停止」をクリックします。エミュレーター右側の「×」をクリックして、エミュレーターを終了します。Comment(0)最新の投稿フリースを封印した日。絵を描き、詩を書き、曲を書き、文を書き、企画書と仕様書を書き、コードを書き、思索を続ける、四国の人。思い出が、未来が、消える。ライフログを無効化する、香害。~嗅覚センサーを見直そう(18)~カフェの閉店に見る、飲食店の社会的役割。~嗅覚センサーを見直そう(17)~香害蔓延社会。