UWP中GridView内WebView抢占ItemClick事件的解决求助

这个问题我之前也碰到过！WebView作为GridViewItem的内容时，会默认捕获鼠标/触摸事件，导致GridView的ItemClick事件只能触发一次，之后焦点被WebView占据，无法再响应其他项的点击。下面给你几个实用的解决办法：

方法1：直接禁用WebView的交互能力（推荐） #

既然你只是用WebView展示SVG预览，不需要和WebView内的内容交互，最简单的方式就是设置WebView的IsHitTestVisible为False，这样它就不会捕获任何输入事件，点击会直接透传给GridViewItem。

修改你的DataTemplate：

<DataTemplate x:Key="SvgThumbnailItemTemplate" x:DataType="inkWorkPage:SvgThumbnail">
    <WebView Source="{x:Bind UriSource}" Width="100" Height="100" IsHitTestVisible="False"/>
</DataTemplate>

这个改动很小，而且完全不影响SVG的无损渲染效果，完美适配你的场景。

方法2：叠加透明元素拦截事件 #

如果后续需要偶尔和WebView内的SVG交互，可以在WebView上层叠加一个透明的Rectangle，让它先接收点击事件并传递给GridViewItem，同时保留WebView的交互能力（需要时可以隐藏这个Rectangle）。

修改后的DataTemplate：

<DataTemplate x:Key="SvgThumbnailItemTemplate" x:DataType="inkWorkPage:SvgThumbnail">
    <Grid Width="100" Height="100">
        <WebView Source="{x:Bind UriSource}"/>
        <!-- 透明矩形拦截点击，确保事件传递到GridViewItem -->
        <Rectangle Fill="Transparent" IsHitTestVisible="True"/>
    </Grid>
</DataTemplate>

当你需要和WebView交互时，只需要把Rectangle的IsHitTestVisible设为False即可。

方法3：动态切换交互状态（进阶） #

如果需要根据GridViewItem的选中状态动态控制WebView的交互，可以在GridView.ItemClick或者GridView.SelectionChanged事件里修改WebView的IsHitTestVisible：

比如在后台代码中：

private void SvgImagesGridView_ItemClick(object sender, ItemClickEventArgs e)
{
    // 先重置所有WebView的交互状态
    foreach (var item in SvgImagesGridView.Items)
    {
        if (SvgImagesGridView.ContainerFromItem(item) is GridViewItem container)
        {
            if (container.ContentTemplateRoot is Grid grid)
            {
                if (grid.Children[0] is WebView webView)
                {
                    webView.IsHitTestVisible = false;
                }
            }
        }
    }
    // 给当前选中项的WebView开启交互（如果需要）
    if (e.ClickedItem is SvgThumbnail clickedItem)
    {
        if (SvgImagesGridView.ContainerFromItem(clickedItem) is GridViewItem clickedContainer)
        {
            if (clickedContainer.ContentTemplateRoot is Grid grid)
            {
                if (grid.Children[0] is WebView webView)
                {
                    webView.IsHitTestVisible = true;
                }
            }
        }
    }
    // 处理你的编辑逻辑...
}

这个方法适合需要在选中项和非选中项之间区分交互能力的场景，但相对复杂一些。

总结一下，你的场景用方法1最省心，改个属性就能解决问题，完全不影响SVG的展示效果。

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