WinRT ListView间隔变色(一)

我们知道，在WPF里，MSDN提供了三种方法

1.使用转换器Converter

2.继承ListView类，自己处理

3.使用StyleSelctor

到了WinRT的世界了

1. Winrt中Setter不能Binding,需要找办法解决，正在找办法解决（已经找到解决方法，请参看WinRT ListView间隔变色(二))

2.继承类肯定是可以的。就不尝试了

3.使用ItemContainerStyleSelector

我们从第三种开始做起：

在Winrt中，我们没有办法直接重写SelectStyle构造函数了，好在天无绝人之路。WinRt贴心的提供了SelectStyleCore函数。

 protected virtual Style SelectStyleCore(System.Object item, DependencyObject container);

接下来我们就重写这个函数就好

   protected override Style SelectStyleCore(object item, DependencyObject container)
         {
             var style = new Style {TargetType = typeof (ListViewItem)};
             var backgroudSetter = new Setter {Property = Windows.UI.Xaml.Controls.Control.BackgroundProperty};

             var listview = ItemsControl.ItemsControlFromItemContainer(container) as ListView;
             if (listview != null)
             {
                 var index = listview.IndexFromContainer(container);
                 backgroudSetter.Value = index%== ? EvenColorBrush : OddColorBrush ;
             }
             style.Setters.Add(backgroudSetter);

             return style;
         }

这里，我们定义了连个Brush（ EvenColorBrush ，OddColorBrush），方便我们后来修改

public SolidColorBrush OddColorBrush { get; set; }
public SolidColorBrush EvenColorBrush { get; set; }

我们把这个StylesSecltor命名为ListViewItemStyleSelector；在资源文件里使用

 <converter:ListViewItemStyleSelector x:Key="ListViewItemStyleSelector" OddColorBrush="{StaticResource SilverColorBrush}" EvenColorBrush="{StaticResource AsbestosColorBrush}"/>

其中，converter前缀为ListViewItemStyleSelector所在的命名空间。

最后，我们在项目中使用这个Selector,

 <ListView ItemsSource="{Binding VM.AuthorPostList}"  ItemContainerStyleSelector="{StaticResource  ListViewItemStyleSelector}"  ItemTemplate="{StaticResource AuthorPostDetailItemDataTemplate}" Grid.Row=""/>

我们最终效果如下：

接下来，还有第二篇有关间隔变色的问题 WinRT ListView间隔变色(二)

---

写完这个，经高手提醒，还可以用Behavior来做

Alternating Colors of rows in ListView in Windows Phone 8.1

摘录主要代码如下：

namespace Behaviors
{
    public class AlternatingColorItemContainerStyleSelector : StyleSelector
    {
        private Style _oddStyle = new Style { TargetType = typeof(ListViewItem) }, _evenStyle = new Style { TargetType = typeof(ListViewItem) };
        public Style OddStyle { get { return _oddStyle; } }
        public Style EvenStyle { get { return _evenStyle; } }

        protected override Style SelectStyleCore(object item, DependencyObject container)
        {
            var listViewItem = (ListViewItem)container;
            var listView = GetParent<ListView>(listViewItem);

            var index = listView.IndexFromContainer(listViewItem);

            if (index %  == )
            {
                return this.EvenStyle;
            }
            else
            {
                return this.OddStyle;
            }
        }

        public static T GetParent<T>(DependencyObject child) where T : DependencyObject
        {
            while (!(child is T))
            {
                child = VisualTreeHelper.GetParent(child);
            }

            return (T)child;
        }
    }

    public class ListViewAlternatingColorBehavior : DependencyObject, IBehavior
    {
        public DependencyObject AssociatedObject { get; set; }

        public Style SharedItemContainerStyle { get; set; }

        #region colors dp

        public SolidColorBrush OddBrush
        {
            get { return (SolidColorBrush)GetValue(OddBrushProperty); }
            set { SetValue(OddBrushProperty, value); }
        }

        public static readonly DependencyProperty OddBrushProperty =
            DependencyProperty.Register("OddBrush", typeof(SolidColorBrush), typeof(ListViewAlternatingColorBehavior), new PropertyMetadata(null));

        public SolidColorBrush EvenBrush
        {
            get { return (SolidColorBrush)GetValue(EvenBrushProperty); }
            set { SetValue(EvenBrushProperty, value); }
        }

        public static readonly DependencyProperty EvenBrushProperty =
            DependencyProperty.Register("EvenBrush", typeof(SolidColorBrush), typeof(ListViewAlternatingColorBehavior), new PropertyMetadata(null));

        #endregion

        public void Attach(DependencyObject associatedObject)
        {
            this.AssociatedObject = associatedObject;

            this.ApplyItemContainerStyleSelectors();
        }

        private void ApplyItemContainerStyleSelectors()
        {
            var itemContainerStyleSelector = new AlternatingColorItemContainerStyleSelector();

            if (this.SharedItemContainerStyle != null)
            {
                itemContainerStyleSelector.OddStyle.BasedOn = this.SharedItemContainerStyle;
                itemContainerStyleSelector.EvenStyle.BasedOn = this.SharedItemContainerStyle;
            }

            itemContainerStyleSelector.OddStyle.Setters.Add(new Setter { Property = Control.BackgroundProperty, Value = this.OddBrush });
            itemContainerStyleSelector.EvenStyle.Setters.Add(new Setter { Property = Control.BackgroundProperty, Value = this.EvenBrush });

            var listView = (ListView)this.AssociatedObject;
            listView.ItemContainerStyleSelector = itemContainerStyleSelector;
        }

        public void Detach()
        {
        }
    }
}

使用时如下：

<interactivity:Interaction.Behaviors>
behaviors:ListViewAlternatingColorBehavior  EvenBrush="Red" OddBrush="Green"/>
</interactivity:Interaction.Behaviors>