User control with WebBrowser in C#

Question

I'm writing user control with WebBrowser and one dependency property. After change in Text I'd like to refresh browser output.

 public class BrowserControl : Control
 {
     //....
    public static readonly DependencyProperty ContentProperty =
       DependencyProperty.Register("Text", typeof(object), typeof(BrowserControl), new UIPropertyMetadata(null));

    public String Text
    {
        get { return (String)GetValue(ContentProperty); }
        set {   SetValue(ContentProperty, value);
                br = new WebBrowser();
                br.NavigateToString(value);
            }
    }

    private WebBrowser br;
    public WebBrowser Browser { get; set; }
}

I have put this control in wpf application, but there is no output from control. I think that I have to modify control template. General template looks like:

<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:BrowserControl">
<Style TargetType="{x:Type local:BrowserControl}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:BrowserControl}">
                <Border Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}">
                </Border>                    
            </ControlTemplate>
         </Setter.Value>
    </Setter>
</Style>
</ResourceDictionary>

I am new to this and don't know how to put webbrowser as visible element of entire control?

Also I'd like to know how to use Binding with TextBox and BrowserControl's Text property in WPF application. I want to do sth like:

<TextBox ... Text="{Binding Path=browserCtrl.Text}" ...>

So when text in TextBox change my custom control will rerender the site in browser.

Answer 1

I think this might help you....

just type the URL and tab off.

BrowserControl.cs

public class BrowserControl : Control
    {
        public static readonly DependencyProperty URLproperty
            = DependencyProperty.Register(
                "URL",
                typeof (string),
                typeof (BrowserControl),
                new PropertyMetadata(string.Empty, OnURLPropertyChanged),
                OnValidateURLCallBack);

        private static bool OnValidateURLCallBack(object value)
        {
            Uri uri = null;
            var url = Convert.ToString(value);
            if (!string.IsNullOrEmpty(url))
            {
                return Uri.TryCreate(Convert.ToString(value), UriKind.Absolute, out uri);
            }
            return true;
        }

        private static void OnURLPropertyChanged(object sender, DependencyPropertyChangedEventArgs args)
        {
            var browserControl = sender as BrowserControl;
            if (browserControl != null)
            {
                Uri uri = null;
                var url = Convert.ToString(args.NewValue);
                var template = browserControl.Template;
                if (template != null)
                {
                    var internalBrowser =
                        browserControl.Template.FindName("_InternalBrowser", browserControl) as WebBrowser;
                    if (internalBrowser != null)
                    {
                        if (!string.IsNullOrEmpty(url) && Uri.TryCreate(url, UriKind.Absolute, out uri))
                        {
                            internalBrowser.Navigate(uri);
                        }
                        else if (string.IsNullOrEmpty(url))
                        {
                            internalBrowser.NavigateToStream(new MemoryStream(Encoding.ASCII.GetBytes(string.Empty)));
                        }
                    }
                }
            }
        }

        public string URL
        {
            get { return Convert.ToString(GetValue(URLproperty)); }
            set { SetValue(URLproperty, value); }
        }
    }

Generic.xaml

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:local="clr-namespace:WpfApplication1">
    <Style TargetType="{x:Type local:BrowserControl}" x:Key="{x:Type local:BrowserControl}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type local:BrowserControl}">
                    <Border Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}">
                        <WebBrowser x:Name="_InternalBrowser"/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

MainWindow.xaml

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:WpfApplication1"
    Title="BrowserHost" Height="350" Width="525">
  <Window.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="Generic.xaml"/>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
  </Window.Resources>
  <Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <DockPanel Margin="2">
        <TextBlock FontWeight="Bold" Text="URL: " Margin="1" DockPanel.Dock="Left"/>
        <TextBox Text="{Binding ElementName=MyBrowserControl, Path=URL, Mode=TwoWay}" DockPanel.Dock="Right"/>
    </DockPanel>
    <local:BrowserControl x:Name="MyBrowserControl" Grid.Row="1" BorderBrush="Blue" BorderThickness="1">
    </local:BrowserControl>
  </Grid>
 </Window>

Answer 2

You might find it easier to use the UserControl class... just add a WebBrowser control into the UserControl XAML and then add your DependencyProperty into the code behind:

<UserControl x:Class="WpfApplication1.Views.WebBrowserControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    mc:Ignorable="d" 
    d:DesignHeight="300" d:DesignWidth="300">
    <WebBrowser Name="WebBrowser" /><!--Declare this here, not in code behind-->
</UserControl>

For your second requirement, you should investigate the WebBrowser.WebBrowser.Navigate and/or the WebBrowser.NavigateToString methods.

Finally, to react to changes in the DependencyProperty, you'll need to add a PropertyChangedCallback handler. You can find out how to do this by looking at the Dependency Property Callbacks and Validation page on MSDN.