第 12 章: Hilo による写真の共有
この章では、オンライン写真共有サイトを通じた写真の共有を可能にする、Hilo アプリケーションの機能拡張について説明します。この機能拡張を目的として、Hilo では Windows 7 Web サービス アプリケーション プログラミング インターフェイス (WWSAPI) を使用しています。また、追加のユーザー インターフェイス (UI) とタッチ スクリーン機能を提供するために Hilo Browser アプリケーションを更新すると共に、Windows 7 タスク バー ジャンプ リストをサポートするために Hilo Annotator アプリケーションを機能拡張しています。Hilo ソース コードの最終バージョンは、こちら (英語) からダウンロードすることができます。これらの新機能について、この章で概要を説明します。
Hilo の写真共有機能には、Hilo Browser アプリケーションからアクセスできます。以前のバージョンの Hilo Browser では、ユーザーはメディア ウィンドウの写真をダブルタップ (またはダブルクリック) することにより、Annotator を起動することができました。写真に対して実行できるアクションが 1 つであったため、これで問題はありませんでした。しかし、今回、共有という新しいアクションが追加されたため、別のアプローチが必要になります。Hilo Browser の最終バージョンでは、写真をダブルタップするとスライドショー モードで写真が表示され (図 1)、画面をもう一度ダブルタップするとブラウズ モードに戻ります。
図 1 スライドショー モードの使用
.png "Gg241211.674e9ac2-0700-4599-be6b-ba52d33c0444-thumb(ja-jp,MSDN.10).png")
スライドショー モードでは、回転するカルーセルが非表示になり、選択した写真が最大化されてウィンドウいっぱいに表示されます。また、写真は一度に 1 つだけ表示されます。写真の両側に表示される矢印を使用して、左右の写真にパンすることができます。タッチ スクリーンでは、写真にタッチし、指を置いたまま左右にフリックすると、その方向にスクロールできます。これをタッチ スクリーン ジェスチャといいます。Hilo Browser では、パン (写真を変更するフリック ジェスチャ) とズームの 2 種類のジェスチャがサポートされています。
図 2 ズーム ジェスチャによる写真のサイズ変更
.jpeg "Gg241211.68721056-c2a5-416b-9371-2a2f2f282a1a-thumb(ja-jp,MSDN.10).png")
ズーム ジェスチャでは、2 本の指で画面にタッチする必要があります (図 2)。2 本の指の間隔を広げるように動かすとズーム インになり、画像のサイズが拡大されます。指と指の間隔を狭めるように動かすとズーム アウトになり、画像のサイズが縮小されます。このようなジェスチャによって、アプリケーションのより自然な操作が可能になります。
図 3 Hilo Browser の [Share] ボタンと [Annotate] ボタン
.png "Gg241211.7d065412-2fac-4e4f-abd6-49de01fbb2f1-thumb(ja-jp,MSDN.10).png")
Hilo Browser のブラウズ モードでは、図 3 のように、右上隅に 2 つのボタンが表示されるようになりました。Annotator アプリケーションを起動するためのボタンと、選択した写真をオンラインの写真共有サイトで共有するためのボタンです。ボタンの画像はそれぞれの用途を示しています。[Share] ボタンには、写真ファイルから地球 (インターネット) への動きを示す矢印が表示されています。[Annotator] ボタンには、写真と鉛筆が表示されています。通常、これらのボタンにはキャプションは表示されませんが、ボタンの上にマウス カーソルを置くと、ボタンの境界線が強調表示され、ボタンの下にキャプションが表示されます。
タスク バーのジャンプ リストの使用
Hilo Annotator アプリケーションの最終バージョンでは、Windows 7 タスク バーのジャンプ リストのサポートが追加されており、以前に編集した写真に簡単にアクセスしたり、重要なタスクをタスク バーから直接開始することができます。ただし、これらの機能を使用するには、アプリケーションを Windows シェルに登録する必要があります。Hilo には、このプロセスを支援するユーティリティ アプリケーションが用意されています。
Annotator では、最初の実行時 (たとえば、Browser で [Annotator] ボタンをクリックしたとき) に、アプリケーションが登録されているかどうかが確認され、登録されていない場合は、RegistrationHelper というユーティリティが実行されます。これは 1 回限りのアクションです。RegistrationHelper はコンソール アプリケーションであり、実行するには管理者特権が必要です。使用するアカウントに管理者特権がない場合、エラー メッセージが表示されます。管理者として RegistrationHelper を実行した場合でも、ユーティリティの実行を許可するかどうかを確認するユーザー アクセス制御のメッセージが表示されます ([はい] をクリックしてください)。RegistrationHelper ユーティリティを実行すると、アクションが成功したかどうかを示すメッセージが表示されます (図 4)。これ以降、タスク バーの Hilo Annotator アプリケーションのジャンプ リストに [最近使ったもの] を表示することができます。
図 4 登録が成功した場合の表示
.png "Gg241211.acc28013-6851-4faf-a3bb-8322c15db313-thumb(ja-jp,MSDN.10).png")
このユーティリティを使用して、Annotator の登録を解除することもできます。たとえば、コンピューターから Hilo を削除するような場合です。コマンド ラインのヘルプをリスト 1 に示します。最低でも 6 個のコマンド ライン パラメーターを指定する必要があります。最初のパラメーターは、アプリケーションを登録するか、登録解除するかを指定します (文字列 TRUE または FALSE を使用します)。次のパラメーターは ProgID (Annotator の場合は、Microsoft.Hilo.AnnotatorProgID を使用) です。ユーティリティは HKEY_CLASSES_ROOT レジストリ ハイブでこのキーを追加または削除します。その次の 3 つのパラメーターは、Annotator を登録する場合にのみ必要になります。3 番目のパラメーターは Annotator アプリケーションの完全なパスで、4 番目は Annotator で編集されるファイルの種類を識別するために使用される名前です。5 番目のパラメーターはアプリケーション ユーザー モデル ID と呼ばれる識別子で、アプリケーションのアイコンをグループ化してタスク バーの 1 つのボタンにまとめるために使用されます (Annotator の場合、Microsoft.Hilo.Annotator を使用)。残りのコマンド ライン パラメーターは、Annotator で編集するファイルの種類を示す拡張子です。
リスト 1 RegistrationHelper.exe のコマンド ライン オプション
Usage: RegistrationHelper <Register:TRUE|FALSE> <ProgID> <FullPath><FriendlyDocumentName> <AppUserModelId> <ext1,ext2,ext3,...>
アプリケーションを登録解除する場合は、ProgID とファイル拡張子を指定する必要がありますが、他のパラメーターには空の文字列を指定できます。これをリスト 2 に示します。ここでは、パス、フレンドリ名、および AppUserModelID パラメーターに空の文字列 ("") を指定しています。
リスト 2 Annotator の登録解除
RegistrationHelper FALSE Microsoft.Hilo.AnnotatorProgID "" "" "" .bmp .dib .jpg .jpeg .jpe .jfif .gif .tif .tiff .png
この登録ユーティリティは、指定した種類のファイルを開くために Annotator アプリケーションを使用できることを示す値をレジストリに追加します。さらに、登録によって、ProgID がファイルの種類と関連付けられます。ProgID はアプリケーション ユーザー モデル ID に関連付けられているため、Windows 7 に対して、これらの種類のファイルを Annotator で編集できることと、Annotator のジャンプ リストに表示できることが示されます。
Annotator に関連する [最近使った項目] の一覧は 2 つあります。1 つは [スタート] メニューの [最近使った項目] の一覧です (図 5)。[スタート] メニューに [最近使った項目] の一覧が表示されない場合は、[スタート] メニューのプロパティでこの機能を有効にすることができます。[最近使った項目] の一覧には、すべてのアプリケーションで最近使ったファイルが表示されます。図 5 では最近使った項目として、Annotator で編集した画像ファイルが 2 つ表示されています。
図 5 [スタート] メニューの [最近使った項目] の一覧の表示
.png "Gg241211.eae8ae63-2ae1-4903-8627-e0dd509a7724(ja-jp,MSDN.10).png")
また、各アプリケーションのジャンプ リストにも [最近使ったもの] を表示できます。図 6 は Annotator アプリケーションのジャンプ リストです。Windows 7 のタスク バーにある Annotator のボタンを右クリックするか、タッチ スクリーンで、タスク バーのボタンを 1 本の指でタッチしたまま、別の指で画面をタップすると表示されます。下の 3 つはすべてのアプリケーションのジャンプ リストに標準で用意されている項目で、それぞれアプリケーションの新しいインスタンスを起動する、タスク バーにアイコンを表示する、特定のウィンドウを閉じるというタスクを実行します。このジャンプ リストの上部には、Annotator で最近編集したファイルが表示されます。
図 6 Annotator のジャンプ リストの表示
.png "Gg241211.95882943-8152-4e47-ba50-666518fa6a0c(ja-jp,MSDN.10).png")
図 5 と図 6 を比較すると、Annotator の [最近使ったもの] のファイル一覧に追加されたファイルが、[スタート] メニューの [最近使った項目] の一覧にも追加されていることがわかります。Annotator が [最近使ったもの] の一覧にファイルを追加すると、そのファイルがアプリケーション ユーザー モデル ID (通常、AppID と省略されますが、これは DCOM パラメーターを指定するためのプロセスで使用される GUID と同じものではありません**) と関連付けられます。AppID によって、同じアプリケーションの複数のインスタンスのアイコンをタスク バー上でグループ化することができますが、必要に応じて、インスタンスごとに異なる AppID を指定して、それぞれ個別のアイコンをタスク バー上に表示することもできます。
[最近使ったもの] のファイル一覧で項目をクリックすると、Windows 7 ではそのボタンの AppID から ProgID を特定し、ProgID で定義されている open 動詞を使用し、指定された項目をアプリケーションの新しいインスタンスで開きます。代わりに、項目を右クリックすると、項目のプロパティ ページ (図 7) を表示する選択肢を含むコンテキスト メニューが表示されます。この図では、ファイルの種類 (フレンドリ名) が、一般的な画像の種類の説明ではなく、Microsoft Hilo Annotator となっています。重要な点は、このファイルの種類は、Annotator のジャンプ リストからプロパティ ページにアクセスした場合にのみ表示されるということです。Windows エクスプローラーからファイルのプロパティを表示した場合は、既定のファイルの種類が表示されます。
図 7 Annotator のジャンプ リストに表示される項目のプロパティ ページ
.png "Gg241211.1a68abcd-242d-45bf-85f0-08ea43c9b5f0-thumb(ja-jp,MSDN.10).png")
[最近使ったもの] のファイル一覧は、アプリケーションのジャンプ リストで使用できる標準的なカテゴリの 1 つです。図 6 は、すべてのジャンプ リストに標準で追加されるタスクを示しています。ジャンプ リストにはカスタム タスクを追加することもできます。Browser では Annotator を起動するカスタム タスクを追加しています (図 8)。この場合、タスクは Annotator プロセスを起動するシェル リンク オブジェクトです。
図 8 Browser のカスタム タスク
.png "Gg241211.79024d32-1e0c-4caa-807a-7e00c99b47fe(ja-jp,MSDN.10).png")
Windows 7 では、タスク バーのボタンをマウスでポイントしたとき (またはボタンに指を置いたとき) の既定のアクションとして、アプリケーション ウィンドウのサムネイル 画像が表示されます。開発者はこのビューをカスタマイズしたり、コントロールを追加したりすることができます。Hilo Annotator では、図 9 のように、カスタム プレビュー ウィンドウを実装しています。Annotator では 2 つの処理が行われます。1 つは選択した写真のプレビューを表示することであり、もう 1 つはクリックしてサムネイル (および Annotator 内の画像) を左右の画像に切り替えるための、2 つのボタンを表示することです。
図 9 Annotator のタスク バーのプレビュー
.png "Gg241211.7d27b0d7-eea0-4a5e-851c-9aaf3e73ddef(ja-jp,MSDN.10).png")
Flickr での写真の共有
Hilo Browser は、Flickr 上での写真の共有に対応しています。Flickr は人気の高い写真共有サイトであり、プログラムによる写真の公開を可能にする Web サービス API を実装しています。Hilo Browser では、Windows 7 Web サービス アプリケーション プログラミング インターフェイス (WWSAPI) を通じて、Flickr API にアクセスしてユーザーを認証し、ユーザーのフォトストリーム (写真の一覧) に写真をアップロードする機能が提供されています。
アプリケーションから写真を Flickr にアップロードできるようにするには、まずアプリケーションを Flickr に登録する必要があります。登録が完了すると、Flickr により、2 つの部分から成る Flickr API キーが発行されます。このキーの一方の部分はアプリケーションを識別するために使用され、もう一方の部分は Flickr API を経由するデータの署名および認証に使用されます。Hilo Browser アプリケーションは、Flickr API に対してアクションを実行する際は常に、このキーを Flickr に渡します。
Hilo アプリケーションが Flickr に登録されると、だれでも Hilo アプリケーションから、自分のアカウントに写真をアップロードすることができます。ただし、これを可能にするには、Hilo アプリケーションがユーザーのアカウントにアクセスできるように、ユーザーが Hilo アプリケーションを明示的に承認する必要があります。Flickr API キーの発行は、Flickr で Hilo アプリケーションが認識および信頼されることを意味します。ただし、ユーザーが Hilo アプリケーションを信頼するかどうかは、個々のユーザー側で選択する必要があります。
Flickr API キーの取得
Hilo Browser のソース コードには Flickr API キーは含まれていません。Flickr API を使用するには、自分でキーを取得し、Hilo Browser のソース コードに追加する必要があります。API キーの取得申請は、Flickr Services の Web サイトで行うことができます。
Hilo 用の Flickr API キーは、任意の Flickr アカウントを使用して取得できます。まだ Flickr アカウントを持っていない場合は、最初に Yahoo! アカウントを作成し、ログインした後、指示に従って Flickr アカウントを作成する必要があります。Flickr アカウントを作成したら、API キーの取得を申請できます。商用アプリケーション用のキーと非商用アプリケーション用のキーの 2 種類から選択できます。Hilo をテストするには、非商用キーの取得を申請してください。図 10 のような申請ページが表示され、アプリケーションに関する情報の入力を求められます。
図 10 Flickr API キーの取得申請
.png "Gg241211.ab0eb745-8626-4b91-8092-0bfa280fe5d6-thumb(ja-jp,MSDN.10).png")
次に、Flickr から 2 つの文字列が提供されます (図 11)。1 つはアプリケーション (ここでは Hilo) を一意に識別する API キーで、もう 1 つの文字列は、Flickr に送信するデータに署名するために Hilo で使用される共有シークレット キーです。Flickr ではこれを使用して、渡されたパラメーターの整合性を検証します。API キーとシークレット文字列は、次のセクションで説明するように、Hilo Browser のソース コードに追加する必要があるのでメモしておいてください。
図 11 Flickr API キーの取得
.png "Gg241211.d1ef5a7d-d1e9-4c68-b914-357e10d625fb-thumb(ja-jp,MSDN.10).png")
Hilo Browser への API キーの追加
Flickr API キーによって、Flickr で Hilo Browser アプリケーションが識別されます。API キーは、容易にアクセスでき、写真をアップロードするときにいつでも使用できるように、Hilo Browser のソース コードで直接定義されます。Flickr API キーを取得したら、2 つの文字列を Hilo Browser のソース コードに追加する必要があります。そのためには、Visual Studio 2010 で FlickrUploader.cpp ファイルを開き、リスト 3 に示されている 2 つの行を検索します。Flickr API キーとシークレット文字列を、この 2 つの変数に貼り付けます。
注意
暗号化シークレットのクリア テキストをコード ファイル内に格納することは、実稼働環境のコードではお勧めできません。ハッカーは簡単に実行可能ファイルをスキャンしてキーを取得できます。ただし、Hilo の目的は Web サービスへのアクセス方法を説明することであり、暗号化の方法を示すことではないので、(安全ではありませんが) 単純なアプローチを使用しています。
リスト 3 Hilo から Flickr API キーへのアクセスの提供
static wchar_t* flickr_api_key = L"";
static wchar_t* flickr_secret = L"";
Hilo Browser を使用した写真の共有
Hilo Browser アプリケーションを再コンパイルすると、写真を Flickr にアップロードできるようになります。そのためには、メディア ウィンドウで写真を選択し、[Share] ボタンをタップ (またはクリック) します。図 12 のような [Share] ダイアログ ボックスが表示されます。このダイアログ ボックスで、1 つのファイルをアップロードするか、フォルダー内のすべてのファイルをアップロードするかを指定し、使用する写真共有サービスを選択できます (現時点では Flickr のみがサポートされています)。
図 12 Flickr での写真の共有
.png "Gg241211.b46b7a00-5958-45f2-9ea7-f3a872719a77-thumb(ja-jp,MSDN.10).png")
写真をアカウントにアップロードするには、指定したアカウントへの Hilo のアクセスが許可されていることをユーザーが確認する必要があります。[Share] ダイアログ ボックスの [Upload] ボタンをクリックすると、Hilo の承認を求める承認ダイアログ ボックス (図 13) が表示されます。
図 13 Hilo による Flickr アカウントへのアップロードの承認
.png "Gg241211.dc713c86-06ab-4b18-a1d2-237dc7d777a8-thumb(ja-jp,MSDN.10).png")
[Authorize] ボタンをクリックすると、ブラウザーが起動され、Hilo を承認するための Flickr の Web ページが開きます。この Web ページの URL では、URL の GET パラメーターの 1 つとして API キーを提供することにより、Hilo が識別されます。ユーザーが Flickr にログインしていない場合、承認 Web ページ (図 14) が表示される前にログインが求められます。承認ページには、Flickr アカウントに写真がアップロードされようとしているが、その前に、このアカウントで Hilo を承認する必要があるというメッセージが表示されます。
図 14 Hilo の承認
.png "Gg241211.536fa563-e0d9-4a00-8546-5b30b995c711-thumb(ja-jp,MSDN.10).png")
Hilo に対する承認のコールバックはないので、Hilo による Flickr アカウントへのアクセスをユーザーが承認しなかった場合、Hilo 側では、写真をアップロードしようとして、アクセスに失敗したということのみ認識されます。したがって、図 14 の承認ページでどのボタンをクリックしても、図 15 の確認ダイアログ ボックスが表示されます。このダイアログは、承認が完了するまでの間、Hilo によるアップロードをブロックするためにのみ使用されます。
図 15 承認の確認
.png "Gg241211.9514d76c-7a8a-47f6-a87c-f0bafe688624-thumb(ja-jp,MSDN.10).png")
[Authorization Complete] をクリックし、Flickr アカウントにより Hilo が承認されると、アップロード プロセスが起動し、図 16 のダイアログで進行状況が示されます。アップロードが完了すると、図 17 のように、メッセージとアップロードした写真を表示するためのリンクが表示されます。
図 16 写真のアップロード
.png "Gg241211.b7abe6fb-d82c-4fbe-b706-07b95c4d958a-thumb(ja-jp,MSDN.10).png")
図 17 写真のアップロードの完了
.png "Gg241211.cf7bf14f-ae8c-4f99-a5eb-0b926e666aec-thumb(ja-jp,MSDN.10).png")
この URL リンクから、写真に説明やタグを追加できる Flickr のページに移動できます (図 18)。
図 18 アップロードした写真の Web ページ
.png "Gg241211.14f6430a-4e4e-4fd1-a142-aa992baa0a02-thumb(ja-jp,MSDN.10).png")
まとめ
Hilo アプリケーションの最終バージョンでは、いくつかの新しい UI 機能と、写真共有サイト Flickr に写真をアップロードする機能が追加されています。Hilo Browser では、写真をパンおよびズームするためのタッチ スクリーン ジェスチャがサポートされるようになりました。また、Hilo Annotator では、最近編集したファイルや主要なタスクにすばやくアクセスするためのジャンプ リストが提供されています。Hilo Browser には、Flickr API Web サービスを介して Flickr に写真をアップロードするためのコードが含まれています。次の章では、ユーザー インターフェイス機能の実装について、さらに詳しく説明します。