Xamarin。使用内容构建webview自动高度

时间:2018-01-19 06:53:13

标签: xamarin xamarin.forms xamarin.ios xamarin.android

我在页面上使用Webview和Label控件。一旦WebView滚动到其内容的末尾,我想显示标签。 这是一张显示正在发生的事情的图片:

enter image description here

标签始终位于底部。

我试过这段代码:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <WebView Grid.Row="0"  Source="{Binding DetailHtml}"></WebView>
    <Label Grid.Row="1" Text="TIN LIÊN QUAN" TextColor="#5ea201" FontAttributes="Bold"/>
</Grid>

和此:

<StackLayout>
    <WebView Source="{Binding DetailHtml}"></WebView>
    <Label  Text="TIN LIÊN QUAN" TextColor="#5ea201" FontAttributes="Bold"/>
</StackLayout>

我还尝试使用WebView的自定义渲染器来设置高度,但它不起作用:

[assembly: ExportRenderer(typeof(WebView), typeof(WebViewCustomRenderer))]
namespace SucKhoeGiaDinh.iOS.Renderers
{
    public class WebViewCustomRenderer : WebViewRenderer
    {
        protected override void OnElementChanged(VisualElementChangedEventArgs e)
        {
            base.OnElementChanged(e);
            Delegate = new ExtendedUIWebViewDelegate(this);
        }
    }

    public class ExtendedUIWebViewDelegate : UIWebViewDelegate
    {
        WebViewCustomRenderer webViewRenderer;

        public ExtendedUIWebViewDelegate(WebViewCustomRenderer _webViewRenderer = null)
        {
            webViewRenderer = _webViewRenderer ?? new WebViewCustomRenderer();
        }

        public override async void LoadingFinished(UIWebView webView)
        {
            if (webViewRenderer.Element is WebView wv)
            {
                await System.Threading.Tasks.Task.Delay(100); // wait here till content is rendered
                wv.HeightRequest = (double)webView.ScrollView.ContentSize.Height;
            }
        }
    }
}

我可以用另一种方法来实现这个目标吗?

1 个答案:

答案 0 :(得分:2)

我解决了我的问题。

<ScrollView >
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="20"/>
        </Grid.RowDefinitions>
        <WebView Grid.Row="0"  Source="{Binding DetailHtml}" />
        <Label Grid.Row="1" Text="TIN LIÊN QUAN" TextColor="#5ea201" FontAttributes="Bold"/>
    </Grid>
</ScrollView>

并自定义渲染webview以按内容设置高度。