Auth0 Home Blog Docs

Auth0 Lock appearance customization in Swift


#1

Hey there,

I’m using Auth0 Lock widget for Swift, although I do have a couple of questions I’m struggling to find answers for in the docs. Here’s the current state of my view:

As you can see, the requirement is that I don’t use login/password authentication. My application can be reached out only via social media service providers, in this case Facebook, Linkedin and Google.

There are couple of issues I’d like address when it comes to customisation of the screen:

  • Can I somehow move the login buttons to the bottoms, so these are not placed directly below the header? I know it’s possible when DB authentication is turned on, but I feel like I can’t find a way to make it work without it.
  • Can I remove the header completely, or, at least make it fully transparent?
  • Can I somehow influence how the Lock widget is presented, more specifically the modal view transition? Changing the property .modalTransitionStyle on Lock’s instance controller property doesn’t seem to help a lot.
  • Can I somehow influence the appearance of Social Media buttons by changing their fonts?

#3

Hey there @strg!

Glad that you got interested in using our iOS stack! When it comes to customization of lock appearance using Swift you’ll need to follow those docs:

It’s an ultimate list of options to customise your Lock appearance.

Editing your header style is definitely doable via: https://auth0.com/docs/libraries/lock-ios/v2/customization#headercolor. I believe you won’t be able to change the font of social media buttons. Need to make sure about the two other. Will circle back once I know it for sure.

Thanks!


#4

Looking at Lock Swift repo

You can explore the full range of styling options in Style.swift

I think that playing with:

.withStyle {
  $0.modalPopup = false
}

and

.withConnections { connections in
    connections.social(name: "facebook", style: .Facebook)
    connections.social(name: "google-oauth2", style: .Google)
}

may potentially give you what you want in terms of your 3rd and 4th question.

Thanks!


#5

Hey there @strg!

Have you had a chance to go through the info I provided? Did you find it helpful for your scenario?