Hiển thị flow ở chế độ Observer trong Flutter SDK

Nếu bạn sử dụng chế độ Observer, bạn có trách nhiệm tự xử lý logic mua hàng. Nhưng bạn có thể ủy quyền giao diện paywall cho Flow & Paywall Builder.

Thiết kế màn hình trong builder, và Adapty SDK sẽ render nó natively. Cập nhật nội dung, bố cục và giá tiền bất cứ lúc nào bạn muốn mà không cần phát hành lại app.

Hướng dẫn này trình bày cách hiển thị một flow và xử lý các callback mua hàng. Nếu Adapty thực hiện mua hàng thay cho bạn, hãy xem Hiển thị flows & paywalls.

Trước khi bắt đầu

Bạn cần:

• Adapty Flutter SDK 4.0 trở lên: Các phiên bản cũ hơn không thể render flow. Để chuyển đổi ứng dụng hiện có, xem hướng dẫn migration.
• observerMode đặt thành true: Xem hướng dẫn cài đặt Flutter SDK.
• Tích hợp cửa hàng ban đầu: Thiết lập Adapty với App Store và với Google Play.
• Một flow đã xuất bản với các sản phẩm: Xây dựng trong Flow & Paywall Builder và gán sản phẩm vào đó.
• Một placement cho flow: Tạo một placement và gán flow của bạn vào đó.
• Flow đã được tải trong ứng dụng của bạn: Lấy flow và cấu hình của nó trước khi hiển thị.

Triển khai

Ở chế độ Observer, SDK không thực hiện mua hàng thay bạn. Khi người dùng nhấn nút mua hoặc khôi phục trong một flow do Adapty render, SDK sẽ gọi AdaptyUIObserverModeResolver của bạn thay thế — hãy thực hiện việc mua hoặc khôi phục bằng code của riêng bạn tại đó.

1. Triển khai AdaptyUIObserverModeResolver:

   class MyObserverModeResolver extends AdaptyUIObserverModeResolver {
     @override
     void observerModeDidInitiatePurchase(
       AdaptyUIFlowView view,
       AdaptyPaywallProduct product,
       void Function() onStartPurchase,
       void Function() onFinishPurchase,
     ) {
       onStartPurchase(); // the view shows its loading indicator
       // make the purchase with your own code, then:
       onFinishPurchase(); // the view hides the loading indicator
     }
   
     @override
     void observerModeDidInitiateRestore(
       AdaptyUIFlowView view,
       void Function() onStartRestore,
       void Function() onFinishRestore,
     ) {
       onStartRestore();
       // restore purchases with your own code, then:
       onFinishRestore();
     }
   }

observerModeDidInitiatePurchase thông báo cho bạn biết người dùng đã bắt đầu mua hàng, còn observerModeDidInitiateRestore — người dùng đã bắt đầu khôi phục. Hãy kích hoạt flow mua hàng hoặc khôi phục tùy chỉnh của bạn để phản hồi.

Ngoài ra, nhớ gọi các callback sau để thông báo cho AdaptyUI về quá trình mua hàng hoặc khôi phục. Điều này cần thiết để flow hoạt động đúng, chẳng hạn như hiển thị loader và các thứ khác:

2. Đăng ký resolver trước khi hiển thị bất kỳ màn hình nào:

   AdaptyUI().setObserverModeResolver(MyObserverModeResolver());

3. Tạo và hiển thị flow view như bình thường: lấy flow và tạo view của nó, sau đó hiển thị nó. Không cần thêm tham số nào — khi resolver đã được đăng ký, mọi flow do Adapty render đều định tuyến các giao dịch mua và khôi phục qua nó.