In our previous article, we covered how to setup the Braintree client-side integration to support Apple Pay and Google Pay payments. Today will be extending that sample to support Paypal payments in Xamarin Forms.
- Part 1. General Setup/Pay with Credit Cards
- Part 2. Pay with Apple Pay/Google Pay
- Part 3. Pay with Paypal
- Part 4. Drop-UI
Before starting
We need to do some initial setup in Braintree control panel by following Braintree PayPal setup guide.
Let’s code
In the Forms project, we added a new method to the IPayService interface called TokenizePayPal, that will handle the PayPal tokenization.
Xamarin iOS project
Add the package Naxam.BraintreePayPal.iOS
In the Info.plist file, we need to add an URL Scheme that will handle workflows that involve switching to another app or SFSafariViewController.
The format should be <bundle identifier> + .payments. For example, if bundle identifier is com.crossgeeks.sample then it will be com.crossgeeks.sample.payments.
You can find more information check here.
In the AppDelegate set the url scheme you added in the Info.plist to the BTAppSwitch.SetReturnURLScheme method and also add the redirect methods.
Implement the TokenizePayPal method added to the IPayService in the iOSPayService. Also provide implementation for delegates: BTSwitchDelegate and BTViewControllerPresenter which will handle the PayPal interactions.
Xamarin Android project
In the AndroidManifest.xaml file add the BraintreeBrowserSwitchActivity.
Implement the TokenizePayPal method added to the IPayService in the AndroidPayService by calling PayPal.AuthorizeAccount(mBraintreeFragment).
Xamarin Forms project
In the PaymentPageViewModel we call the TokenizePayPal method to process Paypal payment option.
In the XAML view add the PayPal payment option.
Let’s test
For the sake of this demo, I’m just displaying the tokenization result once you tap on pay but when getting the event OnTokenizationSuccessful is where you should call your backend endpoint to process the payment.
Now that we are ready, the result should be the following.
The app is showing a sandbox UI. If you change your app to production then the UI will request to enter the PayPal credentials.
Make sure to check out part 4 of this series about Drop-UI integration (coming soon).
Check full source code here.
References
- https://developers.braintreepayments.com/guides/paypal/server-side/dotnet
- https://github.com/NAXAM/braintree-android-binding
- https://github.com/NAXAM/braintree-ios-binding
- https://developers.braintreepayments.com/guides/paypal/client-side/android/v3
- https://developers.braintreepayments.com/guides/paypal/client-side/ios/v4
- https://developers.braintreepayments.com/guides/paypal/testing-go-live/dotnet
Happy Braintree integration!
3 Comments
Thank you for that great series of this amazing payment integration.
I’m implementing Xamarin App into the payment method should look the same like eBay.
That means Seller should add their PayPal account for receive payment from Buyer and Buyer can or will send money directly to Seller through the App of cause.
Between this transaction an commission should be collected.
I found something like PayPal Adaptive Payments, is that the payment method that uses eBay?
someone can help me, with link, any ideas?
thank you again.
Great job!
Is the Drop-in UI article coming soon?
Yes, this week hopefully
Comments are closed.