2012-06-27 152 views
1

我的目标是类似于this question
但我仍没有得到回答我的问题Web浏览器控件在WPF

所以,我需要做所见即所得的HTML编辑支持的应用程序设计和生成报告模板。和上面的问题一样,我在WPF中使用了WebBrowser控件。最大的问题是WPF web浏览器始终将designMode设置为后置null到HTML的身体。所以我把WinForm WebBrowser放到我的应用程序中。并设置或获取HTML文档从WebBrowser处理是非常困难的。

问:

  1. 有什么办法使这个(使用HTML编辑器WebBrowser控件)发生使用WPF没有改变WinForm的?
  2. 或者,如果没有。有任何解决方法,文章,代码或任何不论使所见即所得的HTML编辑器与可视化编辑器?

UPDATE:
我对MVVM目的,这些2附加属性。所以我可以使用HTMLSource获取/设置HTML,并在启动应用程序时设置设计模式。

IsDesignMode

public static readonly DependencyProperty IsDesignModeProperty = 
    DependencyProperty.RegisterAttached("IsDesignMode", typeof (Boolean), typeof (WebBrowserHelper), 
             new UIPropertyMetadata(false, IsDesignModePropertyChanged)); 

public static Boolean GetIsDesignMode(DependencyObject obj) 
{ 
    return (Boolean)obj.GetValue(IsDesignModeProperty); 
} 

public static void SetIsDesignMode(DependencyObject obj, Boolean value) 
{ 
    obj.SetValue(IsDesignModeProperty, value); 
} 

public static void IsDesignModePropertyChanged(DependencyObject obj, DependencyPropertyChangedEventArgs args) 
{ 
    WebBrowser browser = obj as WebBrowser; 
    if (browser != null) 
    { 
     Boolean designMode = (Boolean) args.NewValue; 
     if(designMode) 
     { 
      browser.LoadCompleted += (s, e) => 
      { 
       var htmlDoc = (s as WebBrowser).Document as IHTMLDocument2; 
       htmlDoc.body.setAttribute("contenteditable", "true"); 
       htmlDoc.designMode = "On"; 
      }; 
     } 
     else 
     { 
      browser.LoadCompleted += (s, e) => 
      { 
       var htmlDoc = (s as WebBrowser).Document as IHTMLDocument2; 
       htmlDoc.body.setAttribute("contenteditable", "false"); 
       htmlDoc.designMode = "Off"; 
      }; 
     } 
    } 
} 

HTMLSource

public static readonly DependencyProperty HTMLSourceProperty = 
    DependencyProperty.RegisterAttached("HTMLSource", typeof (String), typeof (WebBrowserHelper), 
             new UIPropertyMetadata(null, HTMLSourcePropertyChanged)); 

public static String GetHTMLSource(DependencyObject obj) 
{ 
    return (String)obj.GetValue(HTMLSourceProperty); 
} 

public static void SetHTMLSource(DependencyObject obj, String value) 
{ 
    obj.SetValue(HTMLSourceProperty, value); 
} 

public static void HTMLSourcePropertyChanged(DependencyObject o, DependencyPropertyChangedEventArgs args) 
{ 
    WebBrowser browser = o as WebBrowser; 
    if (browser != null) 
    { 
     browser.NavigateToString(args.NewValue as String); 
    } 
} 

VIEW

<UserControl x:Class="Delay.View.LayoutView" 
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
      xmlns:browser="clr-namespace:Delay.Helper" 
      xmlns:cal="http://www.caliburnproject.org" 
      xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"> 
    <UserControl.Resources> 
     <Style x:Key="ButtonStyle" TargetType="Button"> 
      <Setter Property="Width" Value="100" /> 
      <Setter Property="Height" Value="40" /> 
      <Setter Property="Margin" Value="2.5,0" /> 
      <Setter Property="ContentTemplate"> 
       <Setter.Value> 
        <DataTemplate> 
         <StackPanel> 
          <ContentPresenter Content="{TemplateBinding Content}" 
               TextBlock.FontSize="15" /> 
         </StackPanel> 
        </DataTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </UserControl.Resources> 
    <Grid Background="Lavender"> 
     <DockPanel> 
      <TextBlock HorizontalAlignment="Center" Text="Layout Designer" 
         DockPanel.Dock="Top" FontSize="20" /> 
      <WebBrowser Name="webBrowser" HorizontalAlignment="Stretch" DockPanel.Dock="Top" Margin="8" Height="435" 
         browser:WebBrowserHelper.HTMLSource="{Binding HtmlPage}" browser:WebBrowserHelper.IsDesignMode="True" /> 
      <StackPanel Orientation="Horizontal" DockPanel.Dock="Bottom" HorizontalAlignment="Center"> 
       <StackPanel Orientation="Vertical" Margin="5,0"> 
        <ComboBox ItemsSource="{Binding LayoutTags}" SelectedItem="{Binding SelectedTag}" 
           HorizontalAlignment="Stretch" Margin="0,5" MinWidth="100"> 
         <ComboBox.ItemTemplate> 
          <DataTemplate> 
           <TextBlock FontSize="12" Text="{Binding TagName}" /> 
          </DataTemplate> 
         </ComboBox.ItemTemplate> 
        </ComboBox> 
        <ListBox ItemsSource="{Binding LayoutValueTypes}" SelectedItem="{Binding SelectedType}" 
          Width="{Binding ElementName=cmbTag, Path=ActualWidth}" Height="70"> 
         <ListBox.ItemTemplate> 
          <DataTemplate> 
           <TextBlock FontSize="12" Text="{Binding TypeName}" /> 
          </DataTemplate> 
         </ListBox.ItemTemplate> 
        </ListBox> 
       </StackPanel> 
       <StackPanel Orientation="Vertical"> 
        <StackPanel Orientation="Horizontal"> 
         <CheckBox Name="IsDesignMode" Content="Design Mode" TextBlock.FontSize="12"> 
          <i:Interaction.Triggers> 
           <i:EventTrigger EventName="Checked"> 
            <cal:ActionMessage MethodName="DesignModeOnOff"> 
             <cal:Parameter Value="{Binding ElementName=webBrowser}" /> 
             <cal:Parameter Value="{Binding IsDesignMode}" /> 
            </cal:ActionMessage> 
           </i:EventTrigger> 
          </i:Interaction.Triggers> 
         </CheckBox> 
        </StackPanel> 
        <Button Name="PutComponent" Style="{StaticResource ButtonStyle}" 
         Content="Put" /> 
        <Button Name="SaveLayout" Style="{StaticResource ButtonStyle}" 
         Content="Save" /> 
       </StackPanel> 
      </StackPanel> 
     </DockPanel> 
    </Grid> 
</UserControl> 
+0

最好的答案就是使用CONTENTEDITABLE,而不是将designMode。这是使用两者。删除designMode。如果您在设置designMode(我的记忆不清楚)之后使用了DocumentCompleted **,您可能会**使designMode工作。 – user34660

回答

1

你尝试一些开放源码而不是WInForms的替代品?

我觉得这个人有良好的互动,并能处理JavaScript回调到WPF了。

http://wpfchromium.codeplex.com/

0

我写了一个很简单的WPF应用程序,使用嵌入的资源为HTML和包含下面的代码:

Stream s = GetType().Assembly.GetManifestResourceStream("WpfApplication5.HTMLPage1.htm"); 
    webBrowser1.NavigateToStream(s); 
    IHTMLDocument2 doc = webBrowser1.Document as IHTMLDocument2; 
    doc.designMode = "On"; 

代码和预期一样的,我可以编辑网页的内容 - 按照您的建议将其设置为designMode后,它不会被清空。也许从上面的代码开始,并检查你可以得到它的工作。

+0

我不喜欢使用嵌入的资源,所以我可以加载HTML我之前创建。看到我更新的问 – asakura89