如何动态更新列表视图项目的颜色和字体?

How to update listview item color and font dynamically?

我想动态更新我的列表视图,我会解释一下情况:我有一个 MainPage,我在 xaml:

中声明了它
<controls:DockPanel Width="100" Height="100">
  <Grid>
    <ListView x:Name="myList" Width="100" Margin="10,0,0,'" ItemsSource="{Binding Path=Item}">
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Left" />
                <Setter Property="VerticalContentAlignment" Value="Center" />
                <Setter Property="Margin" Value="0,0,0,0" />
                <Setter Property="Padding" Value="0,0,0,-6" />
                <Setter Property="MinHeight" Value="20" />
            </Style>
        </ListView.ItemContainerStyle>
    </ListView>
  </Grid>
</controls:DockPanel>

我关联了一个视图模型

namespace My_app.ViewModels
{
    public class MainPageViewModel : ViewModel
    {
      private ObservableCollection<string> _items;
      private string _sItems;

      public MainPageViewModel()
      {
          _items = new ObservableCollection<string>();
      }

      public ObservableCollection<string> Items
      {
          get { return _items; }
          set
          {
              _items = value;
              OnPropertyChanged("Items");
          }
      }
}

所以我有一个显示在主页上的组件,它有一个按钮,我可以在其中添加一个列表,我想动态更改此列表视图的颜色和字体

private ViewModels.MainPageViewModel _viewModels;

private void Button_Click(object sender, RoutedEventArgs e)
{
       List<string> myList = new List<string>(somevalue);

       foreach (var x in myList)
       {
           view_.Pins.Add(x);
       }

       //after I want to dynamically change color and font of my items
}

然后我想做的是列出列表视图的元素并动态改变它们的颜色,例如:

for (int i = 0; i < myList.Items.Count; i++)
{
    //getItem(i)
    //change item color
    //change item font
}

您可以使用 ValueConverter 和数据绑定来实现您想要的。

步骤如下:

  1. 根据您的要求创建一个 ValueConverter。您需要根据值字符串设置背景颜色和字体颜色。所以你需要有一个参数来指示何时设置背景颜色和字体颜色。
  2. 您需要为 ListView 项创建一个数据模板,以便该项可以使用数据绑定。

值转换器的代码:

 public class ColorConverter : IValueConverter 
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {

        SolidColorBrush brush = null;
        // Retrieve the parameter string and data string.
        string formatString = parameter as string;
        string data = value as string;
        // retrun different brush based on the parameter and data string
        if (formatString.Equals("foreground"))
        {
            switch (data) 
            {
                case "1":
                    brush = new SolidColorBrush(Colors.Red);
                    break;
                case "2":
                    brush = new SolidColorBrush(Colors.Green);
                    break;
            }
               
        }
        else if (formatString.Equals("background"))
        {
            switch (data)
            {
                case "1":
                    brush = new SolidColorBrush(Colors.AliceBlue);
                    break;
                case "2":
                    brush = new SolidColorBrush(Colors.Yellow);
                    break;
            }
        }
        return brush;
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        return null;
    }
}

Xaml中的代码:

   <ListView x:Name="myList" Width="100" Margin="10,0,0,0" ItemsSource="{Binding Path=Items}">
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Left" />
                <Setter Property="VerticalContentAlignment" Value="Center" />
                <Setter Property="Margin" Value="0,0,0,0" />
                <Setter Property="Padding" Value="0,0,0,-6" />
                <Setter Property="MinHeight" Value="20" />
            </Style>
        </ListView.ItemContainerStyle>
        <ListView.ItemTemplate>
            <DataTemplate >
                <Grid Width="200" Height="50" Background="{Binding Mode=TwoWay, Converter={StaticResource ColorConverter},ConverterParameter=background}">
                    <TextBlock Text="{Binding Mode=TwoWay}" Foreground="{Binding Mode=TwoWay,Converter={StaticResource ColorConverter},ConverterParameter=foreground}"/>
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

看起来如何:

这是一个简单的实现。您可以根据自己的场景更改数据模板和ValeConverter的逻辑。