Windows 窗体应用程序中的 HTML 编辑器 [关闭]答案

【问题标题】：HTML Editor in a Windows Forms Application [closed]Windows 窗体应用程序中的 HTML 编辑器 [关闭]
【发布时间】：2010-09-05 17:38:08
【问题描述】：

我们正在为我们的 Windows 应用程序（vb.net 或 c#）寻找一个所见即所得的编辑器控件，以便用户可以在发送之前设计 HTML 电子邮件（使用 .net 框架中的 SMTP 对象发送）。

目前我们能找到的所有可用编辑器都存在以下问题之一：

它们依赖于 mshtml.dll 或 Web 浏览器控件，这证明我们不可靠，因为 HTML 代码和编辑器在 windows 2000 (IE6) 下不同步
它们是基于 Web 的，而不是 Windows 窗体控件
它们将样式放在文档的头部（见下面的注释）

不幸的是，HTML email article 描述了使 HTML 电子邮件与样式一起使用的唯一可靠方法是内联使用它们，现在许多编辑器似乎不支持。

有没有人有这方面的经验或可以提出解决方案？

【问题讨论】：

标签： c# .net vb.net winforms controls

【解决方案1】：

Windows 窗体中最简单的 HTML 编辑器可以在 WebBrowser 控件中显示 <div contenteditable="true"></div>。它内置了对常见 html 文本编辑功能的支持，例如：

Ctrl+B 使选择变为粗体
Ctrl+I 使选择变为斜体
Ctrl+U 使选择加下划线
Ctrl+A 选择所有文本
Ctrl+C 复制选择
Ctrl+X 剪切选择
Ctrl+V 粘贴选择
Ctrl+K 插入链接

但是，为了获得更好的用户体验，您可以依赖 WebBrower 中的 DOM document 对象并使用其 execCommand 方法并轻松运行诸如 Bold、Italic、Underline、InsertOrderedList 之类的命令， InsertUnorderedList、InsertImage、FormatBlock、ForeColor、BackColor等

例如以下命令插入有序列表：

webBrowser1.Document.ExecCommand("InsertOrderedList", false, null);

Examlpe - Windows 窗体 HTML 编辑器

在这里，我将分享一个 C# 应用程序的示例，并向您展示如何轻松实现 HTML 编辑器。

public class HtmlEditor
{
    WebBrowser webBrowser;
    private dynamic doc;
    private dynamic contentDiv;
    public HtmlEditor(WebBrowser webBrowserControl, string htmlContent)
    {
        webBrowser = webBrowserControl;
        webBrowser.DocumentText = @"<div contenteditable=""true""></div>";
        webBrowser.DocumentCompleted += (s, e) =>
        {
            doc = webBrowser.Document.DomDocument;
            contentDiv = doc.getElementsByTagName("div")[0];
            contentDiv.innerHtml = htmlContent;
        };
    }
    public string HtmlContent => contentDiv.InnerHtml;
    public void Bold() { doc.execCommand("bold", false, null); }
    public void Italic() { doc.execCommand("italic", false, null); }
    public void Underline() { doc.execCommand("underline", false, null); }
    public void OrderedList() { doc.execCommand("insertOrderedList", false, null); }
    public void UnorderedList() { doc.execCommand("insertUnOrderedList", false, null); }
    public void ForeColor(Color color)
    {
        doc.execCommand("foreColor", false, ColorTranslator.ToHtml(color));
    }
    public void BackColor(Color color)
    {
        doc.execCommand("backColor", false, ColorTranslator.ToHtml(color));
    }
    public void InsertImage(Image image)
    {
        var bytes = (byte[])new ImageConverter().ConvertTo(image, typeof(byte[]));
        var src = $"data:image/png;base64,{Convert.ToBase64String(bytes)}";
        doc.execCommand("insertImage", false, src);
    }
    public void Heading(Headings heading)
    {
        doc.execCommand("formatBlock", false, $"<{heading}>");
    }
    public enum Headings { H1, H2, H3, H4, H5, H6 }
}

要使用这个 HTML 编辑器类，在 Form 上拥有一个 WebBrowser 控件并以这种方式初始化编辑器就足够了：

HtmlEditor editor;
private void Form1_Load(object sender, EventArgs e)
{
    var html = @"Some html content";
    editor = new HtmlEditor(webBrowser1, html);
}

然后您可以使用ToolStrip 显示可用命令并运行这些命令。例如：

private void OrderedListButton_Click(object sender, EventArgs e)
{
    editor.OrderedList();
}

private void ImageButton_Click(object sender, EventArgs e)
{
    using (var ofd = new OpenFileDialog())
    {
        ofd.Filter = "Image files|*.png;*.jpg;*.gif;*.jpeg;*.bmp";
        if (ofd.ShowDialog() == DialogResult.OK)
        {
            using (var image = Image.FromFile(ofd.FileName))
            {
                editor.InsertImage(image);
            }
        }
    }
}

【讨论】：

对于 WinForms HTML 编辑器的一般问题，这是一个有用的答案，尽管对于正文中指出的这个特定问题问题 A （“它们依赖于 mshtml.dll 或 Web 浏览器控件，证明我们是不可靠的，因为 HTML 代码和编辑器在 windows 2000 (IE6) 下不同步") 似乎会阻止使用 WebBrowser 控件，就像你在这里一样。此外，这似乎与@YaakovEllis' answer 中链接的（外部）资源中记录的方法相同。
答案并没有声称是创新的，也没有试图帮助 OP，因为问题很老旧，OP 不太可能寻找新的答案。但是由于该问题是您在 Windows 窗体中搜索 HTML 编辑器时的第一个搜索结果，并且它是关闭类似问题的主要候选者，因此我相信它需要这样一个独立的答案并共享一个最小且简单的示例，虽然不完美，但对于未来的读者来说已经足够了。无论如何，感谢@BACON 的评论。

【解决方案2】：

我还需要一个 WYSIWYG 编辑器来用于我正在处理的 Windows 窗体项目。我写了关于我发现here 的项目。最终，我最终使用了在 CodeProject 上找到的东西：A Windows Forms based text editor with HTML output。这确实违反了上面的 (a)，因为它使用了 WebBrowser 控件。但是，我找不到任何不这样做的好东西（如果你不以某种方式使用 WebBrowser，那么你基本上必须编写自己的 HTML 解析器和渲染器来处理“你什么 -见“所见即所得的一部分）。这个控件的好处是源很容易自定义，因此您可以根据需要删除和添加格式选项（如果您希望样式全部内联，您也可以这样做）。

【讨论】：

【解决方案3】：

这是我的第一个贡献。

您可以使用 RichTextBox。 RTF 格式足以创建电子邮件。

我最近写了一篇关于如何将 RichTextBox 的内容加载并保存到硬盘的文章。

允许复制和粘贴。它使用简单，只需几个按钮，您就可以创建自己的命令。

With RichTextBox1 
    .SelStart = 0 
    .SelLength = Len (. Text) 
    .SelColor = vbRed
End With

加载和保存示例。

http://danielcatala.wordpress.com/2014/01/30/como-cargar-y-guardar-archivos-richtext-con-wpf/

Private Sub btnCarga(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button1.Click

    Dim archivoCarga As New StreamReader("prueba.rtf")
    With RichTextBox1
        .Selection.Select(.Document.ContentStart, RichTextBox1.Document.ContentEnd)
        .Selection.Load(archivoCarga.BaseStream, System.Windows.DataFormats.Rtf)
    End With
End Sub

Private Sub btnGuarda(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button2.Click

    Dim archivoSalida As New StreamWriter("prueba.rtf")
    Dim bs As Stream = archivoSalida.BaseStream

    With RichTextBox1
        .Selection.Select(RichTextBox1.Document.ContentStart,     RichTextBox1.Document.ContentEnd)
        .Selection.Save(bs, System.Windows.DataFormats.Rtf)
    End With
End Sub

【讨论】：

【解决方案4】：

与其搜索 HTML 编辑器，不如考虑使用 RichText 编辑器（它更容易创建），然后将最终文本转换为 HTML 文档。

如果您需要使用最少的功能集（粗体/斜体等），RT 编辑器的创建和最终文档到 HTML 格式的转换应该不难。

另一方面，如果您需要使用更多功能（例如表格），则需要研究Rich Text Format并实现您需要的功能。

其他资源：

将 RTF 转换为 HTML：http://www.codeproject.com/KB/vb/RTFToHTML.aspx
RichTextBox 提示和技巧：http://www.vbforums.com/showthread.php?t=355994

【讨论】：

这就是我们最终要做的，使用 aspose 词进行转换。

【解决方案5】：

我一直在使用this one，它比WebBrowser 略低，但仍然使用MSHTML，它确实会吐出一些难看的HTML。出于我的目的，我正在使用 WYSIWYG 和 HTML 编辑模式（使用ICSharp.TextEditor）做一个多标签编辑器，并在标签更改时使用 Buffer 类进行更新。作为 Buffer 类的一部分，我实际上是 run the HTML through HTML Tidy 和一些擦洗-n-替换位来获得有效的 XHTML。

我仅将其作为一种解决方案提供，因为我也未能找到不是以某种方式从 MSHTML 派生的解决方案，最终只是继续使用上述解决方案以继续前进。

【讨论】：