ListView 实现斑马线颜色间隔效果(ListViewItem颜色间隔显示)

第一种方式:使用转换器实现

1、转换器功能实现
//ListViewItem 隔行显示不同的颜色,用于界面样式背景颜色绑定
public sealed class BackgroundConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        ListViewItem item = (ListViewItem)value;
        ListView listView = ItemsControl.ItemsControlFromItemContainer(item) as ListView; // Use the ItemsControl.ItemsContainerFromItemContainer(item) to get the ItemsControl.. and cast  

        // Get the index of a ListViewItem  
        int index = listView.ItemContainerGenerator.IndexFromContainer(item); // this is a state-of-art way to get the index of an Item from a ItemsControl  
        if (index % 2 == 0)
            return new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FF33C3FB"));//Brushes.Teal;//
        else
        {
            return new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FF009DD0"));//Brushes.LightGreen;
        }
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

2、转换器添加到资源字典

//添加到Converter.xaml中,转换器资源字典


3、样式改写

//添加到style.xaml中,公共样式资源字典



4、样式引用

效果图:

ListView 实现斑马线颜色间隔效果(ListViewItem颜色间隔显示)_第1张图片

第二种方法:继承ListView;

1、定义一个继承ListView的类,要使用GridView

public sealed class SubListView : System.Windows.Controls.ListView
{
    protected override void PrepareContainerForItemOverride(System.Windows.DependencyObject element, object item)
    {
        base.PrepareContainerForItemOverride(element, item);
        if (View is System.Windows.Controls.GridView)
        {
            int index = ItemContainerGenerator.IndexFromContainer(element); // The ItemContainerGenerator has method to get index for a given Item  
            System.Windows.Controls.ListViewItem lvi = element as System.Windows.Controls.ListViewItem;
            if (index % 2 == 0)
                lvi.Background = Brushes.Cyan;
            else
            {
                lvi.Background = Brushes.Teal;
            }
        }
    }
}

2、调用:要使用GridView

添加样式隐藏GridView的列头



  
      
          
            
              
          
      
  

//类定义
public class Customers
{
    string Name {get;set;}
    ………………
    ………………
}

效果图:

ListView 实现斑马线颜色间隔效果(ListViewItem颜色间隔显示)_第2张图片         ListView 实现斑马线颜色间隔效果(ListViewItem颜色间隔显示)_第3张图片 

第三种方法:使用StyleSelector

1、C# 代码
public class ListViewItemStyleSelector : System.Windows.Controls.StyleSelector
{
    public override System.Windows.Style SelectStyle(object item, System.Windows.DependencyObject container)
    {
        System.Windows.Style st = new System.Windows.Style();
        st.TargetType = typeof(System.Windows.Controls.ListViewItem);
        System.Windows.Setter backgroundSetter = new System.Windows.Setter();
        backgroundSetter.Property = System.Windows.Controls.ListViewItem.BackgroundProperty;
        System.Windows.Controls.ListView listView = System.Windows.Controls.ItemsControl.ItemsControlFromItemContainer(container) as System.Windows.Controls.ListView;
        int index = listView.ItemContainerGenerator.IndexFromContainer(container);
        if (index % 2 == 0)
            backgroundSetter.Value = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FF33C3FB"));//Brushes.LightBlue;
        else
        {
            backgroundSetter.Value = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FF009DD0"));//Brushes.Beige;
        }
        st.Setters.Add(backgroundSetter);
        return st;
    }
}

2、Xaml代码

引入资源

    
        
        
        
    


//调用示例



//其他调用示例
  
  
  

  
  
       
         
         
         
       
  
  

效果图:

ListView 实现斑马线颜色间隔效果(ListViewItem颜色间隔显示)_第4张图片

你可能感兴趣的:(WPF)