Web Browser Control in WPF App with no airspace issue? - wpf

Question

I am working on a WPF app which has Web Browser in one of its views. When I run the Application, It works fine but the Web Browser Control sits on top of my wpf region. I know this is something to do with the AirSpace issue. Is there any possible way to get over it? Any help will be appreciated.
Thanks

Answer 1

The issue was not solved in WPF 4.5.
There were some information in net such the below mentioned properties would be available with the 4.5 version of web browser control, however the plan has been dropped. So you need to handle the airspace issue by yourself.
WebBrowser.CompositionMode = System.Windows.Interop.CompositionMode.Full;
WebBrowser.IsRedirected = true;
The workaround that you could do is by making the height of the web browser control to zero, when some other control comes in front of Web browser control.
Find sample code below,
Assume, you have a web browser control in Mainwindow. When you perform some action,, eg: click a button you have another user control which comes above MainWindow. However, because of Airspace issue the web browser doesn't sit in its parent control and comes on top of your control.
FIX:
The standard fix is you can set the height of web browser to zero when you trigger some other control over it depends upon your scenario. Below, there is a sample implementation.
In MainWindow.Xaml include the events.
Activated="Window_Activated"
Deactivated="Window_Deactivated"
In Xaml.cs handle the scenario by setting the height.
private void Window_Activated(object sender, EventArgs e)
{
wb.Height = double.NaN;
}
private void Window_Deactivated(object sender, EventArgs e)
{
wb.Height = 0;
}

Answer 2

Here is technical information for why this happens.
Some tips and suggestions to get rid of that

Answer 3

This is a known problems, as Neeraj posts. But with WPF 4.5 this seems to be solved, so if you don't mind using the beta version you should download Visual Studio 11.

Answer 4

Try Chris84898's AirspaceFixer project.
https://github.com/chris84948/AirspaceFixer
You just host the problematic control inside a panel, and it does the heavy lifting for you.
XAML:
<asf:AirspacePanel x:Name="ap"
FixAirspace="{Binding FixAirspace}"
Grid.Column="0" Grid.Row="1" >
<WebBrowser x:Name="browser" Navigated="Browser_Navigated" />
</asf:AirspacePanel>
To temporarily "FixAirspace" in code (or through dependency property changes):
ap.FixAirspace = true;
// Display a dialog or whatever
ap.FixAirspace = false;
There is a NuGet package for it as well.