【问题标题】:How to show html format using RichTextBlock如何使用 RichTextBlock 显示 html 格式
【发布时间】:2020-02-06 09:51:27
【问题描述】:

我目前正在处理 Windows 10 UWP 项目。我从服务器获取一个 HTML 文件,我想在 UWP 应用程序中显示它。我想使用 RichTextBlock 而不是 web 视图。我尝试了使用 Html2Xaml 库的 github 代码here,但是当我尝试将数据绑定到 RichTextBlock。我找到了this,但它只包含将 rtf 转换为 html

我只是想将 html 转换为 RichTextBlock 并在 UWP 应用程序中显示 html 文件。请有人建议如何使用 RichTextBlock 实现我的要求

【问题讨论】:

    标签: uwp richtextblock


    【解决方案1】:

    显示Html最好的方式是使用WebView,但是如果你想将它转换成RichTextBlock可以显示的文本,这可能会更复杂。

    让我简单解释一下这个想法:

    1.加载 Html 并将其转换为可解析的实体。

    在nuget包管理器中可以找到一些相关的Html解析包,搜索Html下载最流行的包。

    2。解析Html文档,根据标签类型递归生成对应的BlockInline

    递归方法是检查当前正在解析的Tag是否有children,如果有,重复parse方法。

    3.编写各种标签的转换方法

    RichTextBlock不能根据Html标签转换成对应的样式文本,所以这个需要自己写。

    <b> ... </b> 为例,这是一个粗体的内嵌文本。转换时可以使用此方法:

    private static Inline GenerateBold(HtmlNode node)
    {
        if (string.IsNullOrEmpty(node.InnerText.Trim()))
            return null;
        Span s = new Span();
        s.Inlines.Add(new Run() { Text = node.InnerText.Trim(), FontWeight = FontWeights.Bold });
        return s;
    }
    

    RichTextBlock支持的文本类型在Windows.UI.Xaml.Documents命名空间下,主要分为InlineBlock。如果你想查看这个命名空间中的所有文本类型,可以查看这个document


    将 Html 标签转换为 RichTextBlock 支持的文本类型需要一对一的转换。另外,RichTextBlock中的样式可能无法完全复现CSS的效果(也就是说你还需要自己构建一个CSS解析器)。

    如果你打算把这份工作做得很好,我希望我的建议可以帮助你。

    最好的问候。

    【讨论】:

    • 感谢您的解释。如果我编写转换方法,如何将它绑定到 xaml 文件中的richtextblock。我已经尝试过一次这样 。这个 HtmlProperties 是转换器方法的类名。但是它给出了错误提示 The property "HtmlProperties" does not exist in the "using XAMLHtml" namespace
    • 你好,有可以复现的demo吗? converter:HtmlProperties应该是你自己写的依赖属性,不知道是怎么实现的。但如果是我,我可能会在解析Html后根据标签生成List<Block>,然后在RichTextBlock.Blocks中添加条目
    • 我在这里问了关于这个问题的问题。 stackoverflow.com/questions/60073947/… 包含我用来转换的代码。我是 UWP 新手,还不擅长这些东西
    • 嗨,我在问题中查看了您的代码,您定义了 Html 属性,但您没有实现 SetHtmlGetHtml 方法,这就是为什么您的自定义依赖属性是未识别。请检查 Nico Zhu 在问题中的解决方案。在他的解决方案的MainPage.xaml.cs中,有一个Properties类,里面有GetHtmlSetHtml的实现。
    猜你喜欢
    • 1970-01-01
    • 2012-10-16
    • 1970-01-01
    • 2021-11-28
    • 1970-01-01
    • 1970-01-01
    • 2013-07-20
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多