首页 文章

如何在Xamarin表单中的Scrollview内向Stacklayout添加HTML？

提问于
浏览 次
3

在我的应用程序中，我有一个带有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
        };
xamarin xamarin.forms

2 回答

  • 3

    见https://developer.xamarin.com/guides/xamarin-forms/user-interface/webview/，特别是：

    WebView要求在StackLayout或RelativeLayout中包含HeightRequest和WidthRequest . 如果未指定这些属性，则WebView将不会呈现 .

    HeightRequest和WidthRequest未在上面的代码片段中设置，因此应该尝试修复此问题 .

    回复于
  • 2

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

    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 非常基本 . 我最终绑定了this library，这有助于列表和（有一点工作）span标签 .

    回复于

相关问题