Windowsストアアプリってキーボードからの情報取得ってどうやるんだろ

皆さんこんばんは。どうでもいいですがブログでは朝でも昼でも「こんばんは」で行こうと思っているぜんのーです。ずっと夜ならずっと寝てられて幸せですよね。

突然ですが、友人に罵られました。

「ホームポジション汚っ！」

何を隠そう、ぜんのーはむしろIT音痴ですのでタッチタイピングなんて高等技術を習得しておりません。でもなんか悔しいので、タイピングゲームでもして練習しようと思ったわけですよ。しかしFLASHとかで公開されてるものってネットにつながってないと使えないじゃないですか。なので、

ストアアプリとして作って自給自足のスローライフ的な感じでいこう。

そう考えました。無いなら探すよりも作ろうというのがぜんのー的思考です。

さて、WindowsPhoneのアプリを作っていた時は文字入力するタイミングなんてTextBoxという名の文字入力ができる箱に触れた時くらいのもので、VisualStudioでツールボックスから選んでドラッグアンドドロップしたら画面内に部品（コントロールっていうらしいです）が作れていたわけですよ。こいつ↓ 

何と簡単なのでしょうか。しかしですね、躓きました。

Windows8ってパソコンなんで、普通にキーボードがついてることが多いじゃないですか。で、しかもタイピングゲームってことはTextBoxに打った文字が次々出ていくのもなんか嫌じゃないですか。透明にして使おうにも、クリックしてフォーカス（←今、コンピュータがこの部品を見てるよって感じのものです）をTextBoxに合わせてもらえるのかどうかも怪しいですし。時代は、脱TextBoxですよ。

で、調べたらありました。なんか、

「画面全体にフォーカスが合っていて、キーボードの入力があったら何が押されたかを通知する」

みたいな感じらしいです。よくわかりませんが。

実際にコードを書いてみました。

// キーボードでの入力受付

protected override void OnNavigatedTo(NavigationEventArgs e)
{
    Window.Current.CoreWindow.KeyDown += CoreWindow_KeyDown;
}

void CoreWindow_KeyDown(Windows.UI.Core.CoreWindow sender,　Windows.UI.Core.KeyEventArgs args)

{

　string str = args.VirtualKey.ToString();  //ここで入力された内容を文字列にします

　str.Equals( /*ここに比較する内容*/ );
}

// ここまで

こんな感じで取得したいページの.csファイルに記述をしておけばいい感じにやってくれるっぽいです。あとは文字列同士の比較にEqualsメソッド使って正しければ云々って処理を付けていけばタイピングゲームになりそうですね。
なんかよくわかんないんですが、文字列同士を「==」という論理演算子で比べてしまうと「異なるメモリ領域に記録されている別の文字列だから一緒じゃないですよ」みたいな感じで言われてしまうっぽいので要注意です。

あと、取得してきてるVirtualKeyですが、文字のキーは大文字で取得してきますが、マイナスとかは全然違う文字の並びだったので、一度試しにキーボード入力を画面かコンソールに出力して確認した方がいいのかもしれません。

そんなこんなで出来上がったのがこの「タイピングドクター 気楽 寂」。これからバージョンアップを重ねていく予定です。

http://apps.microsoft.com/windows/app/248270af-edc3-4c70-bfac-a3b97ff34654

そんなこんなでお昼ご飯を食べなければいけませんので本日はこの辺で。

また後日。では。

祝！Windows8発売記念、キーボードショートカット抜粋

皆様こんばんは。どうでもいいですけどネットワークスペシャリスト試験で玉砕したぜんのーです。ご無沙汰しております。

さて、上記試験の勉強のためにアプリ作成を我慢していたら禁断症状で口内炎ができました。激しく三つも。まあ、どうでもいいですね。

8が発売されたものの、全てのデバイスがタッチ対応なわけではないので、今回は簡単な（よく使う）キーボードショートカットを数個書いておきます。
8のキーボードショートカットはWindowsキーを使う便利なものが多いです。スタート画面やチャームなど、今回の新機能はwindowsキーを使うようなイメージがありますね。

では早速、

Windowsキー + C

チャームの表示

Windowsキー + F

ファイル検索

Windowsキー + I

設定

Windowsキー + K

デバイス

Windowsキー + Q

アプリ検索

Windowsキー + W

設定検索

Windowsキー + Z

アプリバーの表示

Windowsキー + Tab

Windowsストアアプリの切り替え

Alt + Tab

デスクトップアプリとWindowsストアアプリの切り替え

こんなところですかね。まあ、チャームってなんやねんとかWindowsストアアプリってなにするものぞ？とかいろいろあると思いますが、まあその辺はおいおい紹介していきます。

口内炎が痛すぎるので、ほんとこのへんで勘弁してください。

また後日。では。

初めてのWindowsストアアプリ（プロジェクトを作ってみよう）

皆様こんばんは。ガムが大好きなぜんのーです。皆様いかがお過ごしでしょうか。

今回からついにWindowsストアアプリのあれやこれやについて書いていきたいと思います。

早速ですが、嬉し恥ずかし、初アプリ作成ですよ。まずはプロジェクトの作り方をざっくり見てみましょう。

↑「新しいプロジェクト...」から作成。スタートページが出ていないときは、ツールバーの「ファイル(F)」から選んでください。

↑こんな画面が出てきます。6つの中から作りたいものに一番近いものを選びましょう。右側のスペースに簡単な説明も載っています。
「新しいアプリケーション」はまっさらな画面が出てきます。
「グリッド アプリケーション」と「分割アプリケーション」はテンプレートです。選んだだけでアプリっぽい画面が作れるみたいです。
下の3つは初心者のぜんのーにはレベルの高すぎるもののような気配がぷんぷんするので今はスルーしときます。
何もないページを作ると絵的になにも面白くない気がするのでグリッドアプリケーションでも見てみましょうか。あ、名前を付けること御忘れなく。そして「OK」を押してプロジェクト作成。

「この判断があんな結果になるなんて、あの時の僕たちは思いもしなかったんだ・・・」

↑既にそれっぽい画面ができてまが、いきなり「F5」キーかツールバーの「デバック」から「デバックの開始」を選んで動かしてみます。

↑アプリの実行結果がこれ。すでにぐりんぐりん動く形になっています。恐るべし。一旦VisualStudioに戻って「Sift+F5」か「デバックの終了」でアプリを落とし、テンプレートはどんな作りになっているのかな？と思って見てみます。

案の定、つまづきました。なんでしょうか、この情報量は。このテンプレートが初見で鼻歌交じりに理解できる日は来るのでしょうか。戦慄。

↑気を取り直してソリューションエクスプローラを見てみましょう。ソリューションエクスプローラは時の左側にある三角形をクリックすると、その下の階層にあるファイルを表示できます。

「Assets」、「Common」、「DateModel」のフォルダと「～.xaml」ファイル、「Package.appxmanifest」らへんがミソでしょうか。

「Assets」はアプリ上で使用する画像ファイルなんかを入れるところみいたいです。

「Common」は何か色々入ってますね。たぶん、「StandardStyles.xaml」が見た目のデザイン。あとはプログラムで共通して使える基本機能なんでしょう。

「DateModel」はテンプレートのでサンプルとして表示する要素のサンプルなんかが入ってるみたいです。

各「～.xaml」ファイルの下の階層には「～.cs」というファイルがあります。xamlが外見、csがプログラムの中身と思っておくといい気がします。

「Package.appxmanifest」は

アプリのタイル（スタート画面に表示されているアレ）や使用する機能について明記します。

どうも、グリッドアプリケーションはWeb上のデータや、ローカル(アプリケーションの内部)に保存されたデータを「SampleDataSource.cs」のような形でアプリ上で使えるデータの入れ物に入れ直して表示するようです。

どうやらMicrosoftがグリッドアプリケーションのサンプルを用意してくれているようです。↓
http://msdn.microsoft.com/ja-jp/library/windows/apps/br211380.aspx

うん、呪文のようなコードですね。パート４とか書いてますし。まずは初歩の初歩からやれということですか。
ということで、今回はざっくりこんな感じですってことで書きました。プログラムを始めたばかりでは複雑に入り組んだコードのすべてを理解することは難しそうです。詳細は、おいおい勉強ですね。

次はサンプルのパート１とかに並ぶ簡単なことをやりながら、「Package.appxmanifest」について書ければなと思います。

また後日。では。

Windows8RTM版にVisualStudio Express2012をインストールしてみる

皆様こんばんは。まだキャラ設定が確立していないぜんのーです。
「Windows8入れれてやっほい」とかなってたら開発環境整えるの忘れてました。いやいや、スタート画面ぐりぐりしてるだけで楽しいのでつい。

というわけで、今回は無料のVisualStudio Express2012をインストールしてみます。

つまづきました。我ながらマッハすぎるつまずき方ですが、どこからダウンロードしていいのかわかりません。VisualStudioのページにいったら、「ここ、さっきも通らなかったか？」状態です。少々お待ちを。

たぶん、ここです。↓

http://www.microsoft.com/visualstudio/jpn/downloads#d-2012-express

↑ここから「Visual Studio Express 2012 for Windows 8 」と書いてある青いライン左端の「＋」を押すとは。孔明の罠ですか。

↑こうなります。そしたら、

↑ネット経由のこいつを選ぶと楽そうです。たぶん。で、例のごとく.exeファイルをどうするか聞かれると思いますので実行してみましょうか。

↑ライセンス条項は同意してチェックを入れないとダウンロードできませんね。その下のチェックボックスはお好みでどうぞ。チェック入れるとマイクロソフトの担当の方が涙を流して喜ばれるかもしれません。知りませんが。
「インストール」表示が変わったところをクリックして開始します。

↑これは「はい」を押すしかありません。ガツンと押してやりましょう。

↑こんなのが出てきたら一旦オッケーです。しかし、しばらく待ち時間が発生するっぽいので歯磨きして風呂に入ってきます。

↑風呂から出たら終わってました。素晴らしい。起動を押して早速スタートですよ。

↑はい、再びつまづきました。プロダクトキーってなんですか。よくわからないので青く色のついている「オンライン登録」を勢いでクリックしてみます。

Microsoftアカウントを登録した時に提出した情報に追加要素を記入し「続行」ボタンを押さねばならない模様。足りないものがあるとやり直しさせられるみたいです。はい、入力と。

ぜんのーはプロダクトキーを手に入れた▼

さっきのVisualStudioのTextBoxにこのキーをコピペして、次へを押します。また「変更を許可しますか」って聞かれるので許可してやります。

↑無事登録が完了しました。閉じるを押すと設定が始まりますので、終わるまで放置プレイです。・・・と思ったらすぐ終わりました。

↑これも遠慮せず「同意する」を押しときましょう。で、変更の許可をしてください。おや？まだ続くみたいです。

↑ここでMicrosoftアカウントとパスワードを入力、あんまり長時間ほったらかしにしとくとセッションタイムアウトになるので一気にやっちゃいましょう（実際タイムアウトになりましたが、再度アカウントとパスワードを入力したら大丈夫でした。）

開発者用ライセンスはいついつまでと出ますが、まあ、切れるころに通知が来ると信じています。

↑晴れて、インストールが完了しました！万歳！今夜は祝杯ですな。

製品版でも同じ形でインストールできるはず・・・ですよね。Microsoftさんお願いします。

VisualStudioに入ってるテンプレートやアプリ開発は今後書いていきます。

爪を切りたくなってきたのでこの辺で。

また後日。では。

Windows8RTM版を仮想環境にインストールしてみる（インストール編）

皆様こんばんは。ブログ初心者のぜんのーです。ぜんのーは公開範囲を制限しないことを覚えた。レベルが2に上がった。

さて、昨日は眠すぎて寝てしまったので、いよいよWindows8RTM版のインストールです。が、その前に、

・Windows8を使用するにはMicrosoftアカウントが必須

Microsoftアカウントってなんぞ？調べたら、旧LiveIDでした。「～@live.jp」みたいなメールアドレスを持っていればそれが使えます。持ってない方はこちらから行ってみてください↓

 http://windows.microsoft.com/ja-JP/windows-live/sign-up-create-account-how

さて、無事アカウントを取得できたら、VirtualBoxを起動して設定をしましょうか。

左上の、「新規」をクリックしてみます。

まあ、最近のインストールや初期設定は基本的に「はい」とか「次へ」って言っとけば何かが足りないってことにはならないからいいですね。(身元のはっきりしてるソフトorアプリに限る）

ってことで、名前に任意の名前を入れて、タイプは「Microsoft Windows」、バージョンは「Windows8」にしたら、早速「次へ」。

からの、「次へ」の連打。

↑たぶん初期値より値の多い緑色の範囲だったら大丈夫と思います。

きっと仮想環境に使うRAMも多いほうがいいんでしょうがよくわからないので初期設定でごり押し。VirtualBoxさん、頼んます。

無事、ディスクの準備を整えてくれました。コンピュータって凄いですね。

では、続いてOSのインストールです。今度はVirtualBoxの「起動ボタン」(緑色の矢印のアイコン)を押してみます。

起動ハードディスクを選択などとウインドウが出てくるので、ダウンロードしておいたWindows8RTMを選択して起動します。

言語、キーボードとも日本語でいきます。英語わかりませんし。

同意して「次へ」

インストールに入りました。戦慄のOSダウンロードが頭をよぎります。まあ、トイレ行って風呂洗ってお茶飲んでたらで済みました。素晴らしい。

洒落乙な個人設定から開始です。

↑ここで取得しておいたMicrosoftアカウントが火を噴きます。僕自身すでにWindows8をインストールしているので、この後の処理のメッセージとかに若干違いがあるかもしれません。

↑緊急連絡用の別アドレスも登録しといてください。

パソコンの準備をしていますとか言われるのでしばらく放置。待ち時間ですが、Windows8の特徴的な使い方とかの説明が流れていい感じです。しばらく待ってると「もうしばらくで完了します」とか言われました。どうやら長いと自覚しているようです。

インストールできた！万歳！

Microsoftアカウントでログインしているので、ほかのパソコンで設定したWebページのタイル(ショートカット)やデスクトップの壁紙なんかが共有されています。便利。
解像度の問題でsnapとかいうWindows8の機能を使えない状態ですが、デスクトップ上で右クリックして解像度を最大のものに設定すると使えます。(字が見にくくなったりもしますが)

※VirtualBoxにディスク入れたらマウスのキャプチャや画面の色のことをいわれるけど「はい」って言っておけばたぶん大丈夫です。

※インストール、設定の完了後に連絡用メールアドレスにメールが来ている可能性があります。必ず確認しておいてください。

Windows8RTM版を仮想環境にインストールしてみる（準備編）

皆様こんばんは。IT音痴のぜんのーです。ひょんなことからWindowsストアアプリを作ることになりました。だって、Windows8のUIデザインが気に入ったんですもん。で、少し余裕も出てきた気がするので、つまずいた所とかを記録していこうと思います。つまずいた状況を余すことなく再現、する予定です。

なにか間違えてたら教えてくださるとありがたいです。

というわけで、まずOSをインストールしなきゃ始まりませんね。

はい、つまずきました。超速でつまづきましたよ。まず、まだ店頭で買えない。というか発売さえされてない。どーするんですかと。

詳しい友人に袖の下を送りながら教えてもらいました。

・OSはWeb上からダウンロードすべし
・OSの書き換えが不安なら、仮想環境に入れるべし

なんで仮想環境に？って思ったら、どうやら評価版(RTM版)は正規品にアップグレードできないらしいです。それは困る。

OSのダウンロードは以下から↓

http://msdn.microsoft.com/ja-JP/evalcenter/jj554510.aspx

さらに問題が発生します。ページに飛んだら全編英語でございます。戦慄ですよ。さすが外資系企業恐るべし。まあ、恐れず一番下まで行くと

こんなボタンがありますので、自分のパソコンと同じビット数のボタンをクリックしてくださいませ。なんか、ダウンロードマネージャが起動されるんで、とりあえず「はい」って答えといて、自分の好きなフォルダ(わかりやすいかなと思ってデスクトップに入れました)にisoファイルをダウンロードしてみます。

Skype通話しながらだと超絶重い・・・いつ終わるんだろうか。

 何ということでしょう。貧弱な無線LANでは2時間半もかかったではないですか。

さて、気を取り直して即つまづきました。仮想環境を作るためのソフトをダウンロードしておかなければなりませんね。何それ？

どうやらVirtualBoxなる便利なアイテムが世の中には存在しているとのこと。↓

https://www.virtualbox.org/wiki/Downloads
また英語のページです。もう勢いでページの先頭にある

VirtualBox4.2 for Windows hosts 横の ×86/amd64でもクリックしてみますか。そしたら.exeのファイルどーすんのって言われるので実行すると、SetupWizardが起動しますので、とりあえずNextとかOKとか肯定しときます。途中、ショートカット作るのかとか聞かれるのでお好みで設定してください。で、インストールが始まるので、なんかインストールしますかとか言われたらOKしときます。ほんとは必要なものだけ入れればいいんでしょうが、よくわからないので全部乗せです。特盛です。

ほぼ待ち時間なしで、設定完了ですね。素晴らしい。

起動させるとこんな感じですよ。

そういえば、インストールにはMicrosoftアカウントが必要になってくるはずです。明日はそのあたりも踏まえて、インストール編を書きたいと思います。

また後日。では。