Saltar al contenido

El botón flotante (FAB) en React Native no permanecerá en la parte superior cuando se represente un componente Modal, iOS Actionsheet, selector

No olvides que en las ciencias informáticas un problema puede tener diferentes resoluciones, no obstante aquí mostramos lo más óptimo y eficiente.

Solución:

Desafortunadamente, esto no es posible. Los modales, las hojas de acciones y las alertas se representan en una nueva ventana con un nivel más alto y, por lo tanto, cubrirán todo. Tampoco puede insertar una ventana con un nivel superior que contenga su FAB, porque entonces los eventos táctiles no se reducirían a su vista normal. Más documentación sobre esto aquí.

Yo también diría que usted no debería tratar de lograr esto. Un selector de acción como en su captura de pantalla debería cubrir absolutamente ese botón de acción, y si está presentando un modal, siempre puede intentar agregar un nuevo FAB a eso.

DESCARGO DE RESPONSABILIDAD: Hacer esto seguramente hará que su aplicación sea rechazada de la tienda de aplicaciones, por lo que debe asegurarse de que solo aparezca en versiones beta e internas. Si necesita que Apple lo acepte, recomendaría implementar UIActionSheets y UIAlerts a través de React Native; hay muchas bibliotecas buenas que simulan modales.

Deberá hacer esto en el lado nativo. Puede agregar el siguiente código a su 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

Esto creará un botón que se podrá tocar sin importar qué modales se muestren:
Simulador de iOS con botón de depuración flotante.

Nos encantaría que puedieras difundir esta reseña si si solucionó tu problema.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *