Índice

Objetivo

O fluxo de login integrado no SDK serve para facilitar a construção de aplicativos na plataforma fluig, provendo um meio de efetuar login sem explicitamente programar todas as etapas necessárias.

Integração

Para integrar o login no seu aplicativo, siga os seguintes passos:

1. Certifique-se que o fluigSDKFlows.framework do SDK foi adicionado como dependência no seu projeto.
2. Altere o fluxo do aplicativo para o login, seguindo os passos abaixo.

   1. Na AppDelegate do seu projeto, chame o método startAsRoot da classe LoginFlow. Para instanciar LoginFlow, passe uma instância de LoginFlowConfiguration como único parâmetro. A classe LoginFlowConfiguration é responsável principalmente pela personalização do fluxo de login. Todos os parâmetros de LoginFlowConfiguration são opcionais. Um dos parâmetros possíveis é onSuccessReplaceRootWith que é um UIViewController para o qual deseja que o login redirecione após sua conclusão. Ao terminar o fluxo, caso esse parâmetro não tenha sido fornecido, será enviado uma Notification informando que o usuário conseguiu se logar com sucesso.
      
      

      AppDelegate.swift

      import UIKit
      import fluigSDKFlows
      
      @UIApplicationMain
      class AppDelegate: UIResponder, UIApplicationDelegate {
      
          var window: UIWindow?
      
          func application(_ application: UIApplication, 
                           didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
      
              let viewController = MyAppViewController()
      
              window = UIWindow(frame: UIScreen.main.bounds)
              window?.makeKeyAndVisible()
              window?.rootViewController = viewController
      
              let configuration = LoginFlowConfiguration(onSuccessReplaceRootWith: viewController)
      
              LoginFlow(configuration: configuration).startAsRoot(window: window!)
      
              return true
          }
      }

      
      

      1. No caso de não informar a tela desejada como parâmetro no LoginFlowConfiguration, é recomendado que implemente no seu UIViewController o receptor da Notification enviada pelo fluxo de login.
         
         

         MyAppViewController.swift

         import UIKit
         import fluigSDKFlows
         
         
         class MyAppViewController: UIViewController {
         
         
             override func viewDidLoad() {
                 super.viewDidLoad()
         
         
                 ...
         
         
                 NotificationCenter.default.addObserver(self,
                                                        selector: #selector(onLoginFlowEnd),
                                                        name: Notification.Name.fluigSdkDidLogin,
                                                        object: nil)
             }
         
         
             @objc func onLoginFlowEnd() {
                 present(LoggedViewController(), animated: true)
             }
         }

MFA

Durante o fluxo de login, é possível que o usuário seja apresentado a uma tela de token de MFA, caso o servidor tenha essa configuração habilitada. Neste caso, será apresentado um botão para abrir o aplicativo relacionado a geração do token.

Para que este botão funcione corretamente, altere o arquivo property list do seu projeto (geralmente denominado Info.plist) e adicione um Array de chave LSApplicationQueriesSchemes com um item do tipo String com o valor safeid.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    ...
	<key>LSApplicationQueriesSchemes</key>
	<array>
		<string>safeid</string>
	</array>
</dict>
</plist>

Caso esteja mais familiarizado com o editor padrão de property lists do Xcode, confira abaixo o mesmo exemplo de Info.plist.

Personalizações

Na seção Integração, é possível notar a presença de uma classe responsável por diversas personalizações do fluxo de login denominada LoginFlowConfiguration. Esta seção expõe que elementos são esses e como alterá-los para aderir às suas preferências.

• Fundo das telas
• Logo da empresa
• Conteúdo do page controller
• Cores dos principais botões

Fundo das telas

O fundo das telas do login foi feito com o componente FluigSDKMediaView. Este componente permite utilizar: vídeo, imagem, uma cor sólida ou um gradiente horizontal de duas cores.

Siga as instruções abaixo para utilizar o fundo desejado.

Vídeo

Atribua ao parâmetro background o valor LoginFlowBackground.video(myVideo) no construtor da classe LoginFlowConfiguration. O tipo da variável myVideo é URL.

Imagem

Atribua ao parâmetro background o valor LoginFlowBackground.image(myImage) no construtor da classe LoginFlowConfiguration. O tipo da variável myImage é UIImage.

Cor de fundo

Atribua ao parâmetro background o valor LoginFlowBackground.gradient(myGradient) no construtor da classe LoginFlowConfiguration. O tipo da variável myGradient é Gradient que é uma tupla: (firstColor: UIColor, lastColor: UIColor). Caso os valores firstColor e lastColor sejam iguais, o fundo terá apenas uma cor. Caso contrário, será produzido um gradiente horizontal de duas cores.

import fluigSDKFlows

let configuration = LoginFlowConfiguration(background: .gradient(.blue, UIColor(red: 213.0/255.0,
                                                                                green: 40.0/255.0, 
                                                                                blue: 121.0/255.0, 
                                                                                alpha: 1.0)) 

Logo da empresa

No topo de cada tela do fluxo há o logo da empresa. Por padrão, o logo mostrado é do fluig. Para alterar o logo, atribua ao parâmetro logoImage a UIImage desejada no construtor da classe LoginFlowConfiguration.

Conteúdo do page controller

Na primeira tela do fluxo, existe um UIScrollView paginado cujo conteúdo pode ser alterado. Para personalizar este elemento, no construtor da classe LoginFlowConfiguration atribua aos parâmetros emailRequestPageTitle (do tipo String) e emailRequestPageTips (do tipo [String]) os valores desejados.

import fluigSDKFlows

let configuration = LoginFlowConfiguration(emailRequestPageTitle: "Example Title",
                                           emailRequestPageTips: ["This is an example of a page content.",
                                                                  "This is the second page and will only show if the user scrolls."])

Cores dos principais botões

É possível personalizar este fluxo instanciando um objeto da classe LoginFlowConfiguration.

/// - parameters:
    ///     - logoImage: The image to be used as a logo on login screens.
    ///     - backgroundVideoUrl: The url of the video to be used as the background on login screens.
    ///This takes precedence over `backgroundImageUrl`
    ///     - backgroundImage: The image to be userd as background on login screens.
    ///     - gradiendStartColor: The color to be used on login screens background.
    ///     - gradiendEndColor: Composes with `gradientStartColor` to form a gradient to be used on login
    ///screens background.
    ///     - emailRequestPageTips: If informed show a pager with tips to be shown on email request login screen
    ///     passwordRequestPageTips:  If informed show a pager with tips to be shown on password request login screen
    ///     - onSuccessReplaceRootWith: If informed is used to replace the application root ViewController
    ///on successfull login, otherwise a notification is sent via NotificationCenter.
    public init(logoImage: UIImage? = nil,
                backgroundVideoUrl: URL? = nil,
                backgroundImage: UIImage? = nil,
                gradientStartColor: UIColor = UIColor.fluigSdk.pink,
                gradientEndColor: UIColor = UIColor.fluigSdk.lightOrange,
                emailRequestPageTips: [String] = [],
                passwordRequestPageTips: [String] = [],
                onSuccessReplaceRootWith: UIViewController? = nil) {
        self.logoImage = logoImage
        self.backgroundVideoUrl = backgroundVideoUrl
        self.backgroundImage = backgroundImage
        self.gradientStartColor = gradientStartColor
        self.gradientEndColor = gradientEndColor
        self.emailRequestPageTips = emailRequestPageTips
        self.passwordRequestPageTips = passwordRequestPageTips
        self.onSuccessReplaceRootWith = onSuccessReplaceRootWith
    }

Safe ID

Para o botão Abrir Safe ID funcionar corretamente no arquivo *.plist do seu aplicativo adicione um array com a chave LSApplicationQueriesSchemes e um item do tipo String com o valor safeid.