2012年01月19日（木曜日）
MetroスタイルアプリのJavaScript版とXAML版のコントロール対比表（Developer Preview時点）
WinJS, Windows.UI.Xaml, XAML, Metro style apps
| Metro style apps using JavaScript | XAML | |||
|---|---|---|---|---|
| Expression Blend 5 DPアセット名 | WinJS名 | HTML要素 | テンプレート化されたアセット | クラス名 |
| Application Bar | AppBar | div | Command Bar, Navigation Bar | ApplicationBar |
| Button | - | button | Command Button, Command Button Flyout, Command Button Menu | Button |
| CheckBox | - | input | - | CheckBox |
| Date Picker | DatePicker | div | - | - |
| Drop-down List Box | - | select | - | ComboBox |
| - | - | canvas | - | Ellipse |
| FlipView | FlipView | div | - | FlipView |
| - | Fragments | div | - | Frame |
| - | - | div | - | Grid |
| ListView（layoutをGridLayoutに変更） | ListView | div | - | GridView |
| Link | - | a | - | HyperlinkButton |
| Image | - | img | - | Image |
| SemanticZoom | SemanticZoom | div | - | JumpViewer |
| Multi-line List Box | - | select | - | ListBox |
| ListView | ListView | div | - | ListView |
| - | - | video | - | MediaPlayer |
| - | - | audio | - | |
| Password Input Control | - | input | - | PasswordBox |
| Flyout | Flyout | div | Flyout Custom, Flyout Menu, Flyout Menu Item | Popup |
| Progress Bar | - | progress | - | ProgressBar |
| Progress Ring | - | progress | - | ProgressRing |
| Radio Button | - | input | - | RadioButton |
| Rating | Rating | div | - | - |
| - | - | canvas | - | Rectangle |
| Rich Text Input Control | - | div | - | RichTextBlock |
| Settings Pane | SettingsPane | div | Settings Pane Narrow, Settings Pane Wide | - |
| Slider | - | input | - | Slider |
| Label | - | label | - | TextBlock |
| Sing Line Text Input Control | - | input | Email Address Input Control, File Upload Control, Telephone Number Input Control, Number Input Control, URL Input Control | TextBox |
| Multi-line Text Input Control | - | textarea | - | |
| Time Picker | TimePicker | div | - | - |
| Toggle | Toggle | div | - | ToggleSwitch |
| Tooltip | Tooltip | div | - | Tooltip |
| View Box | ViewBox | div | - | Viewbox |
Permalink | コメント(0) | トラックバック(0) | 10:32 
2011年12月22日（木曜日）
「わんくま同盟 東京勉強会 #66」のセッション資料
12/17（土）に行われた「わんくま同盟 東京勉強会 #66」のセッション資料を公開します。
セッションの冒頭でWPF／SilverlightのXAMLとデモ等を用いて比較し、このくらい互換性があるのであればその差分を調べるというやり方である程度MetroスタイルのXAMLを理解できるのではないかといった趣旨の内容です。
MetroスタイルのコントロールのテンプレートをWPFアプリケーションで適用したもの
SilverlightのコントロールのテンプレートをMetroスタイルアプリケーションで適用したもの
- 主な差分一覧
- 新コントロール
- 組み込みのアニメーション
- タッチ操作
- その他の差異と注意点
Permalink | コメント(0) | トラックバック(0) | 10:32
2011年12月13日（火曜日）
わんくま同盟 東京勉強会 #66
2011年12月17日（土）に新宿で「わんくま同盟 東京勉強会 #66」が開催されます。東京勉強会では今年最後だそうです。
| セッション | スピーカー | レベル |
|---|---|---|
| とりあえず作ってみよう Metro Style アプリケーション Metro Style アプリケーションを作成する方法はいくつかありますが、今回は Javascript で作ってみます。 | インフラジスティックス・ジャパン株式会社 池原大然氏 | Lv.1くまー |
| WPF/Silverlight視点で視る MetroスタイルのXAML ある程度のWPF/Silverlight経験がある方に向けて、その違いからMetroスタイルのXAMLを読み解くセッションです。 | グレープシティ株式会社 八巻雄哉 | Lv.2くまー |
| Windows Phoneアプリ開発 Marketplaceが教えてくれたこと 初めてのスピーカーです。よろしくお願いします。Windows PhoneのMarketplaceはアプリの販売、ダウンロードの場ですが、直接フィードバックを得られるという魅力もあります。勉強目的でWindows PhoneアプリをMarketplaceに公開してみましたが、意外にも公開後のいろいろなフィードバックから学ばせてもらったことが沢山あります。そんな経験則上のTipsを中心にお話しします。 | 株式会社セカンドファクトリー 杉下高仁氏 | Lv.1くまー |
| Windows Phone アプリケーション、デモで見る開発のポイント Windows Phone アプリケーションの開発の流れやポイントについて、Windows Phone担当エバンジェリストが語ります。 | 日本マイクロソフト株式会社 大西彰氏 | Lv.1.5くまー |
| Visual Studio 11 Developer Preview をさわってみよう 次期バージョンの Visual Studio の早期評価バージョン、Visual Studio 11 Developer Previewを見てみます。Visual Studio 11 Ultimate 日本語版やTeam Foundation Server 11 日本語版 もあ ります。.NET Framework 4.5 も含めてその変化を確認してみましょう。 | えムナウ氏 | Lv.1くまー |
Metroスタイル、Windows Phone、Visual Studio 11、.NET Framework 4.5と、 これからのマイクロソフト技術（主にUIネタが多くなっていますね）のセッションがあります。
私のセッションはLv.2くまーとなっていますが、これはセッション自体の難易度が高いわけではなく、WPF／Silverlightの差分としてMetroスタイルのXAMLを理解するというセッションであるため、前提知識がいるという意味でのLv.2くまーとなります。ご参加お待ちしております。
Permalink | コメント(0) | トラックバック(0) | 13:56
2011年11月21日（月曜日）
必要な字体だけが含まれるフォントファイルを作成する方法
上記の高橋忍さんのblogで「本文で使わないのであれば、画像でも十分」と書かれていましたが、画像を作るのも案外面倒なものです。そこでここでは使用する字体だけを含むフォントファイルを作成する方法を紹介します。
- Microsoft Wordを使って、文書に必要な文字を抽出したいフォントで書きます。
- この文書を［名前を付けて保存］からXPS文書として保存します。
- 保存したXPSファイルの拡張子をZIPに変更し、解凍します。
- 解凍したフォルダの「Resources」というフォルダの中にODTTFという拡張子のファイルがあることを確認します。
- 以下のページに記載されている方法を使って、ODTTFから難読化されていないTTFファイルを作成します。
ODTTF の秘密 - 通常のフォントファイルを埋め込むのと同じ方法で作成したTTFファイルを使用します。なお、フォント名は元のフォント名と同じです。
<TextBlock FontFamily="/ParicalFontTest;component/Fonts/かきくけこipag.ttf#IPAGothic" Text="かきくけこ" FontSize="54"/>
ちなみに、今回の例として使用したIPAゴシックの“かきくけこ”の5字体だけが含まれたフォントファイルのサイズは84.5KBでした。
Permalink | コメント(0) | トラックバック(0) | 15:11
2011年11月19日（土曜日）
SilverlightとWindows PhoneのBitmapImageの読み込みは非同期で行われる
以下のようなコードを実行した場合、WPFでは問題ありませんが、SilverlightやWindows Phoneでは最後の行の部分でInvalid pointerというメッセージと共にNullReferenceExceptionが発生します。
string name = Assembly.GetExecutingAssembly().FullName;
AssemblyName asmName = new AssemblyName(name);
BitmapImage image = new BitmapImage(new Uri("/" + asmName.Name + ";component/Images/Chrysanthemum.jpg", UriKind.RelativeOrAbsolute));
WriteableBitmap bitmap = new WriteableBitmap(image);
この現象はBitmapImageのCreateOptionsプロパティの既定値が異なることに起因します。WPFでは既定値はNoneですが、SilverlightやWindows PhoneではDelayCreationです。こちらのページでは既定値はNoneと書いてありますが、これは誤りです。
CreateOptionsプロパティをNoneに設定することで、上記の問題を解決することができます。
string name = Assembly.GetExecutingAssembly().FullName;
AssemblyName asmName = new AssemblyName(name);
BitmapImage image = new BitmapImage();
image.UriSource = new Uri("/" + asmName.Name + ";component/Images/Chrysanthemum.jpg", UriKind.RelativeOrAbsolute);
image.CreateOptions = BitmapCreateOptions.None;
WriteableBitmap bitmap = new WriteableBitmap(image);
上記のフォーラムの回答に書かれているほかの解決方法として、BitmapImageのImageOpenedイベントを使って読み込み完了後に処理を行うようにする方法もあります。
Permalink | コメント(0) | トラックバック(0) | 14:46
