方法 : ListView の行の背景色を変更する
更新 : 2007 年 11 月
この例では、ListView の行の Background の色を変更するために使用できる 3 つの方法を示します。
使用例
以下のセクションでは、Background の色を変更する行がある ListView を作成する 3 つの方法を示します。また、行を追加または削除したときにビューを更新する方法も説明します。
方法 1 : IValueConverter を使用して背景色を変更するスタイルを定義する
次の例では、Background プロパティの値を IValueConverter にバインドする ListViewItem コントロールの Style を定義する方法を示します。
<Style x:Key="myItemStyle" TargetType="{x:Type ListViewItem}">
<Setter Property="Background">
<Setter.Value>
<Binding RelativeSource="{RelativeSource Self}"
Converter="{StaticResource myConverter}"/>
</Setter.Value>
</Setter>
</Style>
IValueConverter の ResourceKey を定義する例を次に示します。
<namespc:BackgroundConverter x:Key="myConverter"/>
次の例では、行インデックスに従って Background プロパティを設定する IValueConverter の定義を示します。
public sealed class BackgroundConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter,
CultureInfo culture)
{
ListViewItem item = (ListViewItem)value;
ListView listView =
ItemsControl.ItemsControlFromItemContainer(item) as ListView;
// Get the index of a ListViewItem
int index =
listView.ItemContainerGenerator.IndexFromContainer(item);
if (index % 2 == 0)
{
return Brushes.LightBlue;
}
else
{
return Brushes.Beige;
}
}
次の例では、必要なレイアウトを提供するために、ItemContainerStyle として Style を使用する ListView を定義する方法を示します。
<ListView Name="theListView"
ItemsSource="{Binding Source={StaticResource EmployeeData},
XPath=Employee}"
ItemContainerStyle="{StaticResource myItemStyle}" >
<ListView.View>
<GridView>
<GridViewColumn DisplayMemberBinding="{Binding XPath=FirstName}"
Header="First Name" Width="120"/>
<GridViewColumn DisplayMemberBinding="{Binding XPath=LastName}"
Header="Last Name" Width="120"/>
<GridViewColumn DisplayMemberBinding="{Binding XPath=FavoriteCity}"
Header="Favorite City" Width="120"/>
</GridView>
</ListView.View>
</ListView>
方法 2 : ListView から新しいクラスを派生させて背景色を変更する
次の例では、ListView から派生するクラスを定義する方法を示します。このクラスでは、PrepareContainerForItemOverride メソッドをオーバーライドして、交互に表示される Background の色の行を作成します。
public class SubListView : ListView
{
protected override void
PrepareContainerForItemOverride(DependencyObject element,
object item)
{
base.PrepareContainerForItemOverride(element, item);
if (View is GridView)
{
int index = ItemContainerGenerator.IndexFromContainer(element);
ListViewItem lvi = element as ListViewItem;
if (index % 2 == 0)
{
lvi.Background = Brushes.LightBlue;
}
else
{
lvi.Background = Brushes.Beige;
}
}
}
}
次の例では、このクラスのインスタンスを作成する方法を示します。namespc プレフィックスは、共通言語ランタイム (CLR) の名前空間および StyleSelector が定義されている対応するアセンブリにマップされます。
<namespc:SubListView
ItemsSource="{Binding Source={StaticResource EmployeeData},
XPath=Employee}">
<namespc:SubListView.View>
<GridView>
<GridViewColumn DisplayMemberBinding="{Binding XPath=FirstName}"
Header="First Name" Width="120"/>
<GridViewColumn DisplayMemberBinding="{Binding XPath=LastName}"
Header="Last Name" Width="120"/>
<GridViewColumn DisplayMemberBinding="{Binding XPath=FavoriteCity}"
Header="Favorite City" Width="120"/>
</GridView>
</namespc:SubListView.View>
</namespc:SubListView>
方法 3 : StyleSelector を使用して背景色を変更する
行に対して Style を定義する StyleSelector を定義する方法を次の例に示します。この例では、行インデックスに従って Background の色を定義します。
public class ListViewItemStyleSelector : StyleSelector
{
public override Style SelectStyle(object item,
DependencyObject container)
{
Style st = new Style();
st.TargetType = typeof(ListViewItem);
Setter backGroundSetter = new Setter();
backGroundSetter.Property = ListViewItem.BackgroundProperty;
ListView listView =
ItemsControl.ItemsControlFromItemContainer(container)
as ListView;
int index =
listView.ItemContainerGenerator.IndexFromContainer(container);
if (index % 2 == 0)
{
backGroundSetter.Value = Brushes.LightBlue;
}
else
{
backGroundSetter.Value = Brushes.Beige;
}
st.Setters.Add(backGroundSetter);
return st;
}
}
StyleSelector に対して ResourceKey を定義する方法を次の例に示します。namespc プレフィックスは、CLR の名前空間および StyleSelector が定義されている対応するアセンブリにマップされます。詳細については、「XAML 名前空間および名前空間の割り当て」を参照してください。
<namespc:ListViewItemStyleSelector x:Key="myStyleSelector"/>
ListView の ItemContainerStyleSelector プロパティをこの StyleSelector リソースに設定する方法を次の例に示します。
<ListView
ItemsSource="{Binding Source={StaticResource EmployeeData},
XPath=Employee}"
ItemContainerStyleSelector="{DynamicResource myStyleSelector}" >
<ListView.View>
<GridView>
<GridViewColumn DisplayMemberBinding="{Binding XPath=FirstName}"
Header="First Name" Width="120"/>
<GridViewColumn DisplayMemberBinding="{Binding XPath=LastName}"
Header="Last Name" Width="120"/>
<GridViewColumn DisplayMemberBinding="{Binding XPath=FavoriteCity}"
Header="Favorite City" Width="120"/>
</GridView>
</ListView.View>
</ListView>
ListViewItem コレクションでの変更後の ListView の更新
ListView コントロールの ListViewItem を追加または削除した場合は、ListViewItem コントロールを更新して、交互に表示される Background の色を作成しなおす必要があります。次の例では、ListViewItem コントロールを更新する方法を示します。
ICollectionView dataView =
CollectionViewSource.GetDefaultView(theListView.ItemsSource);
dataView.Refresh();