通常 GridView などに写真のタイルを表示する場合、ItemsSource には ObservableCollection などのように表示するコンテンツ情報を持つ ViewModel をコレクションに入れてバインドすることが多いと思います こうする代わりに PhotoViewModel を下記のような …

ユーザーコントロールとテンプレートコントロール（WPF だとカスタムコントロール）の使い分けについて、すでにどこかの偉い人が解説しているだろうと思ったら意外と情報がありませんでした 大雑把に表現するとユーザーコントロールは既存のコントロールを組…

MenuFlyout の内部に下記のように ToggleMenuFlyoutItem を配置すると選択式のメニューとして表示できます <AppBarButton Label="ネコのえさ"> <AppBarButton.Icon> <PathIcon HorizontalAlignment="Center" VerticalAlignment="Center" Data="M0,16.0044549486488L30.0405913920894,16.0044549486488 ～ 中略 ～ " /> </AppBarButton.Icon> <AppBarButton.Flyout> </appbarbutton.flyout></appbarbutton>

Visual Studio のプロパティパネルからシステムリソースを開くとデフォルトのスタイルを選ぶことができます デフォルトのデザインの色や設定を確認するために、こういった方法で探すこともできるのですが大量にあるスタイルを１つずつ確認していくことになる…

Windows ランタイムアプリにはリスト項目の背景色を交互に切り替えるオプションはありませんが、ItemTemplateSelector を利用すればそういったことは実現できます

XAML を使った UI 構築の実装手法には便利な仕組みがたくさんありますが、自分が最も好きな仕組みは DataTemplateSelector などのテンプレートセレクタです！ え？つい最近こんなネタを見たって？ネタがかぶっただけきっと気のせいです！！ なんでテンプレー…

普通はクロススライド（タイルをスクロール方向に交差する下にドラッグさせる）で項目を選択するため原則水平スクロールにするんですが、どうしても！GridView を縦スクロールしたい・・・という場合どうしたらよいか その場合はウィンドウ幅に応じて列数を…

前回の レスポンシブな大理石風背景を表示する - しっぽを追いかけて をさらに拡張して本棚風にタイルを表示させてみたいと思います 完成イメージはこんな感じ

こんな感じの背景を表示させる場合、一枚画像で表示すると解像度が変化したときに柄が崩れたり、グラデが汚くなったりするのであまりよくありません これをレスポンシブに解像度に合わせてきれいに表示されるようにしたいと思います

UP by Jawbone のライフログを Windows アプリで取得する（2）の続きです OAuth 2.0 の処理の流れはわかりましたが、途中のリダイレクト後の Uri 取得をどうするかが未解決でした とりあえずリダイレクト前までの処理を進めてみます

手書き文字の認識率を確かめるために書いた文字を読み上げるサンプルを作ってみました！

もう試験が開始されてからだいぶ経ってるので今さら感はありますが、つい先日 MCP 70-485 の資格に合格し、MCSD：Windows Store Apps Using C# を獲得しました C#/XAML の Windows アプリは任せろー！バリバリー という資格ですね これだけだとなんなので、…

ストアアプリには ProgressRing というインジケータ表示に便利なコントロールがあります ただし、このコントロールはアニメーション表示を行うだけなので、インジケータ表示中にユーザー操作をブロックする機能は持っていません というわけでどこでも呼び出…

以前の記事でスクロール位置を記憶するための Behavior を作りました Windows ストアアプリで画面遷移前のスクロール位置を記憶するための Behavior を作る - しっぽを追いかけて この実装の場合、スクロール位置のオフセットを記憶するのですが、ItemsPanel…

Windows ストアアプリの Hub 画面で、先頭に背景画像を表示するようにするととてもインパクトがあり印象的になります この場合ヘッダ部分の色を画像の背景と区別しやすい色にすると思いますが スクロールさせると背景とかぶって困ったことに；

Visibility の変更時に特定の処理をさせようと思ったらストアアプリでは VisibilityChanged のイベントは Window など限られたコントロールにしか用意されていませんでした WPF の場合 DependencyPropertyDescriptor というクラスを利用すれば行えますが、ス…

ストアアプリで大きな画像を表示する場合、 本来こんな感じに表示される画像が こんな風に見切れて表示されてしまうことがあります

ストアアプリ内で WebView を利用する場合に、スクロールキャプチャソフトのようにページ全体を画像としてキャプチャする方法はないかと探していたら普通に WebView のメソッドありました。 WebView.CapturePreviewToStreamAsync method (Windows) ただこの …

Windows ストアアプリで Path をアイコンに使った場合、多少表示負荷は上がりますが画像を利用する場合に比べ解像度による見え方の差が少なく、素材の加工もしやすいので便利です。 ただし、ボタンのアイコンとして単に Path を利用すると上記の一番左のよう…

Image コントロールの Source に画像ファイルの Uri を指定するとその画像を表示してくれますが、ファイルのサムネイル画像を表示する機能がありません・・・ ファイル一覧をストアアプリで表示するような場合・・・ サムネイル画像をアイテムとして描画する…

GridView、ListView、ListBox、ItemsControl、Hub などで DataTemplate によるデータの見え方をカスタマイズした場合、単にコントロールを XAML 内に配置した場合と違い、コードビハインドで x:Name プロパティによる直接参照ができません・・・ できるかぎ…

文章だと分かりにくいと思いますが ストアアプリでウィンドウ幅が上記のように変化しても全体が見えている状態で縦横比が維持される表示方法（俗にいうサイドパネルやレターボックスというもの）はよく目にします こんな表示を行いつつ、FlipView でページめ…

マウス利用時に FlipView の左右に表示されるナビゲーションボタン タッチ操作時には表示されないのですが、フリックでページめくりができることが気づかれないこともあるのでこのボタンを常時表示したい

ストアアプリのアプリバーは通常非表示なので、表示ジェスチャを行うまでどんな機能が用意されているかわかりにくい面があります この欠点を補うため、GridView などでアイテムが選択されているときはアプリバーを自動で表示し、アイテムの選択が解除された…

Windows ストアアプリの UX ガイドラインでは FlipView に下記のようなインジケータをつけることが推奨されています Windows ストアでもナビバー部分がこのような表示になっており、画面幅が狭いときなどに便利なのでぜひ使いたい しかし、FlipView にはイン…

Windows ストアアプリでは以下のようにツリー状の階層構造をもったコンテンツを、その階層構造に合わせたグループにまとめてそれぞれ画面分割することが多いです そのため、戻り遷移をしてより上位の画面に移る場合は、必然的にそれまで見ていた詳細画面の親…

こんな感じのボタンを押すとアイコンを選択する Flyout を表示する場合、アイコンが画像ならば Uri を ViewModel に持っておけば Binding も簡単なんですが・・・ こういうアイコンはやっぱり拡縮で劣化しないベクター素材の Path で表示したい！ ViewModel …

AppBarButton にこんな Flyout を表示するために ListView を使ってみたのですが、 AppBarButton を押したときに Flyout の中で中身が横にスライドするアニメが残ってしまいました・・・ Flyout 自体の上へせり上がるアニメと二重にインタラクションが発生す…

XAML の Path の表示位置やサイズを調整するツールを作りました

デザイナーの方にはすでに有名なツールなのかもしれませんが、アイコン作成が苦手なエンジニアにも便利な「Metro Studio」というツールがあります！ Comprehensive collection of metro style icons by Syncfusion 結構たくさんのアイコンが入っているので A…