Como: Alternate the Background Color for Rows in a ListView
Este exemplo mostra três métodos que você pode usar para alternar a cor Background para linhas em um ListView.
Exemplo
As seções a seguir fornecem três métodos para criar um ListView com linhas que alternam na cor de Background. O exemplo também descreve um método para atualizar o modo de exibição quando você adicionar ou remover linhas.
Método 1: Definir um estilo que usa um IValueConverter cor do plano de fundo alternativa
O exemplo a seguir mostra como definir um Style para um controle ListViewItem que vincula o valor da propriedade Background para um 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>
O exemplo a seguir define um ResourceKey para o IValueConverter.
<namespc:BackgroundConverter x:Key="myConverter"/>
O exemplo a seguir mostra a definição de IValueConverter que define a propriedade Background de acordo com o índice da linha.
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;
}
}
O exemplo a seguir mostra como para definir um ListView que usa Style como sua ItemContainerStyle com o objetivo de fornecer o layout necessário.
<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>
Método 2: Derive uma nova classe de ListView para cor do plano de fundo alternativa
O exemplo a seguir mostra como definir uma classe que é derivada de ListView. Esta classe substitui o método PrepareContainerForItemOverride para criar linhas que têm cores alternadas de 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;
}
}
}
}
O exemplo a seguir mostra como criar uma instância desta classe. O prefixo namespc mapeia para um namespace common language runtime (CLR) e o assembly correspondente onde StyleSelector está definido.
<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>
Método 3: Use um StyleSelector para cor do plano de fundo alternativa
O exemplo a seguir mostra como definir um StyleSelector que define um Style para uma linha. Este exemplo define a cor de Background de acordo com ao índice da linha.
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;
}
}
O exemplo a seguir mostra como definir um ResourceKey para o StyleSelector. O prefixo namespc mapeia para um namespace CLR e o assembly correspondente onde StyleSelector está definido. Para obter mais informações, consulte Espaços de nomes XAML e mapeamentos de espaços de nomes.
<namespc:ListViewItemStyleSelector x:Key="myStyleSelector"/>
O exemplo a seguir mostra como definir a propriedade ItemContainerStyleSelector de um ListView a esse recurso 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>
Atualize a ListView após uma alteração na coleção de ListViewItem
Se você adicionar ou remover um ListViewItem a partir de um controle ListView, deve atualizar os controles ListViewItem para recriar a cor Background alternada. O exemplo a seguir mostra como atualizar os controles ListViewItem.
ICollectionView dataView =
CollectionViewSource.GetDefaultView(theListView.ItemsSource);
dataView.Refresh();