Mostrar flows y paywalls - Flutter

Si has creado un flow o un paywall en el antiguo Paywall Builder, no necesitas preocuparte por renderizarlo en el código de tu app para mostrárselo al usuario. Un flow o paywall de este tipo contiene tanto lo que se debe mostrar como la forma en que debe mostrarse.

El SDK de Flutter de Adapty ofrece dos formas de presentar flows y paywalls:

• Pantalla independiente

• Widget embebido

Presentar como pantalla independiente

Para mostrar un flow o paywall como pantalla independiente, usa el método view.present() en el view creado por el método createFlowView. Cada view solo se puede presentar una vez: cuando lo cierras, el view se libera de la memoria. Si necesitas mostrar el flow o paywall de nuevo, vuelve a llamar a createFlowView para crear una nueva instancia de view, o ciérralo sin liberarlo en el SDK 4.1 o posterior.

try {
  await view.present();
} on AdaptyError catch (e) {
  // handle the error
} catch (e) {
  // handle the error
}

Cerrar el flow o paywall

Cuando necesites cerrar el flow o paywall de forma programática, usa el método dismiss():

try {
  await view.dismiss();
} on AdaptyError catch (e) {
  // handle the error
} catch (e) {
  // handle the error
}

A partir del SDK 4.1, pasa destroy: false para mantener la vista en memoria:

await view.dismiss(destroy: false);

Muestra esa vista de nuevo y el usuario vuelve a la pantalla donde estaba, con el estado que el flow había acumulado. Una vista conservada de esta forma se mantiene hasta que la descartes con destroy: true.

Mostrar diálogo

Usa este método en lugar de los diálogos de alerta nativos cuando se muestra un flow o una vista de paywall en Android. En Android, las alertas normales aparecen detrás de la vista, lo que las hace invisibles para los usuarios. Este método garantiza que el diálogo se muestre correctamente por encima del flow o el paywall en todas las plataformas.

try {
  final action = await view.showDialog(
    title: 'Close paywall?',
    content: 'You will lose access to exclusive offers.',
    primaryActionTitle: 'Stay',
    secondaryActionTitle: 'Close',
  );
  
  if (action == AdaptyUIDialogActionType.secondary) {
    // User confirmed - close the paywall
    await view.dismiss();
  }
  // If primary - do nothing, user stays
} catch (e) {
  // handle error
}

Configurar el estilo de presentación en iOS

Configura cómo se presenta el flow o el paywall en iOS pasando el parámetro iosPresentationStyle al método present(). El parámetro acepta los valores AdaptyUIIOSPresentationStyle.fullScreen (predeterminado) o AdaptyUIIOSPresentationStyle.pageSheet.

try {
  await view.present(iosPresentationStyle: AdaptyUIIOSPresentationStyle.pageSheet);
} on AdaptyError catch (e) {
  // handle the error
} catch (e) {
  // handle the error
}

Incorporar en la jerarquía de widgets

Para incorporar un flow o paywall dentro de tu árbol de widgets existente, usa el widget AdaptyUIFlowPlatformView directamente en tu jerarquía de widgets de Flutter.

AdaptyUIFlowPlatformView(
  flow: flow, // The flow object you fetched
  locale: 'en', // The localization to render the flow with
  onDidAppear: (view) {
  },
  onDidDisappear: (view) {
  },
  onDidPerformAction: (view, action) {
  },
  onDidSelectProduct: (view, productId) {
  },
  onDidStartPurchase: (view, product) {
  },
  onDidFinishPurchase: (view, product, purchaseResult) {
  },
  onDidFailPurchase: (view, product, error) {
  },
  onDidStartRestore: (view) {
  },
  onDidFinishRestore: (view, profile) {
  },
  onDidFailRestore: (view, error) {
  },
  onDidReceiveError: (view, error) {
  },
  onDidFailLoadingProducts: (view, error) {
  },
  onDidFinishWebPaymentNavigation: (view, product, error) {
  },
)

class MainActivity : FlutterFragmentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
    }
}

Si has personalizado un paywall con el Paywall Builder, no necesitas preocuparte por renderizarlo en el código de tu app para mostrárselo al usuario. Ese tipo de paywall incluye tanto lo que debe mostrarse como la forma en que debe mostrarse.

El SDK de Adapty para Flutter ofrece dos formas de presentar paywalls:

• Pantalla independiente

• Widget embebido

Presentar como pantalla independiente

Para mostrar un paywall como pantalla independiente, usa el método view.present() en la view creada por el método createPaywallView. Cada view solo puede usarse una vez. Si necesitas mostrar el paywall de nuevo, llama a createPaywallView otra vez para crear una nueva instancia de view.

try {
  await view.present();
} on AdaptyError catch (e) {
  // handle the error
} catch (e) {
  // handle the error
}

Cierra el paywall

Cuando necesites cerrar el paywall mediante código, usa el método dismiss():

try {
  await view.dismiss();
} on AdaptyError catch (e) {
  // handle the error
} catch (e) {
  // handle the error
}

Mostrar un diálogo

Usa este método en lugar de los diálogos de alerta nativos cuando se muestra una vista de paywall en Android. En Android, las alertas normales aparecen detrás de la vista del paywall, lo que las hace invisibles para el usuario. Este método garantiza que el diálogo se muestre correctamente por encima del paywall en todas las plataformas.

try {
  final action = await view.showDialog(
    title: 'Close paywall?',
    content: 'You will lose access to exclusive offers.',
    primaryActionTitle: 'Stay',
    secondaryActionTitle: 'Close',
  );
  
  if (action == AdaptyUIDialogActionType.secondary) {
    // User confirmed - close the paywall
    await view.dismiss();
  }
  // If primary - do nothing, user stays
} catch (e) {
  // handle error
}

Configurar el estilo de presentación en iOS

Configura cómo se presenta el paywall en iOS pasando el parámetro iosPresentationStyle al método present(). El parámetro acepta los valores AdaptyUIIOSPresentationStyle.fullScreen (por defecto) o AdaptyUIIOSPresentationStyle.pageSheet.

try {
  await view.present(iosPresentationStyle: AdaptyUIIOSPresentationStyle.pageSheet);
} on AdaptyError catch (e) {
  // handle the error
} catch (e) {
  // handle the error
}

Insertar en la jerarquía de widgets

Para insertar un paywall dentro de tu árbol de widgets existente, utiliza el widget AdaptyUIPaywallPlatformView directamente en tu jerarquía de widgets de Flutter.

AdaptyUIPaywallPlatformView(
  paywall: paywall, // The paywall object you fetched
  onDidAppear: (view) {
  },
  onDidDisappear: (view) {
  },
  onDidPerformAction: (view, action) {
  },
  onDidSelectProduct: (view, productId) {
  },
  onDidStartPurchase: (view, product) {
  },
  onDidFinishPurchase: (view, product, purchaseResult) {
  },
  onDidFailPurchase: (view, product, error) {
  },
  onDidStartRestore: (view) {
  },
  onDidFinishRestore: (view, profile) {
  },
  onDidFailRestore: (view, error) {
  },
  onDidFailRendering: (view, error) {
  },
  onDidFailLoadingProducts: (view, error) {
  },
  onDidFinishWebPaymentNavigation: (view, product, error) {
  },
)

class MainActivity : FlutterFragmentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
    }
}