UWP WebView avec la couche « de verre » ne recevant pas de pointeur/toucher des événements

Question

Je voudrais appliquer une couche « verre » semi-transparent sur une partie d'une WebView, semblable à ceci:

XAML :

<Page 
    x:Class="Sample.BlankPage1" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d"> 

    <Grid> 
     <WebView 
      Source="http://news.google.com" 
     /> 

     <Rectangle 
      Fill="Red" 
      Opacity="0.25" 
      IsHitTestVisible="False" 
      MaxWidth="200" 
     /> 

    </Grid> 
</Page> 

Le code-behind:

using Windows.UI.Xaml.Controls; 

namespace Sample 
{ 
    public sealed partial class BlankPage1 : Page 
    { 
     public BlankPage1() 
     { 
      InitializeComponent(); 
     } 
    } 
} 

Le problème est que Lorsque la souris est sur le rectangle rouge, le pointeur de la souris est une flèche (lorsque survolant des liens hypertexte), et cliquer/cliquer n'a aucun effet sur le WebView. Il semble que "IsHitTestVisible = False" ne fonctionne pas et que WebView ne reçoive pas d'événements.

J'ai trouvé un document expliquant hit-testing (https://msdn.microsoft.com/library/windows/apps/hh758286#hit_testing) qui dit que "les contrôles WebView ont un comportement de test de hit spécial" - mais il semble que mon sample devrait fonctionner.

Les questions sont les suivantes:

1. Le comportement actuel d'un bug?
2. Y a-t-il une solution de contournement?

Merci.

Answer 1

Est-ce le comportement actuel un bug?

Non, ce n'est pas un bug. C'est parce que le dernier élément déclaré en XAML est l'élément qui dessine dessus. Dans votre extrait de code, Rectangle est affiché au-dessus du contrôle WebView. Il ne peut pas obtenir le focus du contrôle WebView lorsqu'il pointe vers Rectangle. Il n'a aucune relation avec la propriété IsHitTestVisible.

est-il une solution?

j'ai changé l'ordre rendu pour WebView et Rectangle et mis Opacity propriété pour « WebView » au lieu de Rectangle, qui peut avoir des effets similaires.

<Rectangle 
     MaxWidth="200" 
     Fill="Red" /> 
    <WebView Source="http://news.google.com" Opacity="0.75"/> 

Et le résultat: