Jetpack Compose Buttons for Google Pay and Google Wallet– Google for Developers Blog Site

Link copied to clipboard

Published by Stephen McDonald, Designer Programs Engineer

We just recently launched a brand-new Google Pay button view on Android which brings a series of brand-new functions, such as the current Product 3 style concepts, dark and light themed variations, and other brand-new modification abilities.

Image of the new Google Pay button view for Android

Figure 1: The brand-new Google Pay button view for Android can be personalized to make it more constant with your checkout experience.

Jetpack Compose Buttons

We have actually now made the brand-new Google Pay button offered to Jetpack Compose designers with a brand-new open source library compose-pay-button Jetpack Compose is Android’s modern-day toolkit for developing interface when utilizing the Kotlin language, and with this brand-new library you can carry out the Google Pay button in your Android apps with even less code than previously.

Let’s take a look at a fast example. Here you can see a normal Jetpack Compose UI, with the Google Pay button included. The button accepts a Jetpack Compose modifier for modification, and supports a range of labels, in this case “Reserve with Google Pay”.

 setContent {

 Column() {

 PayButton(.

onClick = { println(" Button clicked")},.

allowedPaymentMethods = "<< JSON serialized allowedPaymentMethods>>",.

modifier =  Modifier width( 300. dp),.

type =  ButtonType PAY_BOOK,.

).

}

}

Google Wallet

Finally, we have actually likewise launched a matching library for Google Wallet, compose-wallet-button The library offers a comparable API to the Google Pay button, however rather packages the exact same button properties offered on the Google Wallet designer website, consisting of both routine and condensed variations.

Figure 2: Both routine and condensed variations of the Google Wallet button are offered in the brand-new library.

All set to start? Take a look at the GitHub repositories for both compose-pay-button and compose-wallet-button where you can discover more about the libraries and how to include them to your Android apps!