MetroStyleApp

Visual Studio 2012 RCのGridAppテンプレートとか見るとわかりますが、GridViewって便利そうだけど均一的な見た目でなんかもっさりですね。

タイルの大きさ変えたり、見た目に変化を付けたいのは人の常ということで、以下のサイトを参考に弄りましょう。

Customizing GridView Items in Metro App

まずは適当にGridViewを継承したクラスを作って PrepareContainerForItemOverride メソッドをオーバーライドします。

using App5.Data;
using Windows.UI;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Media;

namespace App5.Common
{
	public class CustomGridView : GridView
	{
		protected override void PrepareContainerForItemOverride(Windows.UI.Xaml.DependencyObject element, object item)
		{
			var obj = item as SampleDataItem;
			var gi = element as GridViewItem;
			if (obj.Title == "Item Title: 1")
			{
				gi.SetValue(VariableSizedWrapGrid.ColumnSpanProperty, 2);
				gi.SetValue(VariableSizedWrapGrid.RowSpanProperty, 2);
				gi.Background = new SolidColorBrush(Colors.Azure);
			}
			base.PrepareContainerForItemOverride(gi, item);
		}
	}
}

今回はGridAppテンプレートそのまま使ってるので、SampleDataItemのタイトルがItem Title: 1のアイテムだけ2×2なサイズで配置するようにします。適当なので適宜修正しましょう。

PrepareContainerForItemOverride には配置しようとしてるアイテムが引数として渡されて呼ばれるので、あまり深く考えずそのアイテムをどう表示したいかだけ処理します。

もちろんStyleとかも変えられるので、App.Current.Resourceとか参照して設定してもいいと思います。

最後に作ったカスタムコントロールを使用するようにXAMLを書き換えて終了。

簡単（だけど面倒）ですね。

ブチザッキ

いわゆる雑記

GridViewを弄りたい