forked from gardencoder-zz/react-native-paytabs-library
-
Notifications
You must be signed in to change notification settings - Fork 15
Open
Description
Hello,
I am encountering an issue with the PayTabs React Native SDK on Android where the payment screen overlaps with the status bar at the top of the device. When I call RNPaymentSDKLibrary.startCardPayment with my configuration, the payment screen content starts beneath the status bar, causing part of the UI to be hidden or clipped.
🔍 Steps to Reproduce:
Integrate PayTabs React Native SDK (@paytabs/react-native-paytabs) in a React Native project.
Configure and call the payment as shown below:
const resolvedMerchantLogo = Image.resolveAssetSource(merchantLogo);
theme.merchantLogo = resolvedMerchantLogo;
configuration.theme = theme;
configuration.billingDetails = billingDetails;
RNPaymentSDKLibrary.startCardPayment(JSON.stringify(configuration))
.then(result => console.log(result))
.catch(error => console.log('PAYMENT ERROR', error));
🎨 styles.xml:
`
<resources>
<style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
<item name="android:editTextBackground">@drawable/rn_edit_text_material</item>
</style>
<color name="payment_sdk_primary_color">#5C13DF</color>
<color name="payment_sdk_secondary_color">#FFC107</color>
<color name="payment_sdk_primary_font_color">#111112</color>
<color name="payment_sdk_secondary_font_color">#6D6C70</color>
<color name="payment_sdk_separators_color">#FFC107</color>
<color name="payment_sdk_stroke_color">#673AB7</color>
<color name="payment_sdk_button_text_color">#FFF</color>
<color name="payment_sdk_title_text_color">#FFF</color>
<color name="payment_sdk_button_background_color">#3F51B5</color>
<color name="payment_sdk_background_color">#F9FAFD</color>
<color name="payment_sdk_card_background_color">#F9FAFD</color>
<dimen name="payment_sdk_primary_font_size">17sp</dimen>
<dimen name="payment_sdk_secondary_font_size">15sp</dimen>
<dimen name="payment_sdk_separator_thickness">10dp</dimen>
<dimen name="payment_sdk_stroke_thickness">.5dp</dimen>
<dimen name="payment_sdk_input_corner_radius">8dp</dimen>
<dimen name="payment_sdk_button_corner_radius">8dp</dimen>
</resources>
`
| Property | Version |
| ----------------------------- | ------------------ |
| React | 19.1.0 |
| React Native | 0.80.0 |
| @paytabs/react-native-paytabs | 2.6.9 |Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
No labels