渲染Modal，iOS Actionsheet选择器组件时，React Native上的浮动按钮（FAB）不会停留在顶部

Question

在较高级别的组件中使用绝对定位的按钮将在正常使用情况下发挥作用，但是当呈现模式/动作表/选择器等时，该按钮将不再位于顶部。

Answer 1

不幸的是，这是不可能的。模式，操作表和警报将在更高级别的新窗口中呈现，因此它们将覆盖所有内容。您也不能插入包含FAB的更高级别的窗口，因为那样的话触摸事件并不会使其变为常规视图。这方面的更多文档在这里。

我还要指出，您不应该尝试做到这一点。屏幕快照中的动作选择器应完全覆盖该动作按钮，如果要显示模式，则可以始终尝试向其添加新的FAB。

Answer 2

免责声明：这样做几乎肯定会导致您的应用被应用商店拒绝，因此您应该确保它仅在Beta和内部版本中显示。如果您需要Apple接受它，我建议您通过React Native实现UIActionSheets和UIAlerts。有很多很好的库可以模拟模态。

您需要在本机端执行此操作。您可以将以下代码添加到您的AppDelegate中：

var debugWindow: UIWindow?

@objc func pressButton(_ sender: UIButton) {
    print("Do debugging here")
}

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
    let screenSize = UIScreen.main.bounds

    let buttonController = UIViewController()
    let button = UIButton(frame: CGRect(x: 0, y: 0, width: 50, height: 50))
    button.setTitle("+", for: .normal)
    button.backgroundColor = UIColor.blue
    button.addTarget(self, action: #selector(pressButton(_:)), for: .touchUpInside)
    button.layer.cornerRadius = 25
    button.layer.masksToBounds = true
    buttonController.view = button

    debugWindow = UIWindow.init(frame: CGRect(x: screenSize.width - 100, y: screenSize.height - 100, width: 50, height: 50))
    debugWindow!.rootViewController = buttonController
    debugWindow!.windowLevel = UIWindow.Level.alert + 1000;
    debugWindow!.makeKeyAndVisible()

    return true
}

这将创建一个按钮，无论显示什么模态，该按钮都可以点击：