Paywall v2 rendering issues on multiple Android devices

Hey ​@soscuisine !

The Paywall (and its components) are built and rendered natively on each platform (SwiftUI on iOS, Jetpack Compose on Android), so each platform has its own structure for laying out and rendering them. Because of that, we recommend leaving sizing dynamic (fit/fill rather than fixed values) where you can, so components adjust to each screen as best as they can. Even then, with so many devices and system settings out there, a paywall usually needs some tweaking and sanity checking on real devices, to be sure it’s well fitting in them all.

Looking at your shared screenshots, it suggests that a larger system font size (and possibly display size) set on the affected devices, which seems to be common on Samsung - text scales up with that setting, but fixed-size containers don't grow with it, so the pricing text wraps inside its box. In these cases, it can make the card grows and pushes the button down, and the footer links squeeze "Restore Purchases" until it renders one character per line. French (or other langauges) makes it more visible simply because the Strings of text are longer. 

A few things to try to get around this could be to:

• for the footer links, avoid three fit-width texts competing for one row. Set them to fill with equal distribution so they wrap gracefully, or move Restore Purchases to its own row;
• set the pricing text's container to fill width and fit height, so scaled text wraps and grows the box instead of being cut off;
• keep the content above the pricing card in a scrollable stack, so it scrolls instead of overlapping when the bottom section grows;
• sanity check on a device with Font size and Display size at max before republishing.

There's also an "Automatically scale font size" option in the paywall editor's Settings panel:

Unchecking it makes the paywall keep your designed font sizes instead of scaling with the device setting, which sidesteps this whole class of layout issues, though it means the paywall won't follow the user's accessibility font preference, so weigh that for your audience! 

One important note to consider, this it only takes effect on devices running react-native-purchases 10.1.2 or later, so check your current SDK version first.

Let me know if this helps!