One-Tap Sign in with Google

This library allow you to easily integrate One-Tap Sign in with Google(Credential Manager) to your project with Jetpack Compose. It hides all the boilerplate code away from you. You get an extracted Google User object that you can use to obtain a basic user information. And there's a new OneTapGoogleButton composable that you can use out of the box, with various customization options.

Download

Gradle

Add the dependency below to your module's build.gradle file:

dependencies {
    implementation("com.github.stevdza-san:OneTapCompose:1.0.12")
}

Add a repository in your settings.gradle file:

dependencyResolutionManagement {
    repositories {
        ...
        maven(url = "https://jitpack.io")
    }
}

Usage

Before you can use this library, you need to create a new project on a Google Cloud Platform. You need to create OAuth Client ID (ANDROID & WEB), because you will need that same Client ID (WEB), in order to implement One-Tap Sign in with Google.

After that, just call OneTapSignInWithGoogle() function, and pass that same information you've obtained through Google Cloud Platform. You will also pass OneTapSignInState, because that state is used later to trigger One-Tap dialog.

    val state = rememberOneTapSignInState()
    OneTapSignInWithGoogle(
        state = state,
        clientId = "YOUR_CLIENT_ID",
        onTokenIdReceived = { tokenId ->
            Log.d("LOG", tokenId)
        },
        onDialogDismissed = { message ->
            Log.d("LOG", message)
        }
    )

To trigger One-Tap dialog, just call open() function.

Button(onClick = { state.open() }) {
    Text(text = "Sign in")
}

Google User

And if you wish to extract a user information from a token id, that's now possible too! getUserFromTokenId() allows you to do exactly that. It returns a GoogleUser object, that contains lot's of different information related to that same user.

onTokenIdReceived = { tokenId ->
    Log.d("LOG", getUserFromTokenId(tokenId).toString())
}

Available GoogleUser information:

• Sub
• Email
• EmailVerified
• FullName
• GivenName
• FamilyName
• Picture
• IssuedAt
• ExpirationTime
• Locale

Sign in with Google Button

You can also use a drop-in opinionated button composable that works out of the box and encapsulates all the sign in logic and follows Google's Sign in with Google Branding Guidelines:

OneTapGoogleButton(
    clientId = "YOUR_CLIENT_ID"
)

According to the design guidelines, the button is available in 3 themes:

1. Dark
2. Light
3. Neutral

You can customise the theme using the theme parameter in the composable:

OneTapGoogleButton(
    clientId = "YOUR_CLIENT_ID",
    theme = GoogleButtonTheme.Neutral
)

The buttons are also available in icon-only mode for all the themes:

It can be activated using the iconOnly parameter in the composable:

OneTapGoogleButton(
    clientId = "YOUR_CLIENT_ID",
    iconOnly = true
)

Button API

Name	Type	Description
clientId	String	CLIENT ID (Web) of your project, that you can obtain from a Google Cloud Platform.
state	OneTapSignInState	One-Tap Sign in State. Can be used to detect whether the sign in operation has already been triggered.
rememberAccount	Boolean	Remember a selected account to sign in with, for an easier and quicker sign in process.
nonce	String?	Optional nonce that can be used when generating a Google Token ID
onTokenIdReceived	((String) -> Unit)?	Lambda that will be triggered after a successful authentication. Returns a Token ID.
onUserReceived	((String) -> Unit)?	This function returns a GoogleUser object using the received tokenId.
onDialogDismissed	((String) -> Unit)?	Lambda that will be triggered when One-Tap dialog disappears. Returns a message in a form of a string.
iconOnly	Boolean	Whether the button should only show the Google logo.
theme	GoogleButtonTheme	Sets the button style to either be Light, Dark, or Neutral which is in accordance with the official Google design guidelines.
colors	ButtonColors	ButtonColors that will be used to resolve the colors for this button in different states.
border	BorderStroke?	the border to draw around the container of this button
shape	Shape	defines the shape of this button's container, border (when border is not null)
onClick	(() -> Unit)?	called when this button is clicked

Release Build

If you are planning on publishing your app, be sure to generate a release SHA-1 fingerprint, and create a new oAuth credentials on your Google Cloud Platform project. Also when you upload your app on Play Console, you'll find there a section (Release > Setup > App signing) that will generate the release SHA-1 fingerprint. You take it and create another oAuth credential.

Troubleshoot

In some cases you may encounter "Google Account not Found." message inside onDialogDismiss lambda, even if you have already connected a Google account on your Android Emulator. Android emulators are prone to that issues (Not sure why and when that's gonna get fixed). My suggestion in that case is to try and add a Google account on some other Android Emulator. If that doesn't work either, then use a real device instead.

It's important to implement your own rate limiting of One Tap sign-in prompts. If you don't, and a user cancels several prompts in a row, the One Tap client will not prompt the user for the next 24 hours.

Also to debug your app better, check the logs and search for a OneTapCompose tag, it might contain additional information to help you out with your issue.

Like what you see? 💛

⭐ Give a star to this repository.
☕ Buy me a coffee: https://ko-fi.com/stevdza_san

License

Designed and developed by 2022 stevdza-san (Stefan Jovanović)

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.