Hiển thị flows & paywalls - iOS

Nếu bạn đã tạo một flow hoặc paywall, bạn không cần lo lắng về việc render nó trong code ứng dụng để hiển thị cho người dùng. Flow hoặc paywall đó đã chứa cả nội dung cần hiển thị lẫn cách hiển thị.

Để lấy đối tượng AdaptyUI.FlowConfiguration dùng bên dưới, xem Lấy flows và paywalls.

Hiển thị flows và paywalls trong SwiftUI

Hiển thị dưới dạng modal view

Để hiển thị một flow hoặc paywall trên màn hình thiết bị dưới dạng modal view, hãy dùng modifier .flow trong SwiftUI. Lệnh gọi tối thiểu cần có isPresented, flowConfiguration, và năm callback bắt buộc:

.flow(
    isPresented: $flowPresented,
    flowConfiguration: <AdaptyUI.FlowConfiguration>,
    didFinishPurchase: { _, _ in /* dismiss, or do nothing to let the flow continue */ },
    didFailPurchase: { _, _ in /* handle the error */ },
    didFinishRestore: { _ in /* check access level and dismiss */ },
    didFailRestore: { _ in /* handle the error */ },
    didReceiveError: { _ in flowPresented = false }
)

Để kiểm soát nhiều hơn, hãy thêm các callback tùy chọn như didPerformAction để xử lý các thao tác nhấn nút:

@State var flowPresented = false // ensure that you manage this variable state and set it to `true` at the moment you want to show the flow or paywall

var body: some View {
  Text("Hello, AdaptyUI!")
      .flow(
          isPresented: $flowPresented,
          flowConfiguration: <AdaptyUI.FlowConfiguration>,
          didPerformAction: { action in
              switch action {
                  case .close:
                      flowPresented = false
                  default:
                      // Handle other actions
                      break
              }
          },
          didFinishPurchase: { product, purchaseResult in /* dismiss, or do nothing to let the flow continue */ },
          didFailPurchase: { product, error in /* handle the error */ },
          didFinishRestore: { profile in /* check access level and dismiss */ },
          didFailRestore: { error in /* handle the error */ },
          didReceiveError: { error in flowPresented = false }
      )
}

(No translatable prose — the input contains only the word “Parameters:” with no content to translate beyond that label.)

Parameters:

Tham số	Bắt buộc	Mô tả
isPresented	bắt buộc	Một binding quản lý việc hiển thị màn hình flow hoặc paywall.
flowConfiguration	bắt buộc	Một đối tượng AdaptyUI.FlowConfiguration chứa thông tin hiển thị của flow hoặc paywall. Sử dụng phương thức AdaptyUI.getFlowConfiguration(forFlow:). Tham khảo Lấy flows và paywalls để biết thêm chi tiết.
didFinishPurchase	bắt buộc	Được gọi khi Adapty.makePurchase() hoàn thành thành công. Flow không tự động đóng — đặt binding hiển thị của bạn thành false ở đây, hoặc không làm gì để flow tiếp tục sau khi mua.
didFailPurchase	bắt buộc	Được gọi khi Adapty.makePurchase() thất bại.
didFinishRestore	bắt buộc	Được gọi khi Adapty.restorePurchases() hoàn thành thành công.
didFailRestore	bắt buộc	Được gọi khi Adapty.restorePurchases() thất bại.
didReceiveError	bắt buộc	Được gọi khi có lỗi render hoặc lỗi runtime từ script của flow (ví dụ: ngoại lệ JavaScript, mã AdaptyUIError 4105). Đối với lỗi render, hãy liên hệ Adapty Support.
fullScreen	tùy chọn	Xác định xem flow hoặc paywall hiển thị ở chế độ toàn màn hình hay dạng sheet. Mặc định là true.
didAppear	tùy chọn	Được gọi khi view của flow hoặc paywall được hiển thị.
didDisappear	tùy chọn	Được gọi khi view của flow hoặc paywall bị đóng.
didPerformAction	tùy chọn	Được gọi khi người dùng nhấn một nút. Hai action ID được định nghĩa sẵn: close và openURL; các ID khác là tùy chỉnh và có thể được đặt trong builder.
didSelectProduct	tùy chọn	Được gọi khi người dùng hoặc hệ thống chọn một sản phẩm để mua.
didStartPurchase	tùy chọn	Được gọi khi người dùng bắt đầu quá trình mua hàng.
didFinishWebPaymentNavigation	tùy chọn	Được gọi khi điều hướng thanh toán web kết thúc.
didStartRestore	tùy chọn	Được gọi khi người dùng bắt đầu quá trình khôi phục.
didFailLoadingProducts	tùy chọn	Được gọi khi có lỗi trong quá trình tải sản phẩm. Trả về true để thử tải lại.
didPartiallyLoadProducts	tùy chọn	Được gọi khi sản phẩm được tải một phần.
showAlertItem	tùy chọn	Một binding quản lý việc hiển thị các alert item phía trên flow hoặc paywall.
showAlertBuilder	tùy chọn	Một hàm để render view alert.
placeholderBuilder	tùy chọn	Một hàm để render view placeholder trong khi flow hoặc paywall đang tải. Mặc định là ProgressView.
Tham khảo chủ đề iOS - Xử lý sự kiện để biết thêm chi tiết về các tham số.

Hiển thị dưới dạng non-modal view

Bạn cũng có thể hiển thị flow và paywall dưới dạng điểm đến trong navigation hoặc inline view trong flow điều hướng của ứng dụng. Dùng AdaptyFlowView trực tiếp trong các SwiftUI view của bạn:

AdaptyFlowView(
    flowConfiguration: <AdaptyUI.FlowConfiguration>,
    didFinishPurchase: { product, purchaseResult in
        // Dismiss the view, or do nothing to let the flow continue
    },
    didFailPurchase: { product, error in
        // Handle purchase failure
    },
    didFinishRestore: { profile in
        // Handle successful restore
    },
    didFailRestore: { error in
        // Handle restore failure
    },
    didReceiveError: { error in
        // Handle the error (rendering or JS exception from the flow script).
    }
)

Hiển thị flow và paywall trong UIKit

Để hiển thị flow hoặc paywall trên màn hình thiết bị, thực hiện các bước sau:

1. Khởi tạo visual flow bạn muốn hiển thị bằng cách sử dụng phương thức AdaptyUI.flowController(with:delegate:):

   import AdaptyUI
   
   let visualFlow = try AdaptyUI.flowController(
       with: <AdaptyUI.FlowConfiguration>,
       delegate: <AdaptyFlowControllerDelegate>
   )

   Các tham số yêu cầu:

   Tham số	Bắt buộc	Mô tả
   flowConfiguration	required	Một đối tượng AdaptyUI.FlowConfiguration chứa thông tin hiển thị của flow hoặc paywall. Sử dụng phương thức AdaptyUI.getFlowConfiguration(forFlow:). Tham khảo chủ đề Lấy flow và paywall để biết thêm chi tiết.
   delegate	required	Một AdaptyFlowControllerDelegate để lắng nghe các sự kiện của flow và paywall. Tham khảo chủ đề Xử lý sự kiện flow & paywall để biết thêm chi tiết.

   Trả về:

   Object	Mô tả
   AdaptyFlowController	Đối tượng đại diện cho flow hoặc màn hình paywall được yêu cầu.

2. Sau khi đối tượng được tạo thành công, bạn có thể hiển thị nó lên màn hình thiết bị:

   present(visualFlow, animated: true)

Nếu bạn đã tùy chỉnh paywall bằng Paywall Builder, bạn không cần lo lắng về việc render nó trong code ứng dụng di động để hiển thị cho người dùng. Paywall như vậy đã chứa cả nội dung cần hiển thị lẫn cách thức hiển thị. Để lấy đối tượng AdaptyUI.PaywallConfiguration được sử dụng bên dưới, hãy xem Tải paywall từ Paywall Builder và cấu hình của chúng.

Hiển thị paywalls trong SwiftUI

Hiển thị dưới dạng modal view

Để hiển thị paywall trực quan trên màn hình thiết bị dưới dạng modal view, hãy dùng modifier .paywall trong SwiftUI:

@State var paywallPresented = false // ensure that you manage this variable state and set it to `true` at the moment you want to show the paywall

var body: some View {
  Text("Hello, AdaptyUI!")
      .paywall(
          isPresented: $paywallPresented,
          paywallConfiguration: <AdaptyUI.PaywallConfiguration>,
          didPerformAction: { action in
              switch action {
                  case .close:
                      paywallPresented = false
                  default:
                      // Handle other actions
                      break
              }
          },
          didFinishPurchase: { product, profile in paywallPresented = false },
          didFailPurchase: { product, error in /* handle the error */ },
          didFinishRestore: { profile in /* check access level and dismiss */  },
          didFailRestore: { error in /* handle the error */ },
          didFailRendering: { error in paywallPresented = false }
      )
}

(No translatable prose — output unchanged.)

Tham số	Bắt buộc	Mô tả
isPresented	bắt buộc	Một binding quản lý việc màn hình paywall có được hiển thị hay không.
paywallConfiguration	bắt buộc	Một đối tượng AdaptyUI.PaywallConfiguration chứa thông tin trực quan của paywall. Sử dụng phương thức AdaptyUI.paywallConfiguration(for:products:viewConfiguration:observerModeResolver:tagResolver:timerResolver:). Tham khảo chủ đề Lấy paywall Paywall Builder và cấu hình của chúng để biết thêm chi tiết.
didFailPurchase	bắt buộc	Được gọi khi Adapty.makePurchase() thất bại.
didFinishRestore	bắt buộc	Được gọi khi Adapty.restorePurchases() hoàn thành thành công.
didFailRestore	bắt buộc	Được gọi khi Adapty.restorePurchases() thất bại.
didFailRendering	bắt buộc	Được gọi nếu xảy ra lỗi trong quá trình render giao diện. Trong trường hợp này, hãy liên hệ Adapty Support.
fullScreen	tùy chọn	Xác định paywall hiển thị ở chế độ toàn màn hình hay dạng modal. Mặc định là true.
didAppear	tùy chọn	Được gọi khi màn hình paywall được hiển thị.
didDisappear	tùy chọn	Được gọi khi màn hình paywall bị đóng.
didPerformAction	tùy chọn	Được gọi khi người dùng nhấn một nút. Các nút khác nhau có các ID hành động khác nhau. Hai ID hành động được định nghĩa sẵn là: close và openURL, còn lại là tùy chỉnh và có thể được thiết lập trong builder.
didSelectProduct	tùy chọn	Được gọi khi một sản phẩm được chọn để mua (bởi người dùng hoặc hệ thống).
didStartPurchase	tùy chọn	Được gọi khi người dùng bắt đầu quá trình mua hàng.
didFinishPurchase	tùy chọn	Được gọi khi Adapty.makePurchase() hoàn thành thành công.
didFinishWebPaymentNavigation	tùy chọn	Được gọi khi điều hướng thanh toán web kết thúc.
didStartRestore	tùy chọn	Được gọi khi người dùng bắt đầu quá trình khôi phục.
didFailLoadingProducts	tùy chọn	Được gọi khi xảy ra lỗi trong quá trình tải sản phẩm. Trả về true để thử tải lại.
didPartiallyLoadProducts	tùy chọn	Được gọi khi sản phẩm chỉ được tải một phần.
showAlertItem	tùy chọn	Một binding quản lý việc hiển thị các mục cảnh báo phía trên paywall.
showAlertBuilder	tùy chọn	Một hàm để render màn hình cảnh báo.
placeholderBuilder	tùy chọn	Một hàm để render màn hình placeholder trong khi paywall đang tải.
Tham khảo phần iOS - Xử lý sự kiện để biết thêm chi tiết về các tham số.

Hiển thị dưới dạng non-modal view

Bạn cũng có thể hiển thị paywall dưới dạng điểm đến trong navigation hoặc view inline trong flow điều hướng của ứng dụng. Sử dụng AdaptyPaywallView trực tiếp trong các SwiftUI view của bạn:

AdaptyPaywallView(
    paywallConfiguration: <AdaptyUI.PaywallConfiguration>,
    didFailPurchase: { product, error in
        // Handle purchase failure
    },
    didFinishRestore: { profile in
        // Handle successful restore
    },
    didFailRestore: { error in
        // Handle restore failure
    },
    didFailRendering: { error in
        // Handle rendering error
    }
)

Hiển thị paywall trong UIKit

Để hiển thị paywall trực quan trên màn hình thiết bị, hãy làm theo các bước sau:

1. Khởi tạo paywall trực quan bạn muốn hiển thị bằng cách sử dụng phương thức .paywallController(for:products:viewConfiguration:delegate:):

   import AdaptyUI
   
   let visualPaywall = AdaptyUI.paywallController(
       with: <paywall configuration object>,
       delegate: <AdaptyPaywallControllerDelegate>
   )

   Các tham số yêu cầu:

   Tham số	Bắt buộc	Mô tả
   paywall configuration	required	Một đối tượng AdaptyUI.PaywallConfiguration chứa thông tin hiển thị của paywall. Sử dụng phương thức AdaptyUI.getPaywallConfiguration(forPaywall:locale:). Tham khảo chủ đề Fetch Paywall Builder paywalls and their configuration để biết thêm chi tiết.
   delegate	required	Một AdaptyPaywallControllerDelegate để lắng nghe các sự kiện của paywall. Tham khảo chủ đề Handling paywall events để biết thêm chi tiết.

Trả về:

Đối tượng	Mô tả
AdaptyPaywallController	Một đối tượng đại diện cho màn hình paywall được yêu cầu

2. Sau khi đối tượng được tạo thành công, bạn có thể hiển thị nó lên màn hình thiết bị:

   present(visualPaywall, animated: true)