Xamarin Forms PCL Carousel Page中的鍵盤覆蓋我的輸入字段

Question

我使用最新版本的Xamarin Forms。我有一個帶有內容頁面的Carousel頁面。內容頁面有一個滾動視圖，該視圖具有包含一些標籤和輸入輸入的堆疊佈局。當我觸摸條目輸入文本時，鍵盤會覆蓋輸入框，因此我看不到我正在輸入的內容。

我已經在基本應用程序上使用8個標籤和8個條目僅使用內容頁面（無輪播）測試了此功能，當鍵盤顯示爲我所期望的時，輸入框向上滾動（以留在視圖中）至。

但是，當我使用將上述內容頁面添加爲孩子的輪播頁面時，鍵盤會覆蓋我的輸入字段。

所以，下面的工作：

public App() 
    { 
     InitializeComponent(); 

     MainPage = new MainPage1(); 
    } 


namespace App2 
{ 

    [XamlCompilation(XamlCompilationOptions.Compile)] 
    public partial class MainPage1 : ContentPage 
    { 
     public MainPage1() 
     { 
      InitializeComponent(); 

      var vScrollView = new ScrollView 
      { 
       HorizontalOptions = LayoutOptions.Center, 
       VerticalOptions = LayoutOptions.FillAndExpand, 
       Margin = new Thickness(0, 5, 15, 25), 

      }; 
      var vStackLayout = new StackLayout 
      { 
       Orientation = StackOrientation.Vertical, 
       Spacing = 10, 
       HorizontalOptions = LayoutOptions.Start, 
       VerticalOptions = LayoutOptions.Start, 
       Margin = new Thickness(15, 0, 15, 25), 
       WidthRequest = 700 
      }; 

      //Create the form label for the item 
      var lblItemLabel = new Label 
      { 
       Text = "Label 1", 
       FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label)), 
       Margin = new Thickness(10, 0, 0, 0), 
      }; 
      vStackLayout.Children.Add(lblItemLabel); 

      var entry = new Entry 
      { 
       //HorizontalOptions = LayoutOptions.Fill, 
       MinimumWidthRequest = 300, 
       Margin = new Thickness(20, 0, 15, 15), 
      }; 
      vStackLayout.Children.Add(entry); 

      var lblItemLabel2 = new Label 
      { 
       Text = "Label 2", 
       FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label)), 
       Margin = new Thickness(10, 0, 0, 0), 
      }; 
      vStackLayout.Children.Add(lblItemLabel2); 

      var entry2 = new Entry 
      { 
       //HorizontalOptions = LayoutOptions.Fill, 
       MinimumWidthRequest = 300, 
       Margin = new Thickness(20, 0, 15, 15), 
      }; 
      vStackLayout.Children.Add(entry2); 

      var lblItemLabel3 = new Label 
      { 
       Text = "Label 3", 
       FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label)), 
       Margin = new Thickness(10, 0, 0, 0), 
      }; 
      vStackLayout.Children.Add(lblItemLabel3); 

      var entry3 = new Entry 
      { 
       //HorizontalOptions = LayoutOptions.Fill, 
       MinimumWidthRequest = 300, 
       Margin = new Thickness(20, 0, 15, 15), 
      }; 
      vStackLayout.Children.Add(entry3); 

      var lblItemLabel4 = new Label 
      { 
       Text = "Label 4", 
       FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label)), 
       Margin = new Thickness(10, 0, 0, 0), 
      }; 
      vStackLayout.Children.Add(lblItemLabel4); 

      var entry4 = new Entry 
      { 
       //HorizontalOptions = LayoutOptions.Fill, 
       MinimumWidthRequest = 300, 
       Margin = new Thickness(20, 0, 15, 15), 
      }; 
      vStackLayout.Children.Add(entry4); 

      var lblItemLabel5 = new Label 
      { 
       Text = "Label 5", 
       FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label)), 
       Margin = new Thickness(10, 0, 0, 0), 
      }; 
      vStackLayout.Children.Add(lblItemLabel5); 

      var entry5 = new Entry 
      { 
       //HorizontalOptions = LayoutOptions.Fill, 
       MinimumWidthRequest = 300, 
       Margin = new Thickness(20, 0, 15, 15), 
      }; 
      vStackLayout.Children.Add(entry5); 

      var lblItemLabel6 = new Label 
      { 
       Text = "Label 6", 
       FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label)), 
       Margin = new Thickness(10, 0, 0, 0), 
      }; 
      vStackLayout.Children.Add(lblItemLabel6); 

      var entry6 = new Entry 
      { 
       //HorizontalOptions = LayoutOptions.Fill, 
       MinimumWidthRequest = 300, 
       Margin = new Thickness(20, 0, 15, 15), 
      }; 
      vStackLayout.Children.Add(entry6); 

      var lblItemLabel7 = new Label 
      { 
       Text = "Label 7", 
       FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label)), 
       Margin = new Thickness(10, 0, 0, 0), 
      }; 
      vStackLayout.Children.Add(lblItemLabel7); 

      var entry7 = new Entry 
      { 
       //HorizontalOptions = LayoutOptions.Fill, 
       MinimumWidthRequest = 300, 
       Margin = new Thickness(20, 0, 15, 15), 
      }; 
      vStackLayout.Children.Add(entry7); 

      var lblItemLabel8 = new Label 
      { 
       Text = "Label 8", 
       FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label)), 
       Margin = new Thickness(10, 0, 0, 0), 
      }; 
      vStackLayout.Children.Add(lblItemLabel8); 

      var entry8 = new Entry 
      { 
       //HorizontalOptions = LayoutOptions.Fill, 
       MinimumWidthRequest = 300, 
       Margin = new Thickness(20, 0, 15, 15), 
      }; 
      vStackLayout.Children.Add(entry8); 


      vScrollView.Content = vStackLayout; 
      Content = vScrollView; 
     } 
    } 

} 

然而，當我創建一個CarouselPage並添加上述內容頁將其作爲一個孩子，鍵盤不再推動的觀點了。相反，它涵蓋了輸入字段。

以下，不工作：

public App() 
{ 
    InitializeComponent(); 

    MainPage = new CarouselPage1(); 
} 

namespace App2 
{ 

    [XamlCompilation(XamlCompilationOptions.Compile)] 
    public partial class CarouselPage1 : CarouselPage 
    { 
     public CarouselPage1() 
     { 
      InitializeComponent(); 

      var page = new MainPage1(); //Same exact MainPage1 as in first code block above. 
      this.Children.Add(page); 
     } 
    } 
} 

如何使鍵盤正常工作使用CarouselPage時未覆蓋我的輸入字段？

Answer 1

我想非常感謝Kym Phillpotts @微軟（Xamarin大學）爲他提供的幫助和解決方案。感謝我的Xamarin大學訂閱，我能夠與Kym一起使用1：1的課堂時間來回顧這個問題，他最終爲我提供了下面的代碼作爲修復。

此修補程序適用於UWP和WinPhone 8.1（iOS沒有該錯誤）。 Kym使用Xamarin Effects捕獲鍵盤顯示&隱藏事件並將效果註冊到滾動視圖元素。

在我的PCL，我創建了一個類，並放置在離金莎下面的代碼：在UWP和WinPhone平臺的具體項目

using Xamarin.Forms; 

namespace App2 
{ 
    public class KeyboardSpacingEffect : RoutingEffect 
    { 
     public KeyboardSpacingEffect() : base("Xamarin.KeyboardSpacingEffect") 
     { 
     } 
    } 
} 

然後，我創建了一個類，並放置在此代碼金莎：

using App2.WinPhone; //Make sure this using statement correctly points to the platform specific project and not the PCL project or you will get an error. 
using System.Diagnostics; 
using Windows.UI.ViewManagement; 
using Xamarin.Forms; 
using Xamarin.Forms.Platform.WinRT; 

[assembly: ResolutionGroupName("Xamarin")] 
[assembly: ExportEffect(typeof(KeyboardSpacingEffect), "KeyboardSpacingEffect")] 
namespace App2.WinPhone 
{ 
    public class KeyboardSpacingEffect : PlatformEffect 
    { 
     protected override void OnAttached() 
     { 
      InputPane.GetForCurrentView().Showing += Keyboard_OnShow; 
      InputPane.GetForCurrentView().Hiding += Keyboard_OnHide; 

     } 

     private void Keyboard_OnHide(InputPane sender, InputPaneVisibilityEventArgs args) 
     { 
      // debug stuff 
      Debug.WriteLine("Keyboard hide"); 
      var x = Element; 
      var y = Control; 
      var z = Container; 
      Debug.WriteLine($"{x} - {y} - {z}"); 

      // get the scrollview element and remove the margin 
      ScrollView scrollView = Element as ScrollView; 
      scrollView.Margin = new Thickness(0, 0, 0, 0); 
     } 

     private void Keyboard_OnShow(InputPane sender, InputPaneVisibilityEventArgs args) 
     { 
      // debug stuff 
      var x = Element; 
      var y = Control; 
      var z = Container; 
      Debug.WriteLine($"{x} - {y} - {z}"); 

      // get the scrollview element and add some margin to the bottom = size of keyboard 
      ScrollView scrollView = Element as ScrollView; 
      scrollView.Margin = new Thickness(0, 0, 0, args.OccludedRect.Height + 20); 
     } 

     protected override void OnDetached() 
     { 
      InputPane.GetForCurrentView().Showing += Keyboard_OnShow; 
      InputPane.GetForCurrentView().Hiding += Keyboard_OnHide; 
     } 
    } 
}