Jetpack Compose Buttons for Google Pay and Google Pockets — Google for Builders Weblog

[ad_1]

Hyperlink copied to clipboard

Posted by Stephen McDonald, Developer Applications Engineer

We just lately launched a new Google Pay button view on Android which brings a spread of latest options, akin to the most recent Materials 3 design ideas, darkish and lightweight themed variations, and different new customization capabilities.

Image of the new Google Pay button view for Android

Determine 1: The brand new Google Pay button view for Android might be personalized to make it extra constant together with your checkout expertise.

Jetpack Compose Buttons

We have now made the brand new Google Pay button obtainable to Jetpack Compose builders with a brand new open supply library compose-pay-button. Jetpack Compose is Android’s trendy toolkit for constructing consumer interfaces when utilizing the Kotlin language, and with this new library you may implement the Google Pay button in your Android apps with even much less code than earlier than.

Let us take a look at a fast instance. Right here you may see a typical Jetpack Compose UI, with the Google Pay button added. The button accepts a Jetpack Compose modifier for personalisation, and helps quite a lot of labels, on this case “Ebook with Google Pay”.

setContent {

    Column() {

        PayButton(

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

            allowedPaymentMethods = "<JSON serialized allowedPaymentMethods>",

            modifier = Modifier.width(300.dp),

            sort = ButtonType.PAY_BOOK,

        )

    }

}

Google Pockets

Lastly, we have additionally launched a corresponding library for Google Pockets, compose-wallet-button. The library gives an analogous API to the Google Pay button, however as a substitute bundles the identical button property obtainable on the Google Pockets developer website, together with each common and condensed variations.

Image of the regular (left) and condensed (right) versions of the Google Wallet button

Determine 2: Each common and condensed variations of the Google Pockets button can be found within the new library.

Able to get began? Try the GitHub repositories for each compose-pay-button and compose-wallet-button the place you may be taught extra in regards to the libraries and add them to your Android apps!

[ad_2]

Jetpack Compose Buttons

Google Pockets

Leave a Comment