Xaml 更改listview项目中的颜色并删除项目UWP

我将删除listview项目中带有按钮的项目，并使用listview项目中的另一个按钮更改椭圆的颜色

类别产品代码：

class Product
{
    public string Name { get; set; }
    public double Price { get; set; }
}

xaml主页代码：

<Page
x:Class="ListViewTest.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:ListViewTest"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" Loaded="Page_Loaded">

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <ListView x:Name="ListViewProducts" 
            ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
            ScrollViewer.VerticalScrollBarVisibility="Auto"
            FontSize="18" 
            BorderThickness="0" 
            Width="600" 
            Height="800" 
            HorizontalAlignment="Center"
            VerticalAlignment="Center"
            ItemsSource="{Binding LineItems}">
        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel Margin="10">
                    <Grid HorizontalAlignment="Left" VerticalAlignment="Center" Margin="5,0,0,0">
                        <Ellipse x:Name="EllipseColor" HorizontalAlignment="Left" Height="20" Stroke="Black" VerticalAlignment="Top" Width="20" StrokeThickness="1"/>
                    </Grid>
                    <TextBlock Text="{Binding Name}" Margin="5,0,0,0"/>
                    <TextBlock Text="{Binding Price}" Margin="5,0,0,0"/>
                    <Button x:Name="btnRemove" Click="btnRemove_Click" Height="20" Width="60" Margin="5"/>
                    <Button x:Name="btnChangeColor" Click="btnChangeColor_Click" Height="20" Width="60" Margin="5"/>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

主页背后的代码：

public sealed partial class MainPage : Page
{
    public MainPage()
    {
        this.InitializeComponent();
    }

    private void Page_Loaded(object sender, RoutedEventArgs e)
    {
        ObservableCollection<Product> _listProduct = new ObservableCollection<Product>();
        _listProduct = new ObservableCollection<Product>
        {
            new Product
            {
                Name = "Phone",
                Price = 100
            },
            new Product
            {
                Name = "TV",
                Price = 120
            },
            new Product
            {
                Name = "Computer",
                Price = 80
            },
            new Product
            {
                Name = "Laptop",
                Price = 250
            },
            new Product
            {
                Name = "Tablet",
                Price = 150
            },
            new Product
            {
                Name = "Monitor",
                Price = 200
            },
        };
        ListViewProducts.ItemsSource = _listProduct;
    }

    private void btnRemove_Click(object sender, RoutedEventArgs e)
    {
        // Code to remove item
    }

    private void btnChangeColor_Click(object sender, RoutedEventArgs e)
    {
        // Code to color EllipseColor
    }
}

公共密封部分类主页面：第页
{
公共主页（）
{
this.InitializeComponent（）；
}
已加载私有无效页面（对象发送方，路由目标e）
{
ObservableCollection_listProduct=新的ObservableCollection（）；
_listProduct=新的ObservableCollection
{
新产品
{
Name=“Phone”，
价格=100
},
新产品
{
Name=“TV”，
价格=120
},
新产品
{
Name=“计算机”，
价格=80
},
新产品
{
Name=“笔记本电脑”，
价格=250
},
新产品
{
Name=“平板电脑”，
价格=150
},
新产品
{
Name=“监视器”，
价格=200
},
};
ListViewProducts.ItemsSource=\u listProduct；
}
私有void btnRemove_单击（对象发送者，路由目标）
{
//删除项目的代码
}
私有void btnChangeColor\u单击（对象发送者，路由目标e）
{
//给椭圆着色的代码
}
}

使用btnRemove，我将删除listview项，使用btnChangeColor，我将用红色填充EllipseColor，在btnChangeColor\u中单击，我将显示项的索引

---

提前谢谢。

我看你有几个问题。首先，您通过绑定到一个显然不存在的集合来设置

ListView

源代码，并在C#中进行设置。您应该使用适当的绑定将其移动到。例如，在

MainPage.xaml.cs

中：

private ObservableCollection<Product> _products = new ObservableCollection<Product>();
public ObservableCollection<Product> Products { get => _products; set => _products = value; }

至于给椭圆上色，你不应该在C中这样做。相反，您应该在

产品

类上有一个

状态

属性，然后更改该属性

var product = (sender as Button).DataContext as Product;
product.Status = "invalid";

首先，您需要确保您的属性发生更改

public class Product : INotifyPropertyChanged
{
    private string _status;
    public string Status
    {
        get => _status;
        set
        {
            _status = value;
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(Status)));
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
}

然后更改属性

var product = (sender as Button).DataContext as Product;
product.Status = "invalid";

然后在XAML中，使用绑定转换器根据状态更改

椭圆

的

填充

属性。例如

using System;
using Windows.UI;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Media;

public class StatusConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language) =>
        new SolidColorBrush(value.ToString() == "invalid" ? Colors.Red : Colors.Gray);

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

然后需要将转换器添加到资源中

<Page...>
    <Page.Resources>
        <locationofyourconverter:StatusConverter x:Key="StatusConverter" />
    </Page.Resources>

    ...

    <Ellipse Fill={Binding Status, Mode=OneWay, Converter={StaticResource StatusConverter}} />

...

很抱歉，我无法理解这两种解决方案。你能更好地解释一下我收集的物品吗？我如何使用MyCollection？@Res我已经更新了答案，以显示该收藏（重命名为

产品

），如果您需要更多帮助，我建议您查看Jerry Nixon的作品。删除该项目有效！！但我没有设法使用ivalueconverter。这就好了。@Res.好的。我已经更新了答案，以显示转换器的充分使用。但在回答的上下文中，我能做的就只有这些了。Ivalueconverter在应用程序启动时工作，但如果我按下按钮，颜色不会改变。。我错在哪里？

<Page...>
    <Page.Resources>
        <locationofyourconverter:StatusConverter x:Key="StatusConverter" />
    </Page.Resources>

    ...

    <Ellipse Fill={Binding Status, Mode=OneWay, Converter={StaticResource StatusConverter}} />