Skip to main content
Solved

Flutter PaywallFooterView - lots of space above packages

  • 27 May 2024
  • 3 replies
  • 96 views

purchases_flutter: ^6.29.0
purchases_ui_flutter: ^6.29.0
platform :ios, '12.0'  (Podfile, pod install issues if trying to raise to ‘15.0’)

 

Too much space above packages, how can I get rid of it? Seems to be some padding?

 


Template 5 (was forced to set title + 1 feature):

 

Code:

void presentPaywallFooter(BuildContext context) async {

final offerings = await Purchases.getOfferings();

final offering = offerings.current;

 

showModalBottomSheet(

context: context,

builder: (BuildContext context) {

return PaywallFooterView(

offering: offering,

onPurchaseStarted: (Package rcPackage) {

debugPrint('Purchase started for package: ${rcPackage.identifier}');

},

onPurchaseCompleted: (CustomerInfo customerInfo, StoreTransaction storeTransaction) {

debugPrint('Purchase completed: ${storeTransaction.transactionIdentifier}');

},

onPurchaseError: (PurchasesError error) {

debugPrint('Purchase error: ${error.message}');

},

onRestoreCompleted: (CustomerInfo customerInfo) {

debugPrint('Restore completed');

},

onRestoreError: (PurchasesError error) {

debugPrint('Restore error: ${error.message}');

},

onDismiss: () {

Navigator.pop(context);

},

contentCreator: (double bottomPadding) {

//return SizedBox.shrink(); // empty box, could be content above the paywall

// takes same space
return Text('Custom content above the paywall, bottomPadding: $bottomPadding'); 

},

);

},

);

}


Appearance:


Too much space above packages, how can I get rid of it? Seems to be some padding?
BottomPadding is just 20px

This post has been closed for comments

3 replies

I
Badge +1

Another solution could be to grow that section to the height of contentCreator widget. Failed me so far.

I
Badge +1

This forum doesn’t work, basically :(

Workaround: Use PaywallFooterView() as body of a screen you navigate to. Put contentCreator Widget in a SingleChildScrollView, and throw in all the content you want.

Result: a separate page with a paywall footer.

 

jeffrey_bunn
Rank
Userlevel 2
Badge +4

@ingoa Thanks for logging this, and I apologize for the issue. Cesar, an engineer on our team, replied to a GitHub issue on this here, and I’ve copied his answer below for reference.

---

By looking at your code in that community post, your workaround is how PaywallFooterView is supposed to work. What you pass in contentCreator is meant to be the top of the screen "above" the footer paywall. It's done that way so it's easier to set the bottom padding (for the rounded top corners of the paywall)

contentCreator: (bottomPadding) => YourPaywall(bottomPadding),

We have a complete snippet in our docs:

https://www.revenuecat.com/docs/tools/paywalls/displaying-paywalls#how-to-display-a-footer-paywall-on-your-custom-paywall-3

import 'package:purchases_ui_flutter/purchases_ui_flutter.dart';

// In your own Widget:
@override
Widget build(BuildContext context) {
  return Scaffold(
    body: SafeArea(
      child: Center(
        child: PaywallFooterView(
          offering: offering, // Optional Offering object obtained through getOfferings,
          onRestoreCompleted: (CustomerInfo customerInfo) {
            // Optional listener. Called when a restore has been completed.
            // This may be called even if no entitlements have been granted.
          },
          onDismiss: () {
            // Dismiss the paywall, i.e. remove the view, navigate to another screen, etc.
            // Will be called when a purchase succeeds.
          },
          contentCreator: (bottomPadding) => YourPaywall(bottomPadding),
        ),
      ),
    ),
  );
}

and in the app we use for testing

purchases-flutter/revenuecat_examples/purchase_tester/lib/src/paywall_footer_screen.dart

Line 49 in 69c9bea

  contentCreator: (bottomPadding) => Container(
Terms & ConditionsCookie settings