Comment puis-je ajouter une image d'arrière-plan pour la connexion FirebaseUI pour iOS ?

Question

J'aimerais pouvoir placer une image de fond derrière les trois boutons de connexion (pour Google, Facebook et Email) de l'écran de connexion FirebaseUI. FirebaseUI login est une solution d'authentification intégrée pour iOS, Android et le Web. J'ai des difficultés avec iOS.

Il y a un peu de conseils sur Github mais pas assez.

Je commence par initialiser mon var customAuthPickerViewController : FIRAuthPickerViewController! en haut du fichier ViewController.swift.

Ensuite, voici la fonction dans mon fichier ViewController.swift, mais cela ne fonctionne pas. Lorsque je clique sur le bouton de déconnexion, l'application se bloque, et aucune image d'arrière-plan n'est jamais affichée.

// Customize the sign-in screen to have the Bizzy Books icon/background image

func authPickerViewController(for authUI: FIRAuthUI) -> FIRAuthPickerViewController {

    customAuthPickerViewController = authPickerViewController(for: authUI)
    backgroundImage = UIImageView(image: UIImage(named: "bizzybooksbee"))
    backgroundImage.contentMode = UIViewContentMode.scaleAspectFill
    customAuthPickerViewController.view.addSubview(backgroundImage)

    return customAuthPickerViewController
}

L'image de fond "bizzybooksbee" est un jeu d'images universel avec des images 1x, 2x et 3x déjà chargées dans mon dossier Assets.xcassets.

Voici une image de ce à quoi ressemble l'écran de connexion sans essayer de mettre en œuvre l'image de fond.

MISE À JOUR : J'arrive à afficher l'image, avec le code que j'ai donné dans les commentaires ci-dessous, mais elle n'affiche JAMAIS les boutons de connexion, comme dans l'image ci-dessous.

Voici une image de la "hiérarchie", avec l'aide de Jeffrey :

Answer 1

Voici la solution !

Enlève les trucs qui ne marchent pas de ViewController.swift :

func authPickerViewController(for authUI: FIRAuthUI) -> FIRAuthPickerViewController {

    customAuthPickerViewController = authPickerViewController(for: authUI)
    backgroundImage = UIImageView(image: UIImage(named: "bizzybooksbee"))
    backgroundImage.contentMode = UIViewContentMode.scaleAspectFill
    customAuthPickerViewController.view.addSubview(backgroundImage)

    return customAuthPickerViewController   
}

Créez une "sous-classe" .swift de FIRAuthPickerViewController que vous pouvez nommer comme bon vous semble, et y ajouter votre image de fond/personnalisation :

import UIKit
import FirebaseAuthUI

class BizzyAuthViewController: FIRAuthPickerViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        // Do any additional setup after loading the view.

        let width = UIScreen.main.bounds.size.width
        let height = UIScreen.main.bounds.size.height

        let imageViewBackground = UIImageView(frame: CGRect(x: 0, y: 0, width: width, height: height))
        imageViewBackground.image = UIImage(named: "bizzybooksbee")

        // you can change the content mode:
        imageViewBackground.contentMode = UIViewContentMode.scaleAspectFill

        view.insertSubview(imageViewBackground, at: 0)
    }}

Dans votre ViewController.swift (ou quel que soit le nom que vous lui donnez), dans la section où vous vous connectez, changez authViewController pour qu'il corresponde à votre nouvelle sous-classe, ajoutez une ligne pour le contrôleur de navigation, et passez-la dans le fichier self.present :

let authViewController = BizzyAuthViewController(authUI: authUI!)

let navc = UINavigationController(rootViewController: authViewController)

self.present(navc, animated: true, completion: nil)

J'ai aussi fait un Tutoriel YouTube qui montre comment procéder de manière approfondie.