Xamarin Html ярлык с прокруткой - PullRequest
Новая
       10

Xamarin Html ярлык с прокруткой

0 голосов
/ 21 марта 2020

Я создаю новое приложение для чтения.

И у меня есть html, который является главой.

Я создал специальную метку htmlLabel, которая будет содержать html

Проблема в том, что размер метки такой же большой, как и весь экран. Весь остальной текст остается скрытым

У меня есть метка внутри скролл-просмотра, но даже при этом она увеличивается только до размера экрана для некоторая причина

Вот мой пользовательский рендерер меток. Теперь я знаю, что могу использовать веб-просмотр, но мне все равно нужен ярлык. 

sing System;
using System.ComponentModel;
using Android.Content;
using Android.Support.V4.Text;
using Android.Text;
using Android.Widget;
using Comic.Viewer.Controllers;
using Comic.Viewer.Droid.Renderer;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;
[assembly: ExportRenderer(typeof(ClickableHtmlLabel), typeof(ClickableHtmlLabelRenderer))]
namespace Comic.Viewer.Droid.Renderer
{
   public class ClickableHtmlLabelRenderer : LabelRenderer
    {
        public ClickableHtmlLabelRenderer(Context context) : base(context)
        {

        }


        protected override void OnElementChanged(ElementChangedEventArgs<Label> e)
        {
            base.OnElementChanged(e);

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

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

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

            var el = Element as ClickableHtmlLabel;
            this.Click += new EventHandler((o, sender) =>
            {
                el.Clicked();

            });
        }
    }
}

1 Ответ

0 голосов
/ 23 марта 2020

Вы можете использовать пользовательский рендер для создания HtmlLabel. А затем поместите HtmlLabel внутрь ScrollView. Это сделало бы прокрутку HtmlLabel. Я делаю пример кода для вашей справки.

HtmlLabel.cs 

public class HtmlLabel : Label
{
}

HtmlLabelRenderer.cs 

[assembly: ExportRenderer(typeof(HtmlLabel), typeof(HtmlLabelRenderer))]
namespace XamarinDemo.Droid.Renderers
{
 class HtmlLabelRenderer : LabelRenderer
 {
    public HtmlLabelRenderer(Context context) : base(context)
    {

    }
    protected override void OnElementChanged(ElementChangedEventArgs<Label> e)
    {
        base.OnElementChanged(e);

        if (Control != null && e.NewElement != null)
        {
            UpdateText();
        }
    }

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

        if (e.PropertyName == nameof(HtmlLabel.Text))
        {
            UpdateText();
        }
    }

    void UpdateText()
    {
        if (string.IsNullOrWhiteSpace(Element?.Text))
        {
            Control.Text = string.Empty;
            return;
        }

        Control.TextFormatted = Build.VERSION.SdkInt >= BuildVersionCodes.N
            ? Html.FromHtml(Element.Text, FromHtmlOptions.ModeCompact)
#pragma warning disable CS0618 // Type or member is obsolete
            : Html.FromHtml(Element.Text);
#pragma warning restore CS0618 // Type or member is obsolete

        Control.MovementMethod = Android.Text.Method.LinkMovementMethod.Instance;
     }
  }

Uasge: 

 <ContentPage.Content>
    <ScrollView>
        <control:HtmlLabel x:Name="htmlLabel" FontSize="Large"/>
    </ScrollView>
 </ContentPage.Content>

Установите текст html. 

  htmlLabel.Text = @"<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>Starting.</h1>
<p>This is a paragraph.</p>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<h1>This is a Heading</h1>
<p>Ending.</p>

</body>
</html>";

enter image description here

...