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>