Question

我会在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
    }
}

使用btnRemove我将删除listview项目，并使用btnChangeColor我将红色填充EllipseColor，在btnChangeColor_Click中我将是项目的索引。

提前致谢。

Answer 1

在我看来，你有几个问题。首先，您要通过绑定到一个显然不存在的集合来设置ListView源，并在C＃中设置它。您应该使用适当的绑定将其移动。例如，在MainPage.xaml.cs：

中

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

然后绑定到它：

<ListView ItemsSource={x:Bind Products, Mode=OneWay} />

然后，在btnRemove_Click中，您只需从集合中删除该项目：

var product = (sender as Button).DataContext as Product;
Products.Remove(product);

至于着色Ellipse，你不应该在C＃中真正做到这一点。相反，您应该在Status类上拥有Product属性，然后更改该属性。

首先，您需要确保您的财产更改了火警通知。

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中，使用绑定转换器根据状态更改Ellipse的{{1}}属性。 E.g。

Fill

然后，您需要将转换器添加到您的资源中。

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();
}

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

1 个答案: