Win8 Store apps / WP8 Advent Calendar のアプリをリリースしました

この記事は Windows 8 Store apps Advent Calendar の13日目のエントリです。

• 前日: kaorunakajima さんの 「ストアアプリのPasswordVaultで安全にユーザー名とパスワードを保管する 」
• 翌日: tanaka_733 さんの 「Bing Maps SDK for Windows Store apps を使ってみる (2) -現在地の表示と追跡を行う-」

まぁ、 宣伝のエントリーですw
といいつつ、 真面目な話もします f(^^;

• 12/12 00:26 に提出したアプリが、
• 12/13 12:52 にリジェクトされて、
• 12/13 15:40 に再提出したら、
• 12/13 20:11 に認定されました。

Windows ストアの審査が、 けっこう早くなりました(^^;
ということで、 コレ↓がリリースされました♪

bwDevTools: Metro 開発者のアドベント カレンダー 2012

次の 2つの Advent Calendar を読むためのアプリです。
•Windows 8 Store apps Advent Calendar
•Windows Phone 8 SDK Advent Calendar

みなさん、 使ってくださいね～♪

バックグラウンドで 1時間くらいごとに ATND を見に行きます。
で、 テーブルが更新されてたら、 新着数をスタート画面のタイルに表示します。
※ …そのハズなんですが、 うちでは上手く動かなくなっちゃいました。 なんでだろう… orz

● 横スクロールしない画面のレイアウト
…の場合は、 ご覧の通りコンテンツ左端の空きは無くてもOK♪ FlipViewなんで、 イメージとしては横スクロールなんですけどね f(^^;
上端のタイトル文字の位置は、 テンプレのままで、 左端を規定通りに空けてあります。

● リジェクトの理由と対策

The captions for the screenshots are not properly localized for each language the app is supported in.

つまり、 ストアに上げるスクリーンショットに付けたキャプションが日本語じゃない、 って言われてます。 画面の説明に "Windows 8 Store apps Advent Calendar" 以上のことを書け、 と… orz

しょうがないので、「のページ」を付けましたw
"「Windows 8 Store apps Advent Calendar」のページ" と変更して、 再提出。 f(^^;

● バックグラウンド・タスクの作り方
今日は時間が無いので (…っていうか、たぶん近々記事のネタにするので)、 説明はパス。 WinMD から PCL を呼び出すカタチにしてみたんだけど、 WP8 に移植しない限りは、 PCL を使うとややこしくなるだけ損する感じw

バックグラウンド・タスクは WinMD に作らなきゃいけないので、 必然的にロジックの大部分は WinMD (と、 その先の PCL) に入ります。

そうそう、 バックグラウンド・タスク完了時の Completed イベントを受け取るハンドラは、 別スレッドで動かされます。 ので、 ハンドラ内で UI を操作するには Dispatcher を使って
await Dispatcher.RunAsync(
  CoreDispatcherPriority.Normal,
  async () => await UIほげほげ()
);
…ってな書き方をしないといけません。

● カレンダーの作り方
大本は先日の記事「[Metro] 今月のカレンダーを Windows ストア アプリで表示する」に書きました。GridView じゃなくて Grid の中に、コードからパーツを突っ込んでやります。

その記事では、 Grid の中に Frame と TextBox を入れてましたが、 今回のアプリでは別途作ったユーザーコントロールを突っ込んでます。
そして Grid 全体 (裏のコードも含めて) を、 これまたユーザーコントロールにまとめました。
MainPage には FlipView を置いて、 その中に Grid のユーザーコントロールを配置して出来上がり、 というカラクリです。

マスの1つ1つは、 DataTemplate にしてやるのが王道でしょうけど、 汎用性のある Grid を作るわけじゃないので、 ユーザーコントロールで誤魔化しました。 だからデータバインドしてませんw

● ブラウザの開きかた (その1)
カレンダーのマスをクリックすると閲覧画面に遷移します。 で、 WebView で表示するんですな。
ところが、 WebView の中でリンクを辿られると、 戻ってこれないわけです。 絶賛迷子になります。

そこで、 URL を WebView に喰わせるんじゃなくて、 一旦メモリにダウンロードしてからその文字列を WebView に渡してやります。
ただし、 渡す前にちょろっと細工をするわけです。 head 要素の中に base 要素を突っ込んでやって、 「リンク先は全部 "_blank" で開きやがれ!」 と言い聞かせます。 script でリンクを開いてるとこはどうにもなりませんが、 普通のリンクはブラウザが立ち上がるようになります。

● ブラウザの開きかた (その2)
閲覧画面は、 ぶっちゃけ不要なわけです。 カレンダーのマスをクリックしたらブラウザに切り替わってくれて、 ぜんぜんオッケー♪
…なんだけど、 それやるとリジェクト喰らう可能性があります。
「カレンダーの記事を読むところまでがアプリのエクスペリエンスのはずだ、 そこまでアプリ内で完結していなければならない!」 …とかなんとか言われそう(汗;

で、 イランのだけど WebView の画面を付けました。
で、 その閲覧画面からブラウザに飛ぶためのボタンを、 タイトルの先頭に付けちゃいました f(^^;
戻るボタンのすぐ右です (上の画像)。
丸いボタンをアプリバー以外の場所に置いても、 審査に通ったよ～♪

● ブラウザの開きかた (その3)
カレンダーをスナップしてる時。
これはもう、 フィル側にブラウザを開いて、 ガンガン記事が読めないと馬鹿みたいなもんです f(^^;

ApplicationView.Value プロパティが、 現在の画面の状態を教えてくれます。
これが ApplicationViewState.Snapped だったらスナップされているので、
そのときは画面遷移せずに Launcher.LaunchUriAsync() で直接ブラウザを開くようにしました。

---

とりあえず、 今回の説明はこんなところで f(^^;

「これどーやんの?」 ってところがあれば、 twitter か facebook で突っ込んでくだされば簡単な説明はします (コード提示して解説が必要なんて場合は、 気が向いたらね～f(^^; )。

そうそう、 このアプリは日本語フォントに Yu Gothic を指定しています。 インストールしてなければ Meiryo ね。 「キャプチャ画像と違う!」 って言わないよーに :-p