MetroStyleApp入門 vol16:プロジェクトの初期ファイルを眺めてみる

(本記事はWindows8Consumer PreviewとVisualStudio11β環境で動作を確認しています)

　今回は「新しいアプリケーション」プロジェクトを作成した際のデフォルトのファイル構成を眺めてみようと思います。

　この辺の中身はベータ以降で変更がありそうなので、今のうちに紹介。

　「新しいプロジェクト」を作成したら生成されるファイルたちを紹介。

　BlankPage.xamlというのがスタートページになるのも後のバージョンでは変わりそう。

　（Blankはその通りだけど、作り始めたらもうBlankじゃないよね・・・）

Properties

　このディレクトリにはAssemblyInfo.csファイルがあるのみ、

// アセンブリに関する情報は、次の属性のセットを通して制御されます。
// アセンブリに関連付けられている情報を変更するには、
// これらの属性値を変更してください。
[assembly: AssemblyTitle("HelloMetroWorld")]
[assembly: AssemblyDescription("")]
[assembly: AssemblyConfiguration("")]
[assembly: AssemblyCompany("Microsoft")]
[assembly: AssemblyProduct("HelloMetroWorld")]
[assembly: AssemblyCopyright("Copyright © Microsoft 2012")]
[assembly: AssemblyTrademark("")]
[assembly: AssemblyCulture("")]

　こんな風にプロジェクトのアセンブリ情報が記載されています。

参照設定

　参照設定には「.NET for Metro style apps」と「Windows」が追加されています。

　Phone7と比べてもかなりすっきりした印象。

Assets

　画像などのリソースファイル置き場。

　最初はログ画像が置かれています。

Common

　共通クラスとかユーティリティクラス的な趣のファイルが置かれています。

BindableBase.cs・・・INotifyPropertyChangedを継承したデータバインディング用の基本クラス

BooleanNegationConverter.cs・・・Boolean型を反転させるコンバーター（これCommonに置くほど使うのか？）

BooleanToVisibilityConverter.cs・・・Boolean型をVisibilityプロパティに変換するコンバーター、これはよく使いますね

LayoutAwarePage.cs・・・ぱっとみレイアウト系の便利メソッドをまとめてみたのかな？　という感じのクラス

RichTextColumns.cs・・・

StandardStyles.xaml・・・スタイルが定義されています

トツプ階層のファイル

App.xaml・・・rootFrameを持つ基礎ファイル。Windows Phoneでもおなじみ。

BlankPage.xaml・・・最初に表示されるページ

Package.appxmanifest・・・アプリの設定やコントラクタの宣言を行う設定ファイル

Commonの中身などは増えたり減ったりしそうですねー。

Application Excellence Labが開始されます

　Windows8のMetroスタイルアプリケーションはメトロUIの作法だったり、コントラクタやスナップなど独自の作法が多く、アプリ製作者はその作法に則ることが求められます。

　そのためアプリ申請で弾かれたり、苦戦しないようにという配慮からマイクロソフトがApplication Excellence Labというイベントを開始するようです。

　内容はWindows8のMetroスタイルアプリをマイクソロソフトの担当者に見てもらいアドバイスを受けれるというものの模様。

　それまでにWindows8のアプリを作成しておく必要はありますが、Windows8のアプリ開発で一歩先駆けようと思うなら貴重な情報が手に入るチャンスです。

詳しいお申込み方法などに関するお問い合わせは、

kk5metro@microsoft.comまで。

　ということですので、興味がある方はぜひ積極的に参加してみてください。

5月11日はWindowsPhoneハンズオンin 広島 Vol9です

　5月11日金曜日にWindows Phoneハンズオン in 広島のVol9を開催します。

　本当には隔週ぐらいでやろうと思っていたのですが前回から一か月ぐらいたってしまいました。

　その間にWDDや、今日のGo Metro Developer Campなどがあってめまぐるしい一か月でした。

　インプットした情報を整理してアウトプットできるように整理しないと。

　今回のハンズオンはデータバインディングについておさらいしてみようと思います。

　データバインディングとかListBoxとかって最初戸惑うポイントですよね。

　（そしてWindowsPhoneのテンプレートのデフォルトアプリ名がDataBoundAppなことに気が付きました）

　残りの時間はまったりとアプリ開発。

　Go Metroコンテストももうすぐですからね、入賞目指してアプリをたくさん開発していきたいところです。

　そんなハンズオンのお申し込みは以下から。

　広島でWindows Phone開発に興味がある方、楽しく情報交換しましょう～。

　Windows Phoneハンズオンin広島vol9申し込みページ

本の紹介:Windows Phoneアプリケーションプログラミング

　WindowsPhoneの書籍も充実してきました。

　あとは端末が・・・というのは言わない約束ですかね。

　気を取り直して、書籍の紹介。本書はアプリケーションのサンプルを紹介しながら開発について紹介するタイプの書籍です。

　UX-TVでも徹底的にExpressionBlendというコーナーを担当していた高橋忍さんだけにBlendを用いた方が効率の良い場所ではBlendを使っていたりと勉強になります。

　作成するアプリは時計、落書きアプリ、Twitter、Todoとスマフォアプリの定番という感じ。

　その分、初級者はしっかり基礎が押さえられる構成。中級者も著者の豊富な経験による注釈など勉強になることは多いはず。上級者は・・・コレクションとして購入は必須でしょうｗ

　最後の章ではパフォーマンスチューニングを中心にTipsを紹介しています。

　Windows Phoneアプリ開発入門の時もそうでしたが、開発経験の豊富な方の著作はTipsがためになりますね。

　同じ高橋忍さんのプログラミングWindows Phone (MSDNプログラミングシリーズ)がカタログ的に広く網羅していたのとは対照的に今回は実際に作れるアプリをベースに実践的な構成。2冊合わせて読むとよさそうですね。

Windows Phone アプリケーションプログラミング (Windows Phone Developer’s Guide)

UX-TV 4月27日放送分レビュー

　今回はライブタイル特集。

　ライブタイルを使ったアプリってあんまり作ったことなかったので勉強になりました。

jQueryMobile Metro対応

　本題に入る前の告知コーナーで知らされた情報。

　Webもメトロで作成！！

　ということでｊQueryMobileのメトロ対応版の紹介。

　デモはこちら

　iPhoneとかAndroidでもメトロなサイトを表示してやる！！

ライブタイル基本

　ライブタイルは2面利用できる。

　[面1]

　Count（数字が表示できるバッジ）

　BackgroundImage（背景）

　Title（全角8文字ぐらいの文字列）

　［面2］

　BackBackgroundImage（背景）

　BackContent（テキスト）

　BackTitle（全角8文字ぐいらの文字列）

　実機をお持ちの方なら二つの面をくるくると表示切替するタイルを見たことがあると思います。

　これがライブタイルの動きです。

　面の切り替えタイミングはOS依存。

利用できる画像

　jpgまたはpngファイル。

　173×173（異なるサイズの場合はこのサイズに拡大縮小します、縦横比は無視）

　リモートから画像を取得する場合は80kb以下。

タイルの更新

　ShellTileクラスないし、ShellTileScheduleクラスを用いる。

　バックグラウンドエージェント内でタイルを更新することも可能。

　ShellTileでの更新はクリックなどのユーザー操作時でないとだめだと勘違いしていましたが、そうではありませんでした。

　タイルの2面目に画像を指定するサンプルコードは以下、StandardTitleDataクラスのコンストラクタで上記　Count、　BackTitleなどのプロパティも指定可能です。

            ShellTile TileToFind = ShellTile.ActiveTiles.First();

            StandardTileData NewTileData = new StandardTileData
            {
                BackBackgroundImage = new Uri("Assets/tile2.png", UriKind.Relative),
            };
            TileToFind.Update(NewTileData);

セカンダリタイル

　2つめ以降のタイルが作成できる。

　作成できるタイルの数は制限無しのようです。

本日でいったん終了

　UX-TVは今回で一旦終了です。

　どこかのタイミングでまとめて観ようと思っていた方はこの機会にどうぞ。

　ほかのプラットフォームでは無い取組だったのでまた再開してほしいですね。

　MSのエヴァの皆様、お疲れ様でしたー。

関連：MetroStyleApp入門 vol15:タイルを利用する（その1）

今更だけどSkyDriveの容量が25GBにあげれることを知りました

　最近SkyDriveの容量が無料だと7GBの削減されたことは何となく知っていて、今まで1GBも使ってなかったのになんだか損した気分になっていました。

　が、しかし、既存ユーザーは25GBを無料で利用できるようになるようです。

　すでにアカウントを取得していて、利用していた（まったく利用していなかったアカウントは駄目らしい）場合左ナビの容量の管理のリンク先で無料の容量を増やせます。

　これまでSkyDriveを利用していたユーザーは忘れず容量を増やしておきましょう！！

MetroStyleApp入門 vol15:タイルを利用する（その1）

　Windows 8のタイルはWindowsPhoneと同様、アプリを起動しなくても色々な情報を伝えることができる大事な画面です。

　タイルの作り方によってアプリを起動してもらえるか如何に影響が出ますので、タイルは有意義に使いたいですね。

　というわけで、まずはタイルの基礎から。

設定できるファイルの大きさは2種類

　初期状態のタイルはPackage.appxmanifestで定義できます。

　「ロゴ」と「ワイド ロゴ」の2種類が定義可能です。それぞれサイズが150×150、310×150となっています。

　ワイド ロゴが設定されているとアプリ起動時のタイルはワイド ロゴ（310×150）のものに、指定してない場合はロゴ（150×150）となります。

ワイド ロゴが設定されている場合は初期状態はワイドロゴ

　ワイドのログをユーザー側で変更したい場合は右クリック（マウス操作の場合）かアイコンをちょっと下にずらす操作（タッチ操作時）でメニューを表示。「小さくする」を選択します。

　画像の「短い名前」という表記はアプリ名とは別にPackage.appxmanifestの「短い名前」項目で設定できる文字列です。

　（「短い名前」の指定がない場合はアプリ名が表示されます）

ライブタイルを利用する

　タイルには色々な情報を動的に表示することができます。

　そのように動的に情報を表示するタイルをライブタイルと呼びます。

　まずは簡単なライブタイルを表示してみましょう。

　ライブタイルで利用できるパターンはいくつか定義されており、そのテンプレートに表示を当てはめる形で設定します。

　テンプレートの種類は下記ページを参考にしてください。

Choosing a tile template

　ライブタイルを設定するコードは以下のようになります。

            XmlDocument doc = new XmlDocument();
            string str = 
                "<title><visual version=\"1\" lang=\"ja-JP\">"
              +     "<binding template=\"TileSquareText01\">"
              +         "<text id=\"1\">Tile</text>"
              +         "<text id=\"2\">ライブタイル</text>"
              +         "<text id=\"3\">TileSquareText01</text>"
              +         "<text id=\"4\">のサンプルです</text>"
              +     "</binding>"
              + "</visual></title>";

            doc.LoadXml(str);
            var tileNotification = new Windows.UI.Notifications.TileNotification(doc);

            var updater = TileUpdateManager.CreateTileUpdaterForApplication();
            updater.Update(tileNotification);

　あまり表示できる文字数は多くないので注意ですね。

バッジの表示

　メールの未読件数のような数字やいくつかのアイコンをバッジとして表示することが可能です。

　バッジとして利用可能な数字ないしアイコンは以下が参考になります。

Choosing a badge image

　バッジを表示するコードは以下です。

            var badgeXml = Windows.UI.Notifications.BadgeUpdateManager.GetTemplateContent(Windows.UI.Notifications.BadgeTemplateType.BadgeNumber);
            XmlElement badgeElement = (XmlElement)badgeXml.SelectSingleNode("/badge");
            badgeElement.SetAttribute("value", "7");
            
            BadgeNotification badge = new BadgeNotification(badgeXml);
            BadgeUpdateManager.CreateBadgeUpdaterForApplication().Update(badge);

 　次回以降はさらにバッジについて掘り下げていこうと思います。

[WP7] An attempt was made to remove a relationship between a

　Windows Phoneのローカルデータベースでちゃんとリレーションとか組んだことがなかったのでテストもかねてDBを活用したアプリを作成してみよう。

　と組み始めたらさっそくエラー

An attempt was made to remove a relationship between a {table name a} and a {table name b}. However, one of the relationship’s foreign keys (table b’s foreign key) cannot be set to null.

　nullがセットできないと言っている気がする。確かに、該当keyは以下のようにnullは許容していない。

        /// <summary>
        /// アイテムID
        /// </summary>
        private int _itemId;

        [Column(DbType = "INT NOT NULL")]
        public int itemId
        {
            get
            {
                return this._itemId;
            }
            set
            {
                if (this._itemId != value)
                {
                    this.NotifyPropertyChanging("itemId");
                    this._itemId = value;
                    this.NotifyPropertyChanged("itemId");
                }
            }
        }

　ためしにnull許容型に変更してみる。

        /// <summary>
        /// アイテムID
        /// </summary>
        private int? _itemId;

        [Column(DbType = "INT NOT NULL")]
        public int? itemId
        {
            get
            {
                return this._itemId;
            }
            set
            {
                if (this._itemId != value)
                {
                    this.NotifyPropertyChanging("itemId");
                    this._itemId = value;
                    this.NotifyPropertyChanged("itemId");
                }
            }
        }

　これでエラーは消えたが、腑に落ちない。

　さらに、おためしにカラムにCanBeNull=falseをつけてみる。

        /// <summary>
        /// アイテムID
        /// </summary>
        private int? _itemId;

        [Column(DbType = "INT NOT NULL", CanBeNull=false)]
        public int? itemId
        {
            get
            {
                return this._itemId;
            }
            set
            {
                if (this._itemId != value)
                {
                    this.NotifyPropertyChanging("itemId");
                    this._itemId = value;
                    this.NotifyPropertyChanged("itemId");
                }
            }
        }

　これだとやはりエラーになった。

　ネットで調べるとDeleteOnNull=trueをつけてやればよいらしい。

（参考）http://www.joe-stevens.com/2009/09/18/linq-to-sql-using-entityset-remove-to-delete-records/

　Assosiatioｎの指定を以下のように書き換える。

        private EntitySet<VisitHistoryTable> _visitHistories = new EntitySet<VisitHistoryTable>();

        [Association(ThisKey = "id", OtherKey = "itemId", DeleteOnNull=true)]
        public EntitySet<VisitHistoryTable> visitHistories
        {
            get
            {
                return this._visitHistories;
            }
            set
            {
                this._visitHistories.Assign(value);
            }
        }

　すると・・・

 

Invalid DeleteOnNull specification for member ‘ItemTable:System.Data.Linq.EntitySet`{table b name} . DeleteOnNull can only be true for singleton association members mapped to non-nullable foreign key columns.

　1対1の場合に使うのかな？　今回は1対多なので該当しないのか。

　ちゃんと理解できてないのだけど、null許容型に変更した状態で作業を進める。

　解決できたら解決編とローカルデータベースの使い方はちゃんと紹介したいなぁ（今後にご期待！！）

6月9日はCommunity Open Day 2012です

　Community Open Day 2012は全国のマイクロソフトの技術勉強会を開催していいるコミュニティが同日に各地で勉強会を行うイベントです。

　各会場豪華なスピーカー＋マイクロソフトのエバンジェリストが登壇しますので、全部の会場参加できたら！！　と思ってしまいます。

　広島ではMSエバンジェリスト安納さん＋MVPの方3名（上本さん、松浦さん、きよくらさん）が登壇するという豪勢な内容。

　私もWindowsPhoneとWindows8の話で登壇させていただきます。

　北陸でもMVPの小島さん、さくしまさん、主催の蒲さん、X大好き鈴木さん（紹介するのそこ？）という豪華メンバー。

　北陸の方はすでに残り10名までという盛況ぶり。参加を検討される方はお急ぎで。

　Ust配信もあるようですので、6月9日はCommunity Open Day 2012をお楽しみください。

　Community Open Day 2012広島会場申し込み

　Community Open Day 2012北陸会場申し込み

[WP7] WP7 Isolated Storage Explorerを使ってみました

　前回、[WP7] Isolated Storage Explorer Toolを利用するという内容でWindowsPhoneSDKデフォルトでついている分離ストレージを見るアプリの紹介をしました。

　今回は名前が似ているWP7 Isolated Storage Explorerを紹介します。

　CodePlexに置いてあるアプリで、GUI画面で分離ストレージの中身を確認することができます（上記画像参照）。

導入

　ダウンロードしたアプリをインストールしてWP7 Isolated Storage Explorerを起動します。

　デスクトップにない場合は

（64bit）C:\Program Files (x86)\WP7 Isolated Storage Explorer\DesktopClient

(32bit) C:\Program Files\WP7 Isolated Storage Explorer\DesktopClient

　にあります。

　起動した後は、アプリ側のプロジェクトに手を加える必要があります。

　C:\Program Files (x86)\WP7 Isolated Storage Explorer\Library\IsolatedStorageExplorer.dllを参照に追加します。

　Apｐ.xaml.csに以下の修正を加えます

        // (たとえば、[スタート] メニューから) アプリケーションが起動するときに実行されるコード
        // このコードは、アプリケーションが再アクティブ化済みの場合には実行されません
        private void Application_Launching(object sender, LaunchingEventArgs e)
        {
            // 追加
            IsolatedStorageExplorer.Explorer.Start("localhost");
        }

        // アプリケーションがアクティブになった (前面に表示された) ときに実行されるコード
        // このコードは、アプリケーションの初回起動時には実行されません
        private void Application_Activated(object sender, ActivatedEventArgs e)
        {
            // 追加
            IsolatedStorageExplorer.Explorer.RestoreFromTombstone();
        }

　参照やコードに手を入れる時点で微妙だったりしますが、デバッグはやりやすくなりますね！！

（備考）

　Empressia Windows Phone Toolというのもあるようですが私のWindows8 CP環境で動かなかったので未検証です。