---
title: "Capacitor SDK'da onboarding olaylarını yönetme"
description: "Adapty kullanarak Capacitor'da onboarding ile ilgili olayları yönetin."
---

Builder ile yapılandırılan onboarding'ler, uygulamanızın yanıt verebileceği olaylar üretir. Bağımsız ekran sunumu için bu olayları yönetmek amacıyla `setEventHandlers` metodunu kullanın.

Başlamadan önce şunların yapıldığından emin olun:

1. Bir [onboarding oluşturdunuz](create-onboarding).
2. Onboarding'i bir [placement](placements)'a eklediniz.

## Olay işleyicilerini ayarlama \{#set-up-event-handlers\}

Onboarding olaylarını yönetmek için `view.setEventHandlers` metodunu kullanın:

```typescript showLineNumbers

try {
  const view = await createOnboardingView(onboarding);
  
  view.setEventHandlers({
    onAnalytics(event, meta) {
      console.log('Analytics event:', event);
    },
    onClose(actionId, meta) {
      console.log('Onboarding closed:', actionId);
      return true; // Allow the onboarding to close
    },
    onCustom(actionId, meta) {
      console.log('Custom action:', actionId);
      return false; // Don't close the onboarding
    },
    onPaywall(actionId, meta) {
      console.log('Paywall action:', actionId);
      view.dismiss().then(() => {
        openPaywall(actionId);
      });
    },
    onStateUpdated(action, meta) {
      console.log('State updated:', action);
    },
    onFinishedLoading(meta) {
      console.log('Onboarding finished loading');
    },
    onError(error) {
      console.error('Onboarding error:', error);
    },
  });
  
  await view.present();
} catch (error) {
  console.error('Failed to present onboarding:', error);
}
```

## Olay türleri \{#event-types\}

Aşağıdaki bölümler, yönetebileceğiniz farklı olay türlerini açıklamaktadır.

### Özel eylemleri yönetme \{#handle-custom-actions\}

Builder'da bir butona **custom** eylem ekleyip bu eyleme bir ID atayabilirsiniz.

  <img src="/assets/shared/img/ios-events-1.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

Ardından bu ID'yi kodunuzda kullanarak özel eylem olarak yönetebilirsiniz. Örneğin, bir kullanıcı **Login** veya **Allow notifications** gibi özel bir butona dokunduğunda, olay işleyicisi builder'daki **Action ID** ile eşleşen `actionId` parametresiyle tetiklenir. "allowNotifications" gibi kendi ID'lerinizi oluşturabilirsiniz.

```typescript showLineNumbers
view.setEventHandlers({
  onCustom(actionId, meta) {
    switch (actionId) {
      case 'login':
        console.log('Login action triggered');
        break;
      case 'allow_notifications':
        console.log('Allow notifications action triggered');
        break;
    }
    return false; // Don't close the onboarding
  },
});
```

<Details>
<summary>Olay örneği (Genişletmek için tıklayın)</summary>

```json
{
  "actionId": "allow_notifications",
  "meta": {
    "onboardingId": "onboarding_123",
    "screenClientId": "profile_screen",
    "screenIndex": 0,
    "screensTotal": 3
  }
}
```
</Details>

### Onboarding yüklemesini tamamlama \{#finishing-loading-onboarding\}

Bir onboarding yüklemesi tamamlandığında bu olay tetiklenir:

```typescript showLineNumbers
view.setEventHandlers({
  onFinishedLoading(meta) {
    console.log('Onboarding loaded:', meta.onboardingId);
  },
});
```

<Details>
<summary>Olay örneği (Genişletmek için tıklayın)</summary>

```json
{
    "meta": {
        "onboarding_id": "onboarding_123",
        "screen_cid": "welcome_screen",
        "screen_index": 0,
        "total_screens": 4
    }
}
```
</Details>

### Onboarding'i kapatma \{#closing-onboarding\}

Bir kullanıcı **Close** eylemi atanmış bir butona dokunduğunda onboarding kapatılmış sayılır.

  <img src="/assets/shared/img/ios-events-2.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

:::important
Kullanıcı onboarding'i kapattığında ne olacağını kendiniz yönetmeniz gerektiğini unutmayın. Örneğin, onboarding'in kendisini görüntülemeyi durdurmanız gerekir.
:::

```typescript showLineNumbers
view.setEventHandlers({
  onClose(actionId, meta) {
    console.log('Onboarding closed:', actionId);
    return true; // Allow the onboarding to close
  },
});
```

<Details>
<summary>Olay örneği (Genişletmek için tıklayın)</summary>

```json
{
  "action_id": "close_button",
  "meta": {
    "onboarding_id": "onboarding_123",
    "screen_cid": "final_screen",
    "screen_index": 3,
    "total_screens": 4
  }
}
```
</Details>

### Paywall açma \{#opening-a-paywall\}

:::tip
Onboarding içinde bir paywall açmak istiyorsanız bu olayı yönetin. Paywall'ı onboarding kapandıktan sonra açmak istiyorsanız daha basit bir yol var: kapat eylemini yönetin ve olay verisine dayanmadan bir paywall açın.
:::

Bir kullanıcı paywall açan bir butona tıkladığında, [manuel olarak ayarladığınız](get-paid-in-onboardings) buton eylem ID'sini alırsınız. Onboarding'lerdeki paywalllarla çalışmanın en sorunsuz yolu, eylem ID'sini paywall placement ID'siyle eşit yapmaktır.

iOS'ta aynı anda yalnızca bir görünüm (paywall veya onboarding) ekranda gösterilebileceğini unutmayın. Bir onboarding'in üzerine paywall sunarsanız, arka plandaki onboarding'i programatik olarak kontrol edemezsiniz. Onboarding'i kapatmaya çalışmak bunun yerine paywall'ı kapatır ve onboarding görünür kalır. Bunu önlemek için, paywall'ı sunmadan önce her zaman onboarding görünümünü kapatın.

```typescript showLineNumbers
view.setEventHandlers({
  onPaywall(actionId, meta) {
    // Dismiss onboarding before presenting paywall
    view.dismiss().then(() => {
      openPaywall(actionId);
    });
  },
});

async function openPaywall(placementId: string) {
  // Implement your paywall opening logic here
}
```

<Details>
<summary>Olay örneği (Genişletmek için tıklayın)</summary>

```json
{
    "action_id": "premium_offer_1",
    "meta": {
        "onboarding_id": "onboarding_123",
        "screen_cid": "pricing_screen",
        "screen_index": 2,
        "total_screens": 4
    }
}
```
</Details>

### Navigasyonu takip etme \{#tracking-navigation\}

Onboarding akışı sırasında çeşitli navigasyon olayları gerçekleştiğinde bir analytics olayı alırsınız:

```typescript showLineNumbers
view.setEventHandlers({
  onAnalytics(event, meta) {
    console.log('Analytics event:', event.type, meta.onboardingId);
  },
});
```

`event` nesnesi aşağıdaki türlerden biri olabilir:

| Tür | Açıklama |
|------------|-------------|
| `onboardingStarted` | Onboarding yüklendiğinde |
| `screenPresented` | Herhangi bir ekran gösterildiğinde |
| `screenCompleted` | Bir ekran tamamlandığında. İsteğe bağlı `elementId` (tamamlanan öğenin tanımlayıcısı) ve isteğe bağlı `reply` (kullanıcının yanıtı) içerir. Kullanıcılar ekrandan çıkmak için herhangi bir eylem gerçekleştirdiğinde tetiklenir. |
| `secondScreenPresented` | İkinci ekran gösterildiğinde |
| `userEmailCollected` | Kullanıcının e-postası giriş alanı üzerinden toplandığında tetiklenir |
| `onboardingCompleted` | Kullanıcı `final` ID'sine sahip bir ekrana ulaştığında tetiklenir. Bu olaya ihtiyacınız varsa, [son ekrana `final` ID'sini atayın](design-onboarding). |
| `unknown` | Tanınmayan herhangi bir olay türü için. `name` (bilinmeyen olayın adı) ve `meta` (ek meta veri) içerir |

Her olay şu bilgileri içeren `meta` verisi sağlar:

| Alan | Açıklama |
|------------|-------------|
| `onboardingId` | Onboarding akışının benzersiz tanımlayıcısı |
| `screenClientId` | Mevcut ekranın tanımlayıcısı |
| `screenIndex` | Mevcut ekranın akıştaki konumu |
| `screensTotal` | Akıştaki toplam ekran sayısı |

<Details>
<summary>Olay örnekleri (Genişletmek için tıklayın)</summary>

```javascript
// onboardingStarted
{
  "name": "onboarding_started",
  "meta": {
    "onboarding_id": "onboarding_123",
    "screen_cid": "welcome_screen",
    "screen_index": 0,
    "total_screens": 4
  }
}

// screenPresented
{
    "name": "screen_presented",
    "meta": {
        "onboarding_id": "onboarding_123",
        "screen_cid": "interests_screen",
        "screen_index": 2,
        "total_screens": 4
    }
}

// screenCompleted
{
    "name": "screen_completed",
    "meta": {
        "onboarding_id": "onboarding_123",
        "screen_cid": "profile_screen",
        "screen_index": 1,
        "total_screens": 4
    },
    "params": {
        "element_id": "profile_form",
        "reply": "success"
    }
}

// secondScreenPresented
{
    "name": "second_screen_presented",
    "meta": {
        "onboarding_id": "onboarding_123",
        "screen_cid": "profile_screen",
        "screen_index": 1,
        "total_screens": 4
    }
}

// userEmailCollected
{
    "name": "user_email_collected",
    "meta": {
        "onboarding_id": "onboarding_123",
        "screen_cid": "profile_screen",
        "screen_index": 1,
        "total_screens": 4
    }
}

// onboardingCompleted
{
    "name": "onboarding_completed",
    "meta": {
        "onboarding_id": "onboarding_123",
        "screen_cid": "final_screen",
        "screen_index": 3,
        "total_screens": 4
    }
}
```
</Details>