如何在ItemsSource中为每个项动态创建按钮点击事件

核心思路 #

无需为每个按钮单独创建Click事件，利用WPF数据绑定特性，通过按钮的DataContext获取当前项的链接信息，在通用事件处理方法中完成跳转。

步骤1：修正XAML中的按钮事件绑定 #

修改DataTemplate内的Button，绑定到通用Click事件：

<ItemsControl x:Name="ScriptItemControl">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate >
        <DataTemplate>
            <Border Margin="15,10,0,0" Background="#363636" Height="203" Width="279" VerticalAlignment="Top">
                <Border.Resources>
                    <Style TargetType="{x:Type Border}">
                        <Setter Property="CornerRadius" Value="12"/>
                    </Style>
                </Border.Resources>
                <Grid>
                    <!-- 绑定通用Click事件 -->
                    <Button Click="OpenLink_Click">
                        <Button.Resources>
                            <Style TargetType="Border">
                                <Setter Property="CornerRadius" Value="8"/>
                            </Style>
                        </Button.Resources>
                    </Button>
                    <Image Source="{Binding Path=thumbnail}" Width="300" Height="150"/>
                    <TextBlock Text="{Binding Path=title}" Margin="21,10,81,147" FontSize="20" Foreground="White" FontFamily="Atkinson Hyperlegible" TextWrapping="Wrap"/>
                </Grid>
            </Border>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

步骤2：添加通用事件处理方法 #

在后台代码中实现OpenLink_Click方法，通过DataContext获取当前项链接并打开：

private void OpenLink_Click(object sender, RoutedEventArgs e)
{
    var button = sender as Button;
    if (button == null) return;
    
    var scriptItem = button.DataContext as ScriptLinks;
    if (scriptItem != null && !string.IsNullOrWhiteSpace(scriptItem.link))
    {
        // 调用系统默认浏览器打开链接
        System.Diagnostics.Process.Start(new System.Diagnostics.ProcessStartInfo(scriptItem.link) 
        { 
            UseShellExecute = true 
        });
    }
}

步骤3：确保数据包含完整链接信息 #

修正API数据读取逻辑，传递链接字段到CreateScript方法：

using (WebClient wc = new WebClient())
{
    dynamic _api = JsonConvert.DeserializeObject(wc.DownloadString("json link"));
    for (int i = 0; i < _api.Count; i++)
    {
        // 补充传递link参数
        CreateScript(
            _api[i].title.ToString(), 
            _api[i].excerpt.ToString(), 
            _api[i].featured_image.thumbnail.ToString(),
            _api[i].link.ToString()
        );
        await Task.Delay(500);
    }
}

同步更新CreateScript方法，确保链接被正确存入数据集合：

private void CreateScript(string title, string excerpt, string thumbnail, string link)
{
    try
    {
        Dispatcher.Invoke(() =>
        {
            this.GetScriptLinks.Add(new ScriptLinks 
            { 
                link = link, 
                thumbnail = thumbnail, 
                title = title 
            });
            // 建议：手动设置Height易引发布局问题，优先让ItemsControl自动适配
            // CloudGrid.Height = (CloudGrid.Height + 75);
        });
    }
    catch (Exception e)
    {
        MessageBox.Show(e.ToString());
    }
}

说明 #

所有按钮共享同一个事件处理方法，通过DataContext区分当前点击项，可适配任意数量的动态生成项；设置UseShellExecute = true能确保系统用默认浏览器打开目标链接。

内容的提问来源于stack exchange，提问作者user24652070