在我的Xamarin Forms
應用程序中,我通過插入contentEditable
設置爲true的div作爲表單使用WebView
。它一直運行正常,直到更新到AppCompat
樣式。在使用Xamarin Forms更新到AppCompat後,WebView中的白色重疊
現在,當用戶試圖在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表單錯誤還是我做錯了什麼?