{"templateId":"markdown","sharedDataIds":{"sidebar":"sidebar-guides/sidebars.yaml"},"props":{"metadata":{"markdoc":{"tagList":["sub-heading","admonition"]},"type":"markdown"},"seo":{"title":"About configuration","description":"Transform your commerce with PXP's unified platform—seamless payments, real-time insights, and global growth in one powerful integration.","lang":"en-UK","siteUrl":"https://developer.pxp.io","llmstxt":{"hide":false,"sections":[{"title":"Table of contents","includeFiles":["**/*"],"excludeFiles":[]}],"excludeFiles":[]}},"dynamicMarkdocComponents":[],"compilationErrors":[],"ast":{"$$mdtype":"Tag","name":"article","attributes":{},"children":[{"$$mdtype":"Tag","name":"Heading","attributes":{"level":1,"id":"about-configuration","__idx":0},"children":["About configuration"]},{"$$mdtype":"Tag","name":"SubHeading","attributes":{},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Learn about how to configure PayPal components for Android."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"overview","__idx":1},"children":["Overview"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The PayPal Android SDK provides a suite of configurable components for integrating PayPal payments into your Android application. Each component is built with Jetpack Compose and offers comprehensive configuration options for styling, behaviour, and event handling."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"configuration-structure","__idx":2},"children":["Configuration structure"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["All PayPal components follow a consistent configuration pattern:"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"kotlin","header":{"controls":{"copy":{}}},"source":"val componentConfig = ComponentConfig(\n    // Required properties\n    requiredProperty = value,\n    \n    // Optional properties\n    optionalProperty = value,\n    \n    // Styling\n    style = StyleConfig(\n        // Style properties\n    ),\n    \n    // Event handlers\n    onEvent = { data ->\n        // Handle event\n    }\n)\n","lang":"kotlin"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"basic-configuration","__idx":3},"children":["Basic configuration"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["At minimum, each component requires a few essential properties:"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"kotlin","header":{"controls":{"copy":{}}},"source":"// PayPal component\nval paypalConfig = PayPalComponentConfig(\n    renderType = \"standalone\",\n    fundingSources = \"paypal\",\n    shippingPreference = \"NoShipping\",\n    userAction = \"PayNow\"\n)\n\n// Consent component\nval consentConfig = PayPalConsentConfig(\n    label = \"Save my PayPal account\"\n)\n\n// Toggle component\nval toggleConfig = ToggleComponentConfig(\n    label = \"Use different PayPal account\"\n)\n\n// Pre-built component\nval prebuiltConfig = PreBuiltPayPalComponentConfig(\n    paypalConfig = paypalConfig\n)\n","lang":"kotlin"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"advanced-configuration","__idx":4},"children":["Advanced configuration"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["For more complex implementations, you can configure styling, callbacks, and additional features:"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"kotlin","header":{"controls":{"copy":{}}},"source":"val paypalConfig = PayPalComponentConfig(\n    // Required configuration\n    renderType = \"standalone\",\n    fundingSources = \"paypal\",\n    shippingPreference = \"NoShipping\",\n    userAction = \"PayNow\",\n    \n    // Styling\n    style = PayPalButtonStyle(\n        layout = \"horizontal\",\n        color = \"blue\",\n        shape = \"pill\",\n        height = 48,\n        label = \"checkout\"\n    ),\n    \n    // One-click payment\n    enableOneClickPayment = true,\n    scriptParams = PayPalScriptParams(\n        userIdToken = getUserIdToken()\n    ),\n    \n    // Event handlers\n    onSuccess = { data ->\n        handlePaymentSuccess(data)\n    },\n    onError = { error ->\n        handlePaymentError(error)\n    }\n)\n","lang":"kotlin"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"styling-components","__idx":5},"children":["Styling components"]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"default-styling","__idx":6},"children":["Default styling"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["All components come with PayPal-branded default styling:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["PayPal button:"]}," Gold button with vertical layout."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Consent checkbox:"]}," PayPal blue with standard dimensions."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Toggle switch:"]}," Material Design with PayPal blue active state."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Pre-built container:"]}," Clean white background with rounded corners."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"custom-styling","__idx":7},"children":["Custom styling"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Each component offers comprehensive styling options:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Colours:"]}," Customise all colour properties including backgrounds, text, borders, and states."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Typography:"]}," Control font sizes, weights, and text styles."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Layout:"]}," Configure spacing, padding, dimensions, and positioning."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Shapes:"]}," Adjust border radius and container shapes."]}]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"kotlin","header":{"controls":{"copy":{}}},"source":"val customToggleConfig = ToggleComponentConfig(\n    label = \"Custom styled toggle\",\n    labelStyle = ToggleLabelStyle(\n        color = Color(0xFF2C2E2F),\n        fontSizeSp = 16f,\n        fontWeight = FontWeight.SemiBold,\n        position = LabelPosition.START,\n        spacing = 16.dp\n    ),\n    toggleStyle = ToggleVisualStyle(\n        width = 56.dp,\n        height = 32.dp,\n        borderRadius = 16.dp,\n        activeTrackColor = Color(0xFF0070BA),\n        inactiveTrackColor = Color(0xFFE0E0E0)\n    )\n)\n","lang":"kotlin"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"event-handling","__idx":8},"children":["Event handling"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["All components provide event handlers for user interactions and lifecycle events."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Common event patterns:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Success handlers:"]}," Called when operations complete successfully."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Error handlers:"]}," Called when errors occur."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["State change handlers:"]}," Called when a component state changes."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Lifecycle handlers:"]}," Called during component mounting and unmounting."]}]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"kotlin","header":{"controls":{"copy":{}}},"source":"val paypalConfig = PayPalComponentConfig(\n    // Success handling\n    onSuccess = { data ->\n        val jsonObject = JSONObject(data)\n        val orderID = jsonObject.getString(\"orderID\")\n        navigateToSuccessScreen(orderID)\n    },\n    \n    // Error handling\n    onError = { error ->\n        Log.e(\"PayPal\", \"Payment failed: $error\")\n        showErrorDialog(error)\n    },\n    \n    // Cancellation handling\n    onCancel = {\n        Log.d(\"PayPal\", \"Payment cancelled\")\n        returnToCart()\n    }\n)\n","lang":"kotlin"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"component-linking","__idx":9},"children":["Component linking"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Components can be linked together for coordinated behaviour."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"linking-toggle-with-paypal","__idx":10},"children":["Linking toggle with PayPal"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"kotlin","header":{"controls":{"copy":{}}},"source":"// Create toggle first\nval toggleComponent = pxpCheckout.createComponent(\n    type = ComponentType.TOGGLE,\n    config = toggleConfig\n)\n\n// Link to PayPal component\nval paypalConfig = PayPalComponentConfig(\n    toggleComponent = toggleComponent,\n    enableOneClickPayment = true\n)\n","lang":"kotlin"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"linking-consent-with-paypal","__idx":11},"children":["Linking consent with PayPal"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"kotlin","header":{"controls":{"copy":{}}},"source":"// Create consent first\nval consentComponent = pxpCheckout.createComponent(\n    type = ComponentType.PAYPAL_CONSENT,\n    config = consentConfig\n)\n\n// Link to PayPal component\nval paypalConfig = PayPalComponentConfig(\n    consentComponent = consentComponent,\n    onGetConsent = {\n        consentComponent.getValue() as? Boolean ?: false\n    }\n)\n","lang":"kotlin"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"best-practices","__idx":12},"children":["Best practices"]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"use-appropriate-components","__idx":13},"children":["Use appropriate components"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Choose the right component for your use case:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Simple payments:"]}," Use PayPal component alone."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["One-click with consent:"]}," Add the consent component."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Account switching:"]}," Add the toggle component."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Quick implementation:"]}," Use the pre-built component."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"configure-for-your-brand","__idx":14},"children":["Configure for your brand"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Customise the styling to match your app's design:"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"kotlin","header":{"controls":{"copy":{}}},"source":"// Define brand colors\nobject BrandColors {\n    val primary = Color(0xFF0070BA)\n    val surface = Color(0xFFF8F9FA)\n    val onSurface = Color(0xFF212529)\n}\n\n// Apply to components\nval paypalConfig = PayPalComponentConfig(\n    style = PayPalButtonStyle(\n        color = \"blue\",\n        shape = \"rect\"\n    )\n)\n","lang":"kotlin"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"handle-all-events","__idx":15},"children":["Handle all events"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Implement comprehensive event handling:"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"kotlin","header":{"controls":{"copy":{}}},"source":"val paypalConfig = PayPalComponentConfig(\n    onSuccess = { handleSuccess(it) },\n    onError = { handleError(it) },\n    onCancel = { handleCancel() },\n    onOrderCreated = { trackOrder(it) },\n    onScriptLoaded = { hideLoading() }\n)\n","lang":"kotlin"},"children":[]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"info"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["For more information about events, see ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/checkout/components/android/paypal/events"},"children":["Events"]},"."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"validate-user-input","__idx":16},"children":["Validate user input"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Use validation for the consent and toggle components:"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"kotlin","header":{"controls":{"copy":{}}},"source":"val consentConfig = PayPalConsentConfig(\n    isRequired = true,\n    onTriggerFieldValidation = { result ->\n        if (!result.isValid) {\n            showError(\"Please agree to save your PayPal account\")\n        }\n    }\n)\n","lang":"kotlin"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"test-different-configurations","__idx":17},"children":["Test different configurations"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Test your components in various scenarios:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Light and dark themes."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Different screen sizes."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Various payment amounts."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Error conditions."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Network failures."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"next-steps","__idx":18},"children":["Next steps"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Now that you understand component configuration fundamentals, dive into the detailed documentation for each component:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/checkout/components/android/paypal/paypal-component"},"children":["PayPal component"]},":"]}," Comprehensive button configuration."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/checkout/components/android/paypal/consent-component"},"children":["Consent component"]},":"]}," Checkbox styling and behaviour."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/checkout/components/android/paypal/toggle-component"},"children":["Toggle component"]},":"]}," Switch configuration options."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/checkout/components/android/paypal/pre-built-component"},"children":["Pre-built component"]},":"]}," Composite component setup."]}]}]},"headings":[{"value":"About configuration","id":"about-configuration","depth":1},{"value":"Overview","id":"overview","depth":2},{"value":"Configuration structure","id":"configuration-structure","depth":2},{"value":"Basic configuration","id":"basic-configuration","depth":3},{"value":"Advanced configuration","id":"advanced-configuration","depth":3},{"value":"Styling components","id":"styling-components","depth":2},{"value":"Default styling","id":"default-styling","depth":3},{"value":"Custom styling","id":"custom-styling","depth":3},{"value":"Event handling","id":"event-handling","depth":2},{"value":"Component linking","id":"component-linking","depth":2},{"value":"Linking toggle with PayPal","id":"linking-toggle-with-paypal","depth":3},{"value":"Linking consent with PayPal","id":"linking-consent-with-paypal","depth":3},{"value":"Best practices","id":"best-practices","depth":2},{"value":"Use appropriate components","id":"use-appropriate-components","depth":3},{"value":"Configure for your brand","id":"configure-for-your-brand","depth":3},{"value":"Handle all events","id":"handle-all-events","depth":3},{"value":"Validate user input","id":"validate-user-input","depth":3},{"value":"Test different configurations","id":"test-different-configurations","depth":3},{"value":"Next steps","id":"next-steps","depth":2}],"frontmatter":{"seo":{"title":"About configuration"}},"lastModified":"2026-06-12T11:56:36.000Z","pagePropGetterError":{"message":"","name":""}},"slug":"/guides/checkout/components/android/paypal/about-configuration","userData":{"isAuthenticated":false,"teams":["anonymous"]},"isPublic":true}