Provides a button that is used either to trigger payments through Apple Pay or to prompt the user to set up a card.
ApplePayButton
uses native API provided by Apple. Due to this fact, button meets User Interface guidelines required by Apple in review process. Make sure you consult Human Interface Guidelines prior to submitting app to App Store.
Type dictates button's call to action word and a message. Each option includes the Apple Pay logo alone and the call to action word (based on button type) with message along with the logo. The API will provide a localization of the action word with message based on the user’s language settings. Do not create your own localized payment button.
In addition to button's type, you can set button's visual appearance. For iOS and web, button artwork is provided in black, white, and white with an outline rule.
Prop Name | Required | Type | Default Value |
---|---|---|---|
type | yes | ButtonType | |
style | yes | ButtonStyle | |
onPress | yes | Function | |
width | no | number | |
height | no | number | |
cornerRadius | no | number | 4 |
minWidth | no | number | 100 |
minHeight | no | number | 30 |
maxWidth | no | number | |
maxHeight | no | number |
type ButtonType =
// A button with the Apple Pay logo only.
| 'plain'
// A button with the text “Buy with” and the Apple Pay logo.
| 'buy'
// A button with the text “Set up” and the Apple Pay logo.
| 'setUp'
// A button with the text “Pay with” and the Apple Pay logo.
| 'inStore'
// A button with the text "Donate with" and the Apple Pay logo.
| 'donate'
// A button with the text "Continue with" and the Apple Pay logo.
| 'continue';
type ButtonStyle =
// A white button with black lettering (shown here against a gray background to ensure visibility).
| 'white'
// A white button with black lettering and a black outline.
| 'whiteOutline'
// A black button with white lettering.
| 'black';