c# - Make WPF control over the web browser

Question

I have a WPF application in which I have an embedded web browser control. I want to show an animation over the web browser at a certain time, but the problem is that the WPF controls, when kept over the web browser are not visible.

Is there any way to show my user control over the web browser?

Answer 1

Please answer me this first,

Is this Web Browser control the WPF Web Browser Control or Winform webbrowser control hosted in WinFormHost?

For any WPF control to show animation over it, did you explore ...

1. Placing your control in Grid or Canvas and then placing an stretched Border (which has running animation in it) as the last child of the grid/canvas?
2. Adorner with constantly changing drawing context to simulate animations?
3. Transparent Popup with animation, whose static placement is done (bound to control's absolute left, top positions and actual height & width properties) over the control?

Try the transparent popup approach for web browser control ...

    <Grid>
        <WebBrowser x:Name="WebBrowser1"/> 
        <Popup IsOpen="{Binding StartAninmation}"
              AllowsTransparency="True"
              Grid.RowSpan="99"
              Grid.ColumnSpan="99"
              Placement="Center"
              Width="{Binding ActualWidth,
                              ElementName=WebBrowser1,
                              Mode=OneWay}"
              Height="{Binding ActualHeight, 
                               ElementName=WebBrowser1,
                               Mode=OneWay}"
              PlacementTarget="{Binding ElementName=WebBrowser1}"
              Opacity="0.5"
              Margin="3">
           <TextBlock Text="Loading ..."/>
       </Popup>
 </Grid>

One of these will surely work in your case.