处理来自 ListView 内的 UserControl 的事件

Handle an event from a UserControl inside a ListView

我正在编写一个 Windows 10 通用应用程序,其中我有一个 ListView,其 DataTemplate 是一个 UserControl。在那个 UserControl 里面有一个按钮,我想在我的 MainPage 上处理它的点击事件。

它基本上是一个联系人列表,按钮应该在单击时从列表中删除联系人,我不知道如何处理 UserControl 的按钮单击。

这是用户控件的XAML:

<UserControl
x:Class="DataBinding_Test1.ContactControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:DataBinding_Test1"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="50">
<UserControl.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="Dictionary1.xaml"/>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</UserControl.Resources>

<Grid Background="{ThemeResource AppBarBackgroundThemeBrush}"
      HorizontalAlignment="Stretch">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>
    <TextBlock Name="ContactIconTextBlock"
               Style="{StaticResource IconStyle}"
               Text="{x:Bind myContact.ContactIcon}"/>
    <TextBlock Name="ContactNameTextBlock"
               Grid.Column="1"
               Style="{StaticResource LabelStyle}"
               Text="{x:Bind myContact.ContactName}"
               RelativePanel.RightOf="ContactIconTextBlock"/>
    <Button Name="RemoveContactButton"
            Grid.Column="2"
            Content="X"
            VerticalAlignment="Stretch"
            Click="RemoveContactButton_OnClick"/>
    </Grid>
</UserControl>

在这个 ListView 中:

<ListView
        Name="ContactsListView"
        Grid.Column="1"
        ItemsSource="{x:Bind ContactList}"
        ItemTemplate="{StaticResource ContactListDataTemplate}"
        SelectionMode="None">
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            </Style>
        </ListView.ItemContainerStyle>
    </ListView>

我该如何实施?

您可以在用户控件的代码隐藏中添加一个事件处理程序,并在按钮的点击事件中调用它。

隐藏代码:

public event EventHandler OnRemoveContact;

private void RemoveContactButton_OnClick(object sender, RoutedEventArgs e)
{
    //... your existing code here
    OnRemoveContact?.Invoke(this, new EventArgs());
}

现在,您可以将数据模板中的事件用于 MainPage 的代码隐藏