「この漢字 読めるかな?」の改変方法 その3 ~ストア用のアプリを作ってストアに上げる~

マイクロソフトの田中達彦です。Windowsストア アプリの「この漢字 読めるかな? vol.1」のプロジェクトファイルを元に、オリジナルのアプリを作る方法を紹介していきます。 「この漢字読めるかな?」のプロジェクトは、開発元のご厚意により下記ブログ記事にて公開しています。http://blogs.msdn.com/b/ttanaka/archive/2013/01/08/10383069.aspx [前回の記事]前回(第2回)では、背景とPackage.appxmanifestを編集するところまでやりました。http://blogs.msdn.com/b/ttanaka/archive/2013/01/09/10383345.aspx今回は少し趣向を変えて、現状のアプリをWindowsストアに上げる部分を説明します。 [開発者アカウントについて]Windowsストアでアプリを公開するには、Windowsストア用の開発者アカウントを取得します。この開発者アカウントを持っている人が、Windowsストアにアプリを上げることができるのです。本ブログ記事に書いている情報は、2013年1月現在のものです。Windowsストアに関する情報は変更されることがありますので、ご了承ください。 [開発者アカウントの取得]開発者アカウントは、下記サイトより取得できます。https://appdev.microsoft.com/StorePortals/ ※ 既に開発者アカウントをお持ちの方は、次の※印まで飛ばしてください。 このサイトにアクセスし、マイクロソフト アカウント(旧LiveID)でサインインします。以下のページでは、必要事項を入力していきます。 最後の[表示情報]の部分に入れた名前は、Windowsストアにアプリを公開したときに、以下のように発行者として表示されます。一度入力すると変更は面倒なので、よく考えて名前を決めましょう。 次に、開発者契約書のページが表示されます。よく読んで、同意できる場合は同意します。 次のページは料金に関するページです。2013年1月現在、個人の場合は料金が年間4,900円かかります。 次は支払方法を指定します。(その前に、もう一度サインインを要求されることがあります)2013年1月現在で使用できるクレジットカードは、以下のものです。 ここでクレジットカードの情報を入れていきます。あとはメッセージに従って、情報を入れていきます。 [クレジットカードの少額課金]入力がすべて終わっても、まだWindowsストアにアプリを上げられません。本人確認のため、クレジットカードに少額(200円~300円程度)の課金が行われます。課金された金額を正確に入力しないと、Windowsストアにアプリを上げられないのです。後述のWindowsストアのダッシュボードにアクセスしたときに、金額を聞かれます。ここで課金された金額は、後日返金されます。 クレジットカードに課金されてから数日経つと、クレジットカードのオンライン明細でいくら課金されたかを確認できます。オンライン明細を使用されていない場合や、オンライン明細に金額がなかなか載らない場合は、クレジットカード会社に直接お問い合わせください。金額を教えてくれるはずです。 ※ 既に開発者アカウントをお持ちの方は、ここからお読みください。 [Windowsストアのダッシュボード]開発者アカウント取得後に、以下のサイトにアクセスするとWindowsストアのダッシュボードが表示されます。https://appdev.microsoft.com/StorePortals/ 新しくアプリをストアに上げるときには、左側のメニューの[アプリの提出]を選択します。ページ中央に以下の画面が表示されますので、ひとつずつ必要事項を入力していきます。 ここを全て説明すると長くなりますので、ポイントだけ説明します。 アプリの名前 : ここで入力した名前がアプリの名前となり、Windowsストアに表示されます。既に登録されているアプリ名と同じ名前をつけることはできません。もし使いたい名前があれば、早めに登録しておきます。 販売の詳しい情報 : アクセシビリティの部分は、特にアクセシビリティ用のコードを実装していないときはチェックしません。 パッケージ : 後ほど説明するアプリ パッケージをドラッグ アンド ドロップします。 説明 : ストアにアプリを上げるために、少なくとも1つのスクリーンショットが必要です。スクリーンショットも後述します。 審査担当者へのコメント : 簡単にテストできるアプリならコメントなしでも構いませんが、テストが難しい場合や、使い方が難しい場合は、どのようにテストするべきかなどを記述します。 [アプリ パッケージの作成]Windowsストア アプリは、アプリ パッケージと呼ばれる1つのファイルで構成されます。このパッケージは、以下の手順で作ります。1. Visual Studio 2012でプロジェクトファイルを開きます。2. メニューの[プロジェクト]-[ストア]-[アプリパッケージの作成]を選択します。Expressの場合は[ストア]メニューがあります。3. Windowsストアにアップロードするパッケージを作成しますか? と聞かれたら、[はい]を選択します。4. 開発者アカウントの情報を入力します。5. 既に登録しているアプリ名の一覧が表示されますので、使用するアプリ名を選択して[次へ]をクリックします。6. バージョン番号や作成するパッケージの対応CPUを入力するダイアログが表示されたら、特に指定がない限り[作成]をクリックします。もし既にそのアプリをストアで公開しているときは、バージョン番号を必ず上げておきます。…


「この漢字 読めるかな?」の改変方法 その2 ~背景やタイルの設定~

マイクロソフトの田中達彦です。Windowsストア アプリの「この漢字 読めるかな? vol.1」のプロジェクトファイルを元に、オリジナルのアプリを作る方法を紹介していきます。 「この漢字読めるかな?」のプロジェクトは、開発元のご厚意により下記ブログ記事にて公開しています。http://blogs.msdn.com/b/ttanaka/archive/2013/01/08/10383069.aspx [前回の記事]第1回めの記事は、Visual Studioで新しいプロジェクトを作成し、ソースファイルをコピーして動かすところまでを説明しています。http://blogs.msdn.com/b/ttanaka/archive/2013/01/08/10383100.aspx今回は、その続きとして背景やタイルの設定を説明します。 [背景の変更]背景は、オリジナルのプロジェクトのAnimalUranai\Assetフォルダーに入っている、image001.pngという画像を使用しています。このimage001.pngをそのまま作成したプロジェクトのAssetフォルダーにコピーすれば、同じ背景を使うことができます。コピーするには、ソリューション エクスプローラーに表示されているAssetの上で右クリックし、[追加]-[新しい項目]と進んで画像を選択するか、image001.pngをエクスプローラーからVisual Studioのソリューション エクスプローラーの表示されているAssetフォルダーにドラッグ アンド ドロップします。 背景は質問(場面)ごとに変えることもできます。以下のコードはMainpage.xaml.csの一部で、アプリを起動したときに最初に表示される文章のデータです。このときだけ別の背景にしたいときは、別の背景の画像をimage002.pngという名前で用意します。そして、黄色くマーカーしている部分の1という数値を2に変更します。 // 場面1scene = 1;Message[scene] = “漢字の読み方に関する質問を20問出題します。20問中、いくつ読むことができるでしょうか?”; Command[scene, 0] = “開始”;Command[scene, 1] = “”;Command[scene, 2] = “”; NextScene[scene, 0] = 2;NextScene[scene, 1] = 0;NextScene[scene, 2] = 0; ImageNumber[scene] = 1; MaxPoint[scene] = 0;AnswerPoint[scene, 0] = 0;AnswerPoint[scene, 1] = 0;AnswerPoint[scene, 2] = 0;…


「この漢字 読めるかな?」の改変方法 その1

マイクロソフトの田中達彦です。Windowsストア アプリの「この漢字 読めるかな? vol.1」のプロジェクトファイルを元に、オリジナルのアプリを作る方法を紹介していきます。 「この漢字読めるかな?」のプロジェクトファイルは、開発元のご厚意により下記ブログ記事にて公開しています。http://blogs.msdn.com/b/ttanaka/archive/2013/01/08/10383069.aspx [新しいプロジェクトの作成]「この漢字読めるかな?」を改変するには、ダウンロードしたプロジェクトファイルをそのまま使わず、Visual Studioで新しいプロジェクトを以下の手順で作成します。 1. Visual Studio 2012を起動します。2. メニューの[ファイル]-[新規作成]-[プロジェクト]を選択します。Express版をご使用のときは、[ファイル]-[新しいプロジェクト]を選択します。3. 新しいプロジェクトダイアログが表示されたら、左側のテンプレートの部分の[Visual C#]-[Windowsストア]を選択します。4. ダイアログの中央に[新しいアプリケーション(XAML)]とあるので、それを選択します。5. ダイアログの下のほうに[名前]という部分があるので、作ろうとしているアプリの名前を入力します。このアプリの名前は、後ほど使います。 [ファイルの置き換え]ダウンロードした「この漢字読めるかな?」プロジェクトに含まれる以下の2つのファイルを、作成したプロジェクトの同じ名前のファイルに上書きします。MainPage.xamlMainPage.xaml.cs [MainPage.xamlの書き換え]MainPage.xamlの以下のAnimalUranaiと書いてある黄色くマーカーした部分を、上記手順5で指定した名前に変更します。2か所あります。 <Page    x:Class=”AnimalUranai.MainPage”    xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation”    xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml”    xmlns:local=”using:AnimalUranai”    xmlns:d=”http://schemas.microsoft.com/expression/blend/2008″    xmlns:mc=”http://schemas.openxmlformats.org/markup-compatibility/2006″    mc:Ignorable=”d” SizeChanged=”Page_SizeChanged_1″ Background=”Navy”> <Page.Resources>(後略) [MainPage.xaml.csの書き換え]MainPage.xaml.csの以下のAnimalUranaiと書いてある黄色くマーカーした部分を、上記手順5で指定した名前に変更します。 using System;using System.Collections.Generic;using System.IO;using System.Linq;using Windows.Foundation;using Windows.Foundation.Collections;using Windows.UI.Xaml;using Windows.UI.Xaml.Controls;using Windows.UI.Xaml.Controls.Primitives;using Windows.UI.Xaml.Data;using Windows.UI.Xaml.Input;using Windows.UI.Xaml.Media;using Windows.UI.Xaml.Navigation; using Windows.UI.Xaml.Media.Animation;using System.Windows;using Windows.UI.Xaml.Media.Imaging; using Windows.ApplicationModel.DataTransfer; using Windows.UI.Notifications; // 空白ページのアイテム テンプレートについては、http://go.microsoft.com/fwlink/?LinkId=234238 を参照してください…


「この漢字 読めるかな?」のプロジェクト/ソースコード公開

マイクロソフトの田中達彦です。Windowsストア アプリの「この漢字 読めるかな? vol.1」のプロジェクトファイルを、開発元のご厚意により公開します。 このプロジェクトファイルはサンプルとして公開され、使用条件は以下のMicrosoft Limited Public Licenseに準拠します。http://msdn.microsoft.com/ja-jp/gg415737.aspx#P 改変については、Windowsストアにそのアプリを公開する場合にのみ、このプロジェクトファイルの一部を改変して、オリジナルのアプリを作ることを許諾します。 [この漢字 読めるかな?]このアプリは、難しい漢字の読み方を当てていくアプリです。全20問で構成されています。現在vol.1からvol3までリリースされています。それぞれ、以下よりインストールしてください。vol.1 (ふりがな編1)http://apps.microsoft.com/webpdp/app/9304e135-c917-432d-8ff5-0b19446f68d9vol.2 (難読編1)http://apps.microsoft.com/windows/app/vol-2/7f4ae34f-4a0b-4446-ae5a-8b3173985446vol.3 (魚へん1)http://apps.microsoft.com/windows/app/vol-3/2997a2eb-beda-4fc1-8ebb-8df4c91a9568 [元アプリ]この漢字読めるかな? は、もともと「アニマル占い」として作っていたアプリを開発元に渡して、改変してもらったものです。アニマル占いについては、下記サイトよりインストールできます。http://apps.microsoft.com/webpdp/app/c128709a-093a-4c82-822f-5a19e644588a アニマル占いのときは、各設問に関して点数をつけ、選択肢によって得点率が変わってきました。最終的に、何パーセントの得点を得たかで性格を判定しています。この漢字読めるかな? は、読み方があっているかどうかを0か1で判断しています。コメントの一部やフォルダー名にアニマル占いの情報が入っています。ご容赦ください。 この漢字読めるかな? の内部構造については、おいおい説明していきます。 (2013/1/8 18:02追記)[改変方法について]以下に改変方法の掲載を始めました。http://blogs.msdn.com/b/ttanaka/archive/2013/01/08/10383100.aspx マイクロソフト田中達彦 Kanji01_130108_blog.zip

2