2017-09-09 21 views
3

色のクラスをアイテムの背景と交互に使用しますが、アイテムを削除すると背景色は更新されません。 アイテムを削除した後に背景色を更新する方法はありますか?リストビュー項目の代替色UWP

alteranteカラーのコード。 クラスリストビュー:

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> 

感謝。

答えて

4

あなたが必要とするものを達成するために、既に拡張されたAlternatingRowListViewコントロールを少しだけ拡張する必要があります。

は商品がItemsVectorChangedイベントをサブスクライブすることによって、リストから削除されるたびに監視して、あなただけのループすべてすでに実現アイテムから(視覚的に)以下削除した項目を変更することができますし、そのそれに応じて背景の色。このような

何かが行うだろう -

public AlternatingRowListView() 
{ 
    DefaultStyleKey = typeof(ListView); 

    Items.VectorChanged += OnItemsVectorChanged; 
} 

private void OnItemsVectorChanged(IObservableVector<object> sender, IVectorChangedEventArgs args) 
{ 
    // When an item is removed from the list... 
    if (args.CollectionChange == CollectionChange.ItemRemoved) 
    { 
     var removedItemIndex = (int)args.Index; 

     // We don't really care about the items that are above the deleted one, so the starting index 
     // is the removed item's index. 
     for (var i = removedItemIndex; i < Items.Count; i++) 
     { 
      if (ContainerFromIndex(i) is ListViewItem listViewItem) 
      { 
       listViewItem.Background = i % 2 == 0 ? 
        new SolidColorBrush(Colors.LightBlue) : new SolidColorBrush(Colors.Transparent); 
      } 
      // If it's null, it means virtualization is on and starting from this index the container 
      // is not yet realized, so we can safely break the loop. 
      else 
      { 
       break; 
      } 
     } 
    } 
} 
0

をあなたも色を行/代替奇数を検索する場合:app.xml

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

は、新しいクラス、すなわちAlternateColorConverterを生成します。 cs
(16進数の色を変更してください)

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> 
関連する問題