Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Integrating Google pay buttons and Apple pay buttons into react-native application

Tags:

I have been searching everywhere on how to integrate the native assets provided by Apple (PkPaymentButton) and Google Pay ( https://developers.google.com/pay/api/web/guides/brand-guidelines#payment-buttons ) without having to write my own native modules.

I found out that these two were included in the react-native-GPay library, and in the react-native-payment libraries(interface for PKPaymentButton). Problem is, i am already using another library handling Apple pay and Google pay (tipsi-stripe) which doesn't provide the interface for the native buttons, and i don't want to include these two libraries just to use their native buttons implementation.

I also want to respect the apple/google brand design guidelines. They are very specific : - Don't create your own Google Pay buttons or alter the font, color, button radius, or padding within the button in any way. - Don't create your own Apple Pay button design or attempt to mimic the system-provided button designs.

Everywhere i look, it seems like people providing tutorial on how to implement googlepay/apple pay inside react-native apps don't care about the branding guidelines (they use simple TouchableOpacity with some text inside, triggering the payment interfaces) And i couldn't find any react-native modules that only implements the buttons UI

Maybe i am missing something quite obvious (it is my first implementation of these features), but is there any react-native modules that only provide interface for native button assets , without implementing the whole payment libraries ? Would it be usefull to create a react-native module that does just that ?

like image 206
tip Avatar asked Oct 04 '19 15:10

tip


People also ask

Can you use Google pay like Apple Pay?

Like Apple Pay, Google Pay also allows users to upload credit, debit, prepaid, and loyalty cards. When making an in-store purchase, users simply need to unlock their phones and hold them near the contactless payment reader. There is no need to open the Google Pay app.


1 Answers

I'm a kind of in the same situation, except that I'm not using GPay from tipsi-stripe in my project, I'm just using it for Apple Pay on iOS. And if it can help you, here's the repo that I just recently published which exposes native Apple Pay button to React Native: Apple Pay button for RN

Regarding Android, I didn't include it since I'm not familiar with native Android. I hope someone will add it as well, or tipsi-will stripe will include it.

like image 163
bra.Scene Avatar answered Oct 06 '22 01:10

bra.Scene