---
title: "Hiển thị onboarding trong iOS SDK"
description: "Khám phá cách hiển thị onboarding trên iOS để tăng tỷ lệ chuyển đổi và doanh thu."
---

:::tip
**Từ SDK v4 (beta)**, bạn có thể xây dựng [flow](get-pb-paywalls) như một giải pháp mạnh mẽ hơn so với onboarding. Khác với onboarding chạy bên trong WebView, flow render trực tiếp trên thiết bị — mang lại animation mượt mà hơn, giao diện iOS nhất quán, tốc độ tải nhanh hơn và không phụ thuộc vào WebView runtime. Xem [Lấy flow & paywall](get-pb-paywalls) và [Hiển thị flow & paywall](ios-present-paywalls) để bắt đầu.
:::

Nếu bạn đã tùy chỉnh onboarding bằng builder, 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. Onboarding đó đã bao gồm cả nội dung cần hiển thị lẫn cách hiển thị.

Trước khi bắt đầu, hãy đảm bảo rằng:

1. Bạn đã cài đặt [Adapty iOS SDK](sdk-installation-ios) phiên bản 3.8.0 trở lên.
2. Bạn đã [tạo một onboarding](create-onboarding).
3. Bạn đã thêm onboarding vào một [placement](placements).

## Hiển thị onboarding bằng Swift \{#present-onboardings-in-swift\}

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

1. Lấy cấu hình view onboarding bằng phương thức `.getOnboardingConfiguration`.
2. Khởi tạo onboarding trực quan mà bạn muốn hiển thị bằng phương thức `.onboardingController`:

   Tham số đầu vào:

   | Tham số                       | Bắt buộc | Mô tả                                                                                                                                                          |
   |:------------------------------|:---------|:---------------------------------------------------------------------------------------------------------------------------------------------------------------|
   | **onboarding configuration**  | bắt buộc | Một đối tượng `AdaptyUI.OnboardingConfiguration` chứa tất cả các thuộc tính của onboarding. Dùng phương thức `AdaptyUI.getOnboardingConfiguration` để lấy nó. |
   | **delegate**                  | bắt buộc | Một `AdaptyOnboardingControllerDelegate` để lắng nghe các sự kiện của onboarding.                                                                              |

   Kết quả trả về:

   | Đối tượng                      | Mô tả                                                   |
   |:-------------------------------|:--------------------------------------------------------|
   | **AdaptyOnboardingController** | Một đối tượng đại diện cho màn hình onboarding được yêu cầu |

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

   ```swift showLineNumbers title="Swift"
   import Adapty
   import AdaptyUI
   
   // 0. Get an onboarding if you haven't done it yet     
   let onboarding = try await Adapty.getOnboarding(placementId: "YOUR_PLACEMENT_ID")
   
   // 1. Obtain the onboarding view configuration:
   let configuration = try AdaptyUI.getOnboardingConfiguration(forOnboarding: onboarding)

   // 2. Create Onboarding View Controller
   let onboardingController = try AdaptyUI.onboardingController(
       with: configuration,
       delegate: <AdaptyOnboardingControllerDelegate>
   ) 

   // 3. Present it to the user
   present(onboardingController, animated: true)
   ```

## Hiển thị onboarding bằng SwiftUI \{#present-onboardings-in-swiftui\}

Để hiển thị onboarding trực quan trên màn hình thiết bị trong SwiftUI:

```swift showLineNumbers title="SwiftUI"
// 1. Obtain the onboarding view configuration:
let configuration = try AdaptyUI.getOnboardingConfiguration(forOnboarding: onboarding)

// 2. Display the Onboarding View within your view hierarchy
AdaptyOnboardingView(
    configuration: configuration,
    placeholder: { Text("Your Placeholder View") },
    onCloseAction: { action in
        // hide the onboarding view
    },
    onError: { error in
         // handle the error
    }
)
```

## Thêm hiệu ứng chuyển cảnh mượt mà giữa màn hình splash và onboarding \{#add-smooth-transitions-between-the-splash-screen-and-onboarding\}

Mặc định, giữa màn hình splash và onboarding, bạn sẽ thấy màn hình tải cho đến khi onboarding được load xong. Tuy nhiên, nếu muốn quá trình chuyển cảnh mượt mà hơn, bạn có thể tùy chỉnh — kéo dài màn hình splash hoặc hiển thị nội dung khác trong thời gian chờ.

Để làm điều này, hãy định nghĩa một placeholder (nội dung sẽ hiển thị trong khi onboarding đang được tải). Nếu bạn định nghĩa placeholder, onboarding sẽ được tải ngầm và tự động hiển thị khi sẵn sàng.

<Tabs>
<TabItem value="swift" label="UIKit">
```swift showLineNumbers

extension YourOnboardingManagerClass: AdaptyOnboardingControllerDelegate {
   func onboardingsControllerLoadingPlaceholder(
      _ controller: AdaptyOnboardingController
      ) -> UIView? {
         // instantiate and return the UIView which will be presented while onboarding is being loaded
   }
}
```
</TabItem>

<TabItem value="swiftui" label="SwiftUI">
```swift showLineNumbers
AdaptyOnboardingView(
    configuration: configuration,
    placeholder: { 
        // define your placeholder view, which will be presented while onboarding is being loaded
    },
    // the rest of the implementation
)
```
</TabItem>

</Tabs>

## Tùy chỉnh cách mở link trong onboarding \{#customize-how-links-open-in-onboardings\}

:::important
Tùy chỉnh cách mở link trong onboarding được hỗ trợ từ Adapty SDK v3.15.1 trở lên.
:::

Mặc định, các link trong onboarding sẽ mở trong trình duyệt trong ứng dụng. Điều này mang lại trải nghiệm liền mạch bằng cách hiển thị trang web ngay trong ứng dụng, giúp người dùng xem nội dung mà không cần chuyển sang ứng dụng khác.

Nếu bạn muốn mở link bằng trình duyệt ngoài thay thế, bạn có thể tùy chỉnh hành vi này bằng cách đặt tham số `externalUrlsPresentation` thành `.externalBrowser`:

```swift showLineNumbers

let configuration = try AdaptyUI.getOnboardingConfiguration(
    forOnboarding: onboarding,
    externalUrlsPresentation: .externalBrowser // default – .inAppBrowser
)
```