.NET MAUI 应用程序上 iOS 上覆盖表单元素的键盘

Question

我正在将我的 Xamarin 应用程序转换为 .NET MAUI，看起来该<ScrollView>解决方案在 iOS 上的 .NET MAUI 应用程序上不起作用，或者我做错了什么。不过它在 Android 上运行得很好。有什么建议么？此外，同样的布局在 Xamarin 中运行良好。

我的表格如下所示：

<ScrollView
   Orientation="Neither"
   Padding="0"
   HorizontalOptions="CenterAndExpand">
   <Grid
      RowDefinitions="500,Auto"
      ColumnDefinitions="*">
            
      <!-- Background Image -->
      <Image
         Grid.RowSpan="2"
         Source="my_background_image.jpg"
         Aspect="AspectFill"/>
            
         <!-- Logo -->
         <Image
            Grid.Row="0"
            Source="my_logo.png"
            HeightRequest="130"
            HorizontalOptions="Center"
            VerticalOptions="CenterAndExpand"/>
            
         <!-- Login Form -->
         <VerticalStackLayout
            Grid.Row="1"
            HorizontalOptions="CenterAndExpand">

            <Border
               BackgroundColor="{StaticResource Gray100}"
               Padding="3">
               <Border.StrokeShape>
                  <RoundRectangle CornerRadius="5,5,5,5" />
               </Border.StrokeShape>
               <Entry
                  Text="{Binding UserName}"
                  BackgroundColor="White"
                  Placeholder="Email Address"
                  WidthRequest="350"/>
            </Border>

            <Border
               BackgroundColor="{StaticResource Gray100}"
               Padding="3"
               Margin="0,10,0,0">
                  <Border.StrokeShape>
                     <RoundRectangle CornerRadius="5,5,5,5" />
                  </Border.StrokeShape>
                  <Entry
                     Text="{Binding Password}"
                     BackgroundColor="White"
                     Placeholder="Password"
                     WidthRequest="350"/>
               </Border>

               <Button
                  Text="SIGN IN"
                  TextColor="White"
                  BackgroundColor="{StaticResource Primary}"
                  FontAttributes="Bold"
                  CharacterSpacing="2"
                  Command="{Binding SubmitCommand}"
                  WidthRequest="350"
                  HorizontalOptions="CenterAndExpand"
                  VerticalOptions="CenterAndExpand"
                  Margin="0,20,0,0"/>

            <HorizontalStackLayout
               HorizontalOptions="CenterAndExpand"
               Margin="0,30,0,0">

                  <Border
                     BackgroundColor="Transparent"
                     Padding="5">
                     <Label
                        Text="New User Sign Up"
                        TextColor="White"
                        FontSize="12"/>
                  </Border>

                  <Border
                     BackgroundColor="Transparent"
                     Padding="5">
                     <Label
                        Text="|"
                        TextColor="White"
                        FontSize="12"
                        Margin="5,0,5,0"/>
                  </Border>

                  <Border
                     BackgroundColor="Transparent"
                     Padding="5">
                        <Label
                           Text="Forgot Password"
                           TextColor="White"
                           FontSize="12" />
                  </Border>

            </HorizontalStackLayout>

         </VerticalStackLayout>
            
   </Grid>
</ScrollView>

Answer 1

要解决此问题，您可以move up在键盘显示时使用登录表单，move down在隐藏键盘时使用登录表单。

要检测键盘显示/隐藏事件，您可以在Focused/UnfocusedEntry 事件中挂钩它。

最后一点是我们只需要它在iOS平台上做到这一点。

示例代码

在 Entry 上命名VerticalStackLayout并添加事件。

<VerticalStackLayout Grid.Row="1" HorizontalOptions="CenterAndExpand" x:Name="layout">

<Entry Text="{Binding UserName}" BackgroundColor="White" Placeholder="Email Address" WidthRequest="350" Focused="Entry_Focused" Unfocused="Entry_Unfocused"/>

处理后面代码中的逻辑

private void Entry_Focused(object sender, FocusEventArgs e)
{
    if (DeviceInfo.Current.Platform == DevicePlatform.iOS)
    {
        layout.TranslateTo(0, -200, 50);
    }
}

private void Entry_Unfocused(object sender, FocusEventArgs e)
{
    if (DeviceInfo.Current.Platform == DevicePlatform.iOS)
    {
        layout.TranslateTo(0, 0, 50);
    }
}