如何在Xamarin表单的Scrollview中将HTML添加到Stacklayout中? [英] How can I add HTML to a Stacklayout inside a Scrollview in Xamarin forms?

查看:82
本文介绍了如何在Xamarin表单的Scrollview中将HTML添加到Stacklayout中?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在我的应用程序中,我有一个带有Scrollview的Contentpage. Scrollview依次包含一个带有大量带有文本标签的StackLayout.在此过程中,我想插入一些静态HTML.

我尝试将带有静态HTML的Webview作为子级添加到StackLayout,但是此时Webview不可见(可能高度被计算为零)

有人知道如何解决此问题吗?还是有其他方法可以在所有标签之间添加HTML?

StackLayout mainLayout = new StackLayout ();

// Adding many labels of different sizes
mainLayout.Children.Add (new Label {Text = "Label text"});

mainLayout.Children.Add ( new WebView {
            Source = new HtmlWebViewSource {
                Html = "<html><body>Hello</body></html>"
            }
});

// Adding many more labels of different sizes
mainLayout.Children.Add (new Label {Text = "Even more Label text"});

Content = new ScrollView {
            Content = mainLayout
        };

解决方案

我找到了一个很好的解决方案这里

using Xamarin.Forms;

namespace YourNamespace
{
    public class HtmlLabel : Label
    {
    }
}

iOS渲染器

[assembly: ExportRenderer(typeof(HtmlLabel), typeof(HtmlLabelRenderer))]
namespace YourNamespace
{
    class HtmlLabelRenderer : LabelRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Label> e)
        {
            base.OnElementChanged(e);

            if (e.NewElement == null)
            {
                return;
            }

            var attr = new NSAttributedStringDocumentAttributes();
            var nsError = new NSError();
            attr.DocumentType = NSDocumentType.HTML;

            var text = e.NewElement.Text;

            //I wrap the text here with the default font and size
            text = "<style>body{font-family: '" + this.Control.Font.Name + "'; font-size:" + this.Control.Font.PointSize + "px;}</style>" + text;

            var myHtmlData = NSData.FromString(text, NSStringEncoding.Unicode);
            this.Control.AttributedText = new NSAttributedString(myHtmlData, attr, ref nsError);

        }

        protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            base.OnElementPropertyChanged(sender, e);

            if (this.Control == null)
            {
                return;
            }

            if (e.PropertyName == Label.TextProperty.PropertyName)
            {
                var attr = new NSAttributedStringDocumentAttributes();
                var nsError = new NSError();
                attr.DocumentType = NSDocumentType.HTML;

                var myHtmlData = NSData.FromString(this.Control.Text, NSStringEncoding.Unicode);
                this.Control.AttributedText = new NSAttributedString(myHtmlData, attr, ref nsError);
            }
        }
    }
}

Android渲染器

[assembly: ExportRenderer(typeof(HtmlLabel), typeof(HtmlLabelRenderer))]
namespace YourNamespace
{
    class HtmlLabelRenderer : LabelRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Label> e)
        {
            base.OnElementChanged(e);

            Control?.SetText(Html.FromHtml(Element.Text), TextView.BufferType.Spannable);
        }

        protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            base.OnElementPropertyChanged(sender, e);

            if (e.PropertyName == Label.TextProperty.PropertyName)
            {
                Control?.SetText(Html.FromHtml(Element.Text), TextView.BufferType.Spannable);
            }
        }
    }
}

我发现Html.FromHtml很基本.我最终绑定了此库,该库有助于列表和(需要一些工作)跨度标签.

In my application I have a Contentpage with a Scrollview in it. The Scrollview in turn contains a StackLayout with lots of labels with text. In the middle of this I want to insert some static HTML.

I have tried adding a Webview with static HTML as a child to the StackLayout but the Webview is not visible then (Probably the height gets calculated to zero)

Does anyone know how to fix this? Or is there some other way to add HTML in the between all the labels?

StackLayout mainLayout = new StackLayout ();

// Adding many labels of different sizes
mainLayout.Children.Add (new Label {Text = "Label text"});

mainLayout.Children.Add ( new WebView {
            Source = new HtmlWebViewSource {
                Html = "<html><body>Hello</body></html>"
            }
});

// Adding many more labels of different sizes
mainLayout.Children.Add (new Label {Text = "Even more Label text"});

Content = new ScrollView {
            Content = mainLayout
        };

解决方案

I found a great solution here

using Xamarin.Forms;

namespace YourNamespace
{
    public class HtmlLabel : Label
    {
    }
}

iOS renderer

[assembly: ExportRenderer(typeof(HtmlLabel), typeof(HtmlLabelRenderer))]
namespace YourNamespace
{
    class HtmlLabelRenderer : LabelRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Label> e)
        {
            base.OnElementChanged(e);

            if (e.NewElement == null)
            {
                return;
            }

            var attr = new NSAttributedStringDocumentAttributes();
            var nsError = new NSError();
            attr.DocumentType = NSDocumentType.HTML;

            var text = e.NewElement.Text;

            //I wrap the text here with the default font and size
            text = "<style>body{font-family: '" + this.Control.Font.Name + "'; font-size:" + this.Control.Font.PointSize + "px;}</style>" + text;

            var myHtmlData = NSData.FromString(text, NSStringEncoding.Unicode);
            this.Control.AttributedText = new NSAttributedString(myHtmlData, attr, ref nsError);

        }

        protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            base.OnElementPropertyChanged(sender, e);

            if (this.Control == null)
            {
                return;
            }

            if (e.PropertyName == Label.TextProperty.PropertyName)
            {
                var attr = new NSAttributedStringDocumentAttributes();
                var nsError = new NSError();
                attr.DocumentType = NSDocumentType.HTML;

                var myHtmlData = NSData.FromString(this.Control.Text, NSStringEncoding.Unicode);
                this.Control.AttributedText = new NSAttributedString(myHtmlData, attr, ref nsError);
            }
        }
    }
}

Android renderer

[assembly: ExportRenderer(typeof(HtmlLabel), typeof(HtmlLabelRenderer))]
namespace YourNamespace
{
    class HtmlLabelRenderer : LabelRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Label> e)
        {
            base.OnElementChanged(e);

            Control?.SetText(Html.FromHtml(Element.Text), TextView.BufferType.Spannable);
        }

        protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            base.OnElementPropertyChanged(sender, e);

            if (e.PropertyName == Label.TextProperty.PropertyName)
            {
                Control?.SetText(Html.FromHtml(Element.Text), TextView.BufferType.Spannable);
            }
        }
    }
}

I found Html.FromHtmlis pretty basic. I ended up binding this library which helped with lists and (with a bit of work) span tags.

这篇关于如何在Xamarin表单的Scrollview中将HTML添加到Stacklayout中?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆