HOW TO:在 ListView 中變更資料列的背景色彩
更新:2007 年 11 月
本範例說明三種方法來變更 ListView 資料列的 Background 色彩。
範例
下列章節提供三種方法來建立 ListView,其資料列會變更 Background 色彩。這個範例也說明新增或移除資料列時,更新檢視的方法。
方法 1:定義使用 IValueConverter 的樣式來變更背景色彩
下列範例顯示如何定義 ListViewItem 控制項的 Style,將 Background 屬性的值繫結至 IValueConverter。
<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"/>
下列範例顯示 IValueConverter 的定義,它會根據資料列索引設定 Background 屬性。
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;
}
}
下列範例顯示如何定義 ListView,其使用 Style 做為它的 ItemContainerStyle 以提供所需的版面配置。
<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 前置詞會對應至 Common Language Runtime (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 變更背景色彩
下列範例顯示如何定義 StyleSelector,它會定義資料列的 Style。這個範例會根據資料列索引定義 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();