手書きで入力した住所の位置をBing Maps SDKで地図上に表示するには:2カ月で160本作った還暦開発者が送る10のアプリ開発ノウハウ(8)(5/5 ページ)
古(いにしえ)からのVBでWindows 8.1向けのさまざまな機能のアプリを開発する手順やコツを解説していく。今回は、「Microsoft日本語手書き認識エンジン」とBing Maps SDKの使い方をサンプルを交えて解説する。
Bing Mapの表示されるページのロジックコードを記述する(BingMapsPage.xaml.vb)
次に、[ソリューション・エクスプローラー]内の「BiltShowImage.xaml」を展開して表示される、「BingMapsPage.xaml.vb」のコードを記述する。
ここではコードが長くなるため、一部省略している。全てのコードは、サンプルをダウンロードして「BingMapsPage.xaml.vb」ファイルで確認してほしい。
ページがアクティブになった時の処理(OnNavigatedToメソッド処理)
Protected Overrides Sub OnNavigatedTo(e As Navigation.NavigationEventArgs) Dim myResult = DirectCast(e.Parameter, MapPosition) Dim myLatitude = myResult.myLatitude Dim myLongitude = myResult.myLogitude Dim myAddress = myResult.myAddress myMap.Center = New Location(CDbl(myLatitude), CDbl(myLongitude)) addressTextBox.Text = myAddress Dim myEllipse As New Ellipse With myEllipse .Fill = New SolidColorBrush(Colors.Crimson) .StrokeThickness = 3 .Stroke = New SolidColorBrush(Colors.Navy) .Width = 30 .Height = 30 End With Dim myStackPanel As New StackPanel myStackPanel.Margin = New Thickness(5) myStackPanel.Background = New SolidColorBrush(Colors.Navy) myStackPanel.Visibility = Xaml.Visibility.Collapsed Dim myTextBlock As New TextBlock myTextBlock.Foreground = New SolidColorBrush(Colors.Red) myTextBlock.FontSize = 24 myTextBlock.Text = myAddress myStackPanel.Children.Add(myTextBlock) Dim myLocation As Location myLocation = New Location(CDbl(myLatitude), CDbl(myLongitude)) MapLayer.SetPosition(myEllipse, myLocation) myMap.Children.Add(myEllipse) myMap.SetView(myLocation, 12) MapLayer.SetPosition(myStackPanel, New Location(CDbl(myLatitude), CDbl(myLongitude))) myMap.Children.Add(myStackPanel) AddHandler myEllipse.Tapped, Sub() myStackPanel.Visibility = Xaml.Visibility.Visible End Sub AddHandler myStackPanel.Tapped, Sub() myStackPanel.Visibility = Xaml.Visibility.Collapsed End Sub End Sub End Class
MainMageから送られた値(e.Parameter)をMapPosition構造体に変換し、myResultで参照する。
myLatitude変数に構造体のmyLatitudeの値(緯度)を格納する。myLongitude変数に構造体のmyLongitudeの値(経度)を格納する。myAddress変数に構造体のmyAddressの値(住所)を格納する。
MapのCenterプロパティにDouble型に変換したmyLatitudeとmyLongitudeの値を指定する。addressTextBoxに住所を表示する。
新しいEllipseのインスタンスmyEllipseオブジェクトを作成する。FillプロパティにCrimsonを指定し、Crimson色で塗りつぶす。枠線の太さを3に指定し、枠線の色をNavyに指定する。WidthとHeightは「30」とする。直径30pxの円が描かれる。
新しいStackPanelのインスタンスmyStackpanelオブジェクトを作成する。Marginプロパティに「5」を指定して余白を設ける。背景色にNavyを指定する。初期状態ではmyStackPanelオブジェクトを非表示としておく。
次に、TextBlockの新しいインスタンスmyTextBlockオブジェクトを作成する。文字色をRedに指定する。文字サイズは24、TextプロパティにはmyAddress変数の値を指定する。myStackPanelオブジェクトにmyTextBlockオブジェクトを追加する。
myLatitudeとmyLongitudeで初期化された、新しいLocationのオブジェクト、myLocationを作成する。
MapLayerクラスのSetPositionメソッドで、マップレイヤ内に要素の位置を設定する。この場合、myLatitudeとmyLongitudeの位置に円をセットする。MapLayerクラスは、地図上の要素の位置を保持しているマップレイヤを表すクラスだ。MapにAddメソッドでmyEllipseオブジェクトを追加する。SetViewメソッドで、その住所の位置をズームインして表示させる。
同様に、MapLayerクラスのSetPositionメソッドで、マップレイヤ内に要素の位置を設定する。この場合、myLatitudeとmyLongitudeの位置にStackPanelをセットする。MapにAddメソッドでmyStackPanelオブジェクトを追加する。
円がタップされた時は、myStackPanelオブジェクトを表示する。住所の書かれたTextBlockが表示される。myStackPanelオブジェクトがタップされた時は、myStackPanelオブジェクトを非表示にする。住所の表示されたTextBlockも非表示になる。
次回は、選択した画像をトリミングして保存させる
今回はここまでだ。また次回の記事でお会いしよう。次回は、選択した画像をトリミングして保存させる方法を紹介する。
著者プロフィール
PROJECT KySS 薬師寺 国安(やくしじ くにやす)
1950年生まれ。フリーVBプログラマ。高級婦人服メーカーの事務職に在職中、趣味でVBやActiveXに取り組み、記事を執筆。2003年よりフリー。.NETやRIAに関する執筆多数。Windowsストアアプリも多数公開中(約270本)。
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)。
PROJECT KySSは、1997年に薬師寺聖と結成したコラボレーション・ユニット
関連記事
- Bing Mapsを使ってみよう(前編):Microsoftの地図サービス、Bing Mapsを使おう
Microsoftの提供する地図検索サービス、「Bing Maps」のAPIの利用方法を紹介していきます - 今でしょ! の終わりに安齋、家入らが評価したアプリとは〜「エイっと作ろう! Windowsストア アプリ選手権」授賞式レポート
謎のキャラ今出しょう子をマスコットに据えたコンテストを勝ち上がった10作品のプレゼン模様などをお届け。 - 初のアジャイル/リモート開発体制でも成功できた秘訣とは〜「Windowsタブレット向けアプリ開発」先駆けインタビュー
日本料理のレシピを海外に紹介するアプリ「Ippin」。初物づくしのアプリ開発を成功させた秘訣をディレクターに聞いた。コミュニケーションツールやドキュメントに盛り込んだ数々の工夫とは、どんなものだったのだろうか。 - PC制御UIの最先端Leapアプリ開発入門(3):ProcessingやWindows 8.1アプリでLeapの空間ジェスチャを使うには
画面タッチやマウスなどのように“触れる”ことなく空中ジェスチャでPC操作が可能な新しいデバイスLeap Motionを使い、これまでにないアプリを開発しましょう。今回は、ゲームループやLeapのジェスチャ3種Circle、Swipe、Tap、ProcessingのLeapジェスチャアプリ、そしてMVVMパターンで指の数を検出するC#アプリについて解説します。 - Web開発者が手っ取り早くストアデビューする方法(1):Windowsストアにアプリを登録するための事前準備
Windowsストア初心者のために(主に、HTMLやJavaScriptを扱うWeb開発者向けに)、簡単なアプリを開発してWindowsストアに手っ取り早くデビューする手順を解説します。初回は、Microsoftアカウントの取得、Windowsストアアプリ開発者登録、開発環境準備について。 - 連載:Windowsストア・アプリ開発入門:第1回 Windowsストア・アプリってどんなもの?
ついにWindows 8.1の正式版がMSDNサブスクライバー向けに公開された。無償アップデートとなるため、今後は新しいWindows 8.1ストア・アプリが一般化するだろう。最新環境向けに新たにアプリ開発を始める人のための連載スタート。 - 特集:次期Windows 8.1&Visual Studio 2013 Preview概説(前編):大きく変わるWindowsストア・アプリ開発 〜 ビュー状態に関連する変更点
Windows 8.1(Preview版)の変更点や新機能を開発者視点で紹介。Windows 8用に作られたWindowsストア・アプリにはどんな影響があるのか? - UXClip(11):これからが本番、Windows 8アプリ開発
12月3日夜、Windows 8のハードウェアやアプリを開発者向けに紹介するイベントが行なわれた - Windows 8提供開始、対応アプリ登場は期待できるか?
マイクロソフトはWindows 8の提供を正式に開始した。Windowsストアもスタートし、いよいよWindows 8プラットフォームが市場投入となる。
Copyright © ITmedia, Inc. All Rights Reserved.