我的Xamarin Forms PCL Carousel页面中的键盘覆盖了我的输入字段

Question

我使用最新版本的Xamarin Forms。我有一个带有内容页面的轮播页面。内容页面有一个滚动视图，其堆栈布局包含一些标签和条目输入。当我触摸条目输入文本时，键盘覆盖了输入框，因此我无法看到我正在键入的内容。

我已经在一个基本应用程序上测试了这个功能，只使用了一个内容页面（没有Carousel），带有8个标签和8个条目，当键盘显示时，Entry框会向上滚动（保持在视图中），我希望它能够显示。

但是，当我使用将上述内容页面添加为子项的轮播页面时，键盘会覆盖我的输入字段。

所以，以下工作：

    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并将上述内容页面作为子项添加到其中时，键盘不再推送视图。相反，它涵盖了Entry字段。

以下，不起作用：

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 @ Microsoft（Xamarin大学）对这个问题的帮助和解决方案。感谢我的Xamarin大学订阅，我能够与Kym一起使用1：1的课堂时间来回顾这个问题，他最终为我提供了以下代码作为修复。

此修复程序适用于UWP和WinPhone 8.1（iOS没有错误）。 Kym使用Xamarin Effects来捕捉键盘显示＆amp;隐藏事件并将效果注册到滚动视图元素。

在我的PCL中，我创建了一个类并从Kym中放置了以下代码：

using Xamarin.Forms;

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

然后在UWP和WinPhone平台特定的项目中，我创建了一个类并放置了来自Kym的代码：

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;
        }
    }
}