android – 使用Xamarin Forms更新到AppCompat后,在WebView中使用白色覆盖

2023年5月20日 160次阅读

在我的Xamarin Forms应用程序中,我将一个WebView用作表单,方法是将contentEditable设置为true.在更新AppCompat样式之前,一切正常.

现在,当用户尝试在WebView内部写入时,会出现一个奇怪的白色叠加层(白色方块),当键盘被解除时,它会消失.为了找到问题的根本原因,我创建了一个示例项目,其中只有一个页面只包含一个包含另一个堆栈布局和webview的垂直堆栈布局.我注意到的是,如果内部堆栈布局的高度足以使webview在出现时被键盘覆盖,则会出现此问题.在这种情况下,webview被推高,并出现这个奇怪的叠加层. webview功能齐全,即使被白色方块隐藏,也可以写入文本,当键盘被解除时,文本会消失.

这是一个可用于测试问题的简单页面的示例.添加按钮只是为了增加和减小布局的大小以更容易地显示问题

public class MainPage : ContentPage
{
    const string ContentEdit = @"<div contentEditable=""true"" style =""min-height: 200px"">";
    const string ContentEditEnd = "</div>";
    const string EmptyDocument = @"<body>" + ContentEdit + ContentEditEnd + @"</body>";

    WebView webView;

    public MainPage()
    {
        InitializePage();
    }

    void InitializePage()
    {
        webView = new WebView()
        {
            VerticalOptions = LayoutOptions.FillAndExpand,
            HorizontalOptions = LayoutOptions.FillAndExpand,
        };

        var button1 = new Button
        {
            HorizontalOptions = LayoutOptions.CenterAndExpand,
            VerticalOptions = LayoutOptions.CenterAndExpand,
            Text = "-",
        };

        var button2 = new Button
        {
            HorizontalOptions = LayoutOptions.CenterAndExpand,
            VerticalOptions = LayoutOptions.CenterAndExpand,
            Text = "+",
        };

        var tallLayout = new StackLayout()
        {
            Orientation = StackOrientation.Horizontal,
            HeightRequest = 200, 
            BackgroundColor = Color.Lime,
            Children = { button1, button2, },
        };

        button1.Clicked += (sender, e) => tallLayout.HeightRequest = tallLayout.Height - 20;
        button2.Clicked += (sender, e) => tallLayout.HeightRequest = tallLayout.Height + 20;

        var layout = new StackLayout
        {
            Orientation = StackOrientation.Vertical,
            VerticalOptions = LayoutOptions.FillAndExpand,
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Children = { tallLayout, webView },
        };

        Content = layout;
    }

    protected override void OnAppearing()
    {
        InitializeEmptyContent();
    }

    public void InitializeEmptyContent()
    {
        var htmlSource = new HtmlWebViewSource();
        htmlSource.Html = EmptyDocument;

        webView.Source = htmlSource;
    }
}

我曾尝试使用原生Android重现这个简单的布局,但似乎我没有任何类似的错误.这是一个Xamarin Forms错误还是我做错了什么？

最佳答案 最后,问题被认为是Xamarin
bug.

点赞