swift - 如何在 Swift 中自定义 Firebase 身份验证 UI
问题描述
我正在使用 Firebase 预构建 UI 构建身份验证系统,并且我想自定义 UI 以适应程序。假设我想将背景颜色设置为黑色并更改按钮的角半径,有什么办法可以做到吗?我尝试过对它进行子分类,authPickerViewController
但不知何故它不起作用。我做了一些搜索,但也找不到与此相关的任何教程或最近的问题。
这是我在 MainViewController 中的内容
class LoginViewController: UIViewController, FUIAuthDelegate{
override func viewDidLoad() {
super.viewDidLoad()
let authUI = FUIAuth.defaultAuthUI()
authUI?.delegate = self
let providers: [FUIAuthProvider] = [
FUIEmailAuth(),
FUIGoogleAuth(),
FUIPhoneAuth(authUI:FUIAuth.defaultAuthUI()!)]
authUI?.providers = providers
let authViewController = authUI?.authViewController()
authViewController!.modalPresentationStyle = .fullScreen
authViewController!.setNavigationBarHidden(true, animated: false)
self.present(authViewController!, animated: false, completion: nil)
}
func application(_ app: UIApplication, open url: URL,
options: [UIApplicationOpenURLOptionsKey : Any]) -> Bool {
let sourceApplication = options[UIApplicationOpenURLOptionsKey.sourceApplication]
if FUIAuth.defaultAuthUI()?.handleOpen(url, sourceApplication: sourceApplication as? String) ?? false {
return true
}
return false
}
}
这是我创建的子类:
class FUICustomAuthPickerViewController: FUIAuthPickerViewController,FUIAuthDelegate {
override func viewDidLoad() {
super.viewDidLoad()
self.view.backgroundColor = .black
}
func authPickerViewController(forAuthUI authUI: FUIAuth) -> FUIAuthPickerViewController {
return FUICustomAuthPickerViewController(nibName: "FUICustomAuthPickerViewController",
bundle: Bundle.main,
authUI: authUI)
}
}
在Firebase 自定义文档中,他们说:
您可以通过继承 FirebaseUI 的视图控制器并在 FUIAuth 的委托方法中指定它们来自定义登录屏幕。
我是初学者,我该怎么做?
编辑:
因此,按照此链接上的说明,我设法通过为FUIAuthDelegate
.
extension LoginViewController:FUIAuthDelegate {
func application(_ app: UIApplication, open url: URL,
options: [UIApplicationOpenURLOptionsKey : Any]) -> Bool {
let sourceApplication = options[UIApplicationOpenURLOptionsKey.sourceApplication]
if FUIAuth.defaultAuthUI()?.handleOpen(url, sourceApplication: sourceApplication as? String) ?? false {
return true
}
return false
}
func authPickerViewController(forAuthUI authUI: FUIAuth) -> FUIAuthPickerViewController {
let vc = FUIAuthPickerViewController(authUI: authUI)
let view = UIView(frame: .zero)
view.backgroundColor = .black
view.translatesAutoresizingMaskIntoConstraints = false
vc.view.addSubview(view)
NSLayoutConstraint.activate([
view.heightAnchor.constraint(equalTo: vc.view.heightAnchor, multiplier: 1),
view.widthAnchor.constraint(equalTo: vc.view.widthAnchor, multiplier: 1)])
return vc
}
}
事实证明,不一定需要子类。但是,我似乎无法将我创建的这个视图作为背景,它要么覆盖所有内容,要么根本不覆盖任何内容。我尝试直接更改视图的背景颜色,但没有奏效。任何人都知道如何做到这一点?
解决方案
使用此链接中提供的方法和评论之一解决了问题。事实证明,除了子类化之外,您还必须将以下两种方法添加到您的子类中才能使其工作。
override init(nibName nibNameOrNil: String?, bundle nibBundleOrNil: Bundle?, authUI: FUIAuth?) {
super.init(nibName: nil, bundle: Bundle.main, authUI: authUI!)
}
required init?(coder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
但是,我使用的方法(不确定其他方法是否会引发同样的问题)也导致了另一个问题 - 电子邮件登录按钮停止响应 - 在此链接中通过向视图控制器显示 a来解决这个问题,navigationViewController
因为电子邮件登录按钮与导航栏一起使用,一旦你用navigationViewController
.
现在完整的子类如下所示:
import UIKit
import FirebaseUI
class FUICustomAuthPickerViewController: FUIAuthPickerViewController {
override init(nibName nibNameOrNil: String?, bundle nibBundleOrNil: Bundle?, authUI: FUIAuth?) {
super.init(nibName: nil, bundle: Bundle.main, authUI: authUI!)
}
required init?(coder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func viewDidLoad() {
super.viewDidLoad()
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.backgroundColor = .eatstrOrange
view.insertSubview(imageViewBackground, at: 0)
}
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
navigationController?.setNavigationBarHidden(true, animated: animated)
}
override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
navigationController?.setNavigationBarHidden(false, animated: animated)
}
}
这是主视图控制器:
import UIKit
import FirebaseUI
class LoginViewController: UIViewController{
override func viewDidLoad() {
super.viewDidLoad()
let authUI = FUIAuth.defaultAuthUI()
let delegate = authUI?.delegate
authUI?.delegate = delegate
let providers: [FUIAuthProvider] = [
FUIGoogleAuth(),
FUIEmailAuth(),
FUIPhoneAuth(authUI:FUIAuth.defaultAuthUI()!)]
authUI?.providers = providers
let authViewController = FUICustomAuthPickerViewController(authUI: authUI!)
authViewController.modalPresentationStyle = .fullScreen
navigationController?.pushViewController(authViewController, animated: false)
}
}
推荐阅读
- python - Matplotlib 条形图:增加条形之间的间距
- java - 在 maven java 应用程序中使用 xero API 时,如何从 Asset 中检索 AssetType?
- python - 如何从 NumPy 数组中的单行获取用户输入?
- javascript - Javascript lodash 根据值过滤数组中的对象
- spring-boot - Spring Batch 与 Web 应用程序的集成
- python - 跨时间窗口中的调度操作
- hibernate - org.infinispan.commons.CacheException:未知命令 id 121
- html - 无法绑定到“数据介绍”,因为它不是“按钮”的已知属性
- typescript - Nest.JS graphql 获取请求的字段
- ubuntu - GitLab Runner:在没有外壳的情况下切换用户后在服务器上执行代码