You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

.NET MAUI键盘唤起导致页面整体上移问题求助

.NET MAUI 键盘唤起时页面上移问题解决方案

一、关闭页面上移行为

该行为是平台默认的布局适配逻辑,需针对iOS和Android分别处理:

iOS平台

在页面的.xaml.cs文件中添加平台特定代码,禁用系统自动滚动:

protected override void OnAppearing()
{
    base.OnAppearing();
#if IOS
    this.On<iOS>().SetEnableAutoScroll(false);
#endif
}

此设置会阻止iOS自动调整页面内容以适配键盘。

Android平台

修改Android项目中的AndroidManifest.xml,调整Activity的软键盘适配模式:
找到MainActivity节点,将android:windowSoftInputMode设置为adjustNothing:

<activity android:name=".MainActivity"
          android:windowSoftInputMode="adjustNothing">
</activity>

adjustNothing表示系统不会改变页面布局,保持页面原位置不变。若出现输入框被键盘遮挡的情况,可结合后续变通方案处理。

二、变通方案(避免输入框遮挡)

完全禁止页面上移后,若输入框被键盘遮挡,可采用以下两种方式处理:

1. 手动控制ScrollView滚动

监听键盘弹出事件,将ScrollView滚动至输入框所在位置:

// 假设ScrollView的x:Name为MainScrollView
var scrollView = FindByName<ScrollView>("MainScrollView");
var inputEditor = FindByName<Editor>("EntryElement");

// 计算滚动位置,确保输入框可见
var targetPosition = inputEditor.Y - keyboardHeight + inputEditor.Height;
scrollView.ScrollToAsync(0, targetPosition, true);

2. 动态调整底部控件位置

将底部Editor所在的Border放入可动态修改Margin的容器,键盘弹出时调整底部Margin:

var inputBorder = FindByName<Border>("InputBorder");
inputBorder.Margin = new Thickness(10, 0, 10, keyboardHeight);

三、获取键盘高度及属性

MAUI无跨平台键盘API,需通过平台特定代码实现:

iOS平台

监听系统键盘通知获取高度:

#if IOS
using UIKit;
using Foundation;

public void SubscribeKeyboardEvents()
{
    NSNotificationCenter.DefaultCenter.AddObserver(UIKeyboard.WillShowNotification, OnKeyboardShow);
    NSNotificationCenter.DefaultCenter.AddObserver(UIKeyboard.WillHideNotification, OnKeyboardHide);
}

private void OnKeyboardShow(NSNotification notification)
{
    var keyboardFrame = UIKeyboard.FrameEndFromNotification(notification);
    double height = keyboardFrame.Height;
    // 通过MessagingCenter传递高度到共享代码
    MessagingCenter.Send(this, "KeyboardHeightUpdated", height);
}

private void OnKeyboardHide(NSNotification notification)
{
    MessagingCenter.Send(this, "KeyboardHeightUpdated", 0);
}
#endif

Android平台

通过布局监听获取键盘高度:

#if ANDROID
using Android.Views;
using Android.Content;

public void SubscribeKeyboardEvents()
{
    var rootView = Platform.CurrentActivity.Window.DecorView.RootView;
    rootView.ViewTreeObserver.GlobalLayout += OnLayoutChanged;
}

private void OnLayoutChanged(object sender, EventArgs e)
{
    var activity = Platform.CurrentActivity;
    Rect displayFrame = new Rect();
    activity.Window.DecorView.GetWindowVisibleDisplayFrame(displayFrame);
    int screenHeight = activity.Window.DecorView.RootView.Height;
    int keyboardHeight = screenHeight - displayFrame.Bottom;
    
    bool isVisible = keyboardHeight > screenHeight * 0.15; // 用阈值判断键盘是否显示
    double height = isVisible ? keyboardHeight : 0;
    MessagingCenter.Send(this, "KeyboardHeightUpdated", height);
}
#endif

在共享代码中订阅事件接收高度:

MessagingCenter.Subscribe<YourPageType>(this, "KeyboardHeightUpdated", (sender, height) =>
{
    // 处理键盘高度变化逻辑
});

附:你的XAML代码

<Grid>
    <ScrollView Grid.Row="1">
        <VerticalStackLayout>
            <Rectangle HeightRequest="200" BackgroundColor="Red" Margin="10"/>
            <Rectangle HeightRequest="200" BackgroundColor="Red" Margin="10"/>
            <Rectangle HeightRequest="200" BackgroundColor="Red" Margin="10"/>
            <Rectangle HeightRequest="200" BackgroundColor="Red" Margin="10"/>
        </VerticalStackLayout>
    </ScrollView>

    <Border Grid.Row="2"
            HeightRequest="45" Stroke="Transparent" StrokeShape="RoundRectangle 20"
            StrokeThickness="0" Margin="10,0,10,0" VerticalOptions="End">
        <Grid 
                BackgroundColor="#606060" ColumnDefinitions="*,auto">
            <Editor
                    x:Name="EntryElement" Grid.Column="0" Placeholder="Search" 
                    Margin="10,0" IsSpellCheckEnabled="False" IsTextPredictionEnabled="False"
                    TextColor="White">
                <Editor.Behaviors>
                    <toolkit:EventToCommandBehavior Command="{Binding EntryTextChangedCommand}" EventName="TextChanged"/>
                </Editor.Behaviors>
            </Editor>
        </Grid>
    </Border>

    <view:Header_details/>
</Grid>

内容的提问来源于stack exchange,提问作者siflJebatkundy

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.23 10:55:04