MAUI iOS：UIImagePickerController.CameraOverlayView按钮仅竖屏可响应

问题核心原因 #

横屏模式下底部按钮可见但无法点击，闪光灯按钮正常工作，本质是UI层级与坐标系错位：

• 注释掉了overlay的旋转逻辑，导致overlay未跟随设备旋转，按钮实际可点击区域与视觉位置不匹配
• 横屏时按钮坐标计算依赖屏幕Bounds，但未同步更新overlay的变换，点击事件无法命中按钮
• 未监听设备旋转事件，无法动态调整UI适配当前方向

修复步骤 #

1. 恢复overlay旋转并适配坐标系 #

取消GetXYPositions中的旋转注释，让overlay跟随设备旋转，确保按钮点击区域与视觉位置对齐：

2. 监听设备旋转事件 #

添加旋转通知监听，实时更新按钮位置与overlay变换：

3. 修正按钮坐标计算逻辑 #

横屏时屏幕Bounds的宽高会交换，需基于当前方向重新计算按钮位置，并调整overlay Frame避免偏移。

修改后的关键代码片段 #

构造函数中添加旋转监听

public CustomCameraOverlayView(double max, double min, AudioPlayer audioPlayer, UIImagePickerController picker, EventHandler cancelAction) : base(picker.CameraOverlayView.Frame)
{
    maximumTime = max;
    minimumTime = min;
    countdownValue = int.Parse($"{min}");
    this.audioPlayer = audioPlayer;
    this.picker = picker;
    overlay = new();
    overlay.Frame = picker.CameraOverlayView.Frame;
    this.cancelAction = cancelAction;

    // 原有去除黑边代码...

    buttonWidth = 60;
    buttonHeight = 60;
    GetXYPositions();
    Initialize();
    picker.CameraOverlayView = overlay;

    // 添加设备旋转通知监听
    UIDevice.Notifications.ObserveOrientationDidChange(HandleOrientationChange);
}

处理旋转事件的方法

private void HandleOrientationChange(object sender, NSNotificationEventArgs e)
{
    GetXYPositions();
    UpdateButtonFrames();
}

修正坐标计算与旋转逻辑

void GetXYPositions()
{
    var currentOrientation = DeviceDisplay.Current.MainDisplayInfo.Orientation;
    if (currentOrientation == DisplayOrientation.Portrait)
    {
        buttonX = (UIScreen.MainScreen.Bounds.Width - buttonWidth) / 2;
        buttonY = UIScreen.MainScreen.Bounds.Height - buttonHeight - 50;
        // 竖屏重置旋转
        overlay.Transform = CGAffineTransform.Identity;
    }
    else
    {
        var screenHeight = UIScreen.MainScreen.Bounds.Height;
        var screenWidth = UIScreen.MainScreen.Bounds.Width;
        buttonX = (screenHeight - buttonWidth) / 2;
        buttonY = screenWidth - buttonHeight - 50;
        // 向右横屏旋转（支持向左横屏需调整为-Math.PI/2）
        overlay.Transform = CGAffineTransform.MakeRotation((nfloat)Math.PI / 2);
        // 旋转后重新设置Frame，避免偏移
        overlay.Frame = picker.CameraOverlayView.Frame;
    }
}

动态更新按钮Frame

void UpdateButtonFrames()
{
    cancelButton.Frame = new CGRect(buttonX / 3, buttonY + 7, buttonWidth - 15, buttonHeight - 15);
    captureButton.Frame = new CGRect(buttonX, buttonY, buttonWidth, buttonHeight);
    
    if (playAudioButton != null)
    {
        playAudioButton.Frame = new CGRect((buttonX / 3) * 5 + 10, buttonY + 7, buttonWidth - 15, buttonHeight - 15);
    }
    
    var flashButtonY = 20;
    flashButton.Frame = new CGRect(buttonX / 6, flashButtonY, buttonWidth - 15, buttonHeight - 15);
}

调试辅助技巧 #

可以给按钮添加半透明背景色，直观确认点击区域位置：

// 调试用，上线前移除
cancelButton.BackgroundColor = UIColor.Red.ColorWithAlpha(0.3f);
captureButton.BackgroundColor = UIColor.Green.ColorWithAlpha(0.3f);

内容的提问来源于stack exchange，提问作者V. Braz