列表视图项目UWP的替代颜色

时间:2017-09-09 12:03:25

标签: c# listview uwp uwp-xaml

我有一个颜色的类来交替项目的背景,但如果我删除一个项目,背景颜色不会更新。 有没有办法在删除项目后刷新背景颜色?

替代颜色的代码。 class listview:

public class AlternatingRowListView : ListView
{
    protected override void PrepareContainerForItemOverride(DependencyObject element, object item)
    {
        base.PrepareContainerForItemOverride(element, item);
        var listViewItem = element as ListViewItem;
        if (listViewItem != null)
        {
            var index = IndexFromContainer(element);

            if (index % 2 == 0)
            {
                listViewItem.Background = new SolidColorBrush(Colors.LightBlue);
            }
            else
            {
                listViewItem.Background = new SolidColorBrush(Colors.Transparent);
            }
        }

    }
}

代码xaml:

<local:AlternatingRowListView x:Name="listview">
        <ListViewItem>item 1</ListViewItem>
        <ListViewItem>item 2</ListViewItem>
        <ListViewItem>item 3</ListViewItem>
        <ListViewItem>item 4</ListViewItem>
        <local:AlternatingRowListView.ItemTemplate>
            <DataTemplate>

            </DataTemplate>
        </local:AlternatingRowListView.ItemTemplate>
</local:AlternatingRowListView>

提前致谢。

2 个答案:

答案 0 :(得分:6)

您只需要扩展已经扩展的thumbnailContainerStyle:{ justifyContent:'center', alignItems:'center', marginLeft: 10, // instead of '10' marginRight: 10, // instead of '10' } 控件以达到您的需要。

您可以通过订阅AlternatingRowListView的{​​{1}}事件来监控项目从列表中删除的时间,然后您只需遍历所有已实现的项目 (视觉上)已移除的项目,并相应地更改其背景颜色。

这样的事情会发生 -

VectorChanged

答案 1 :(得分:0)

如果您要搜索其他奇数/偶数行颜色:

app.xml中的

<Application
  ...
  <Application.Resources>
    <AlternateColorConverterx:Key="AlternateColorConverter" />
   ...
  </Application.Resources>

生成一个新类,即AlternateColorConverter.cs
(修改你的十六进制颜色。)

  class AlternateColorConverter : IValueConverter
{
    private static int idx_=-1;
    private static int odd_=0;
    private static int idx(int offset)
    {
        int idx_before = idx_;
        idx_ = (idx_ + 1) % (offset);

        if (idx_ < idx_before) odd_=(odd_+1)%2;
        return odd_;
    }

    public static Color GetColorFromHex(string hexString)
    {
        Color x = (Color)XamlBindingHelper.ConvertValue(typeof(Color), hexString);
        return x;
    }

    public object Convert(object value, Type targetType, object parameter, string language)
    {
        int param = System.Convert.ToInt32(parameter);
        return new SolidColorBrush(ColorUtils.GetColorFromHex((idx(param) == 0) ? "#F24C27" : "#FBBA42"));
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}

并在yourpage.xml.cs中:
(其中ConverterParameter(偏移量)取决于列数。通常为2)

<ListView HorizontalAlignment="Stretch" Style="{StaticResource ListViewStyle}">
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                <Setter Property="MaxHeight" Value="20"/>
                <Setter Property="MinHeight" Value="20"/>
                <Setter Property="Padding" Value="0"/>
            </Style>
        </ListView.ItemContainerStyle>
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="Models:YourObservableArray">
                <Grid HorizontalAlignment="Stretch" Margin="0">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="180*"/>
                        <ColumnDefinition Width="100*"/>
                    </Grid.ColumnDefinitions>
                    <Border Background="{Binding Converter={StaticResource AlternateColorConverter},ConverterParameter=2}" HorizontalAlignment="Stretch" Grid.Column="0"  Margin="0">
                        <TextBlock Text="{x:Bind Field1}" HorizontalAlignment="Stretch"/>
                    </Border>
                    <Border Background="{Binding Converter={StaticResource AlternateColorConverter},ConverterParameter=2}" HorizontalAlignment="Stretch" Grid.Column="0"  Margin="0">
                        <TextBlock Text="{x:Bind Field2}" HorizontalAlignment="Stretch"/>
                    </Border>
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>