---
title: "Öğeleri isteğe bağlı olarak, gecikmeli veya animasyonlu göster ve gizle"
description: "Bir flow öğesini ekranı açıldığında, kullanıcılar dokunduğunda veya başka bir tetikleyici ateşlendiğinde gösterin ya da gizleyin. Değişikliği geciktirin veya öğenin soluklaşmasını, yükselmesini ya da belirmesini sağlayın."
---

> **AI agents**: to search Adapty docs faster and with fewer tokens, install the Adapty skills: `npx adapty skills install --yes`

Koşullu görünürlük kullanmadan bir öğeyi göstermek veya gizlemek için **Show element** ve **Hide element** eylemlerini kullanın.

- **Trigger**, öğenin görünmesine veya kaybolmasına neyin yol açacağını belirler — bir buton tıklaması veya ekran değişikliği.
- **Delay** ayarı, tetikleyici ile eylemin gerçekleşmesi arasındaki süreyi belirler.
- **Animation** ayarı, görsel efekti belirler (varsayılan: Fade in / out).

:::note
Ekranlar arasındaki geçişlerin [kendine özgü animasyonları](flow-screen-transitions) vardır. Kullanıcıları bir splash veya yükleme ekranından dokunmadan geçirmek için [bir **Navigate to Screen** eylemine gecikme ekleyebilirsiniz](flow-screen-transitions#move-users-to-another-screen-automatically).
:::

## Bir öğeyi göster veya gizle \{#show-or-hide-an-element\}

Varsayılan olarak, bir ekrandaki her öğe ekran açıldığında görünür ve kullanıcılar ekrandan ayrılana kadar görünür kalır. **Show element** ve **Hide element** eylemleriyle bir öğenin ne zaman ve nasıl görüneceğini veya kaybolacağını kontrol edersiniz. Örneğin:

- Ekran açıldıktan birkaç saniye sonra bir kapatma düğmesi gösterebilirsiniz.
- Bir başlığı anında göstermek yerine yavaşça belirterek getirebilirsiniz.
- Kullanıcılar ipucu üzerindeki kapatma simgesine dokunduğunda ipucunu gizleyebilirsiniz.

### Tetikleyiciler \{#triggers\}

Her tetikleyici farklı bir anda çalışır:

| An | Tetikleyici | Eklenecek yer |
|---|---|---|
| Ekran açıldığında | **On Screen Appear** | Ekrandaki herhangi bir öğeye, hatta aksiyonun gösterdiği öğeye bile |
| Kullanıcı dokunduğunda | **On Tap** | Kullanıcıların dokunduğu, buton gibi görünür herhangi bir öğeye |
| Video bittiğinde | **On Playback Finished** | Videoya |
| Bir [Geri sayım zamanlayıcısı](flow-timer) bittiğinde | **On Timer End** | Tetikleyicinin çalışması için **Visibility** ayarı **Show** olarak belirlenmiş zamanlayıcıya |
| Kullanıcılar bir giriş alanını değiştirdiğinde veya gönderdiğinde | **On Changed** veya **On Submit** | Giriş alanına |

### Kurulum \{#setup\}

Adımlar her tetikleyici için aynıdır:

1. İhtiyacınız olan andaki tablo girişini seçin (örneğin bir düğme).
2. **Interactions** panelinde, **Show element** veya **Hide element** eylemiyle [tetikleyici ekleyin](onboarding-actions#set-up-interactions).
3. **Elements** açılır menüsünden neyi göstereceğinizi veya gizleyeceğinizi seçin.
4. 3. adımdaki her öğeyi seçip **Design** panelini açın. Eylem öğeyi gösteriyorsa **Visibility** değerini **Hide**; gizliyorsa **Show** olarak ayarlayın. Birden fazla eylem aynı öğeyi değiştiriyorsa bu kuralı ilk çalışan eyleme göre uygulayın. **Show element** eylemi, zaten görünür olan bir öğe üzerinde herhangi bir etki yaratmaz. Gizli bir öğeyi daha sonra düzenlemek için **Layers** panelinde üzerine tıklayın: tuval onu göstermez.
5. Sonucu görmek için [flow'u bir cihazda test edin](paywall-device-compatibility-preview#preview-on-devices). Tuval, eylemleri çalıştırmaz. Cihazda gizli bir öğe alan kaplamaz; bu yüzden göründüğünde ve kaybolduğunda çevresindeki içerik kayar.

**Öğeyi göster** veya **Öğeyi gizle** eylemini ayarlamak için yukarıdaki adımları izleyin. Ardından ayarlarını değiştirin:

- [**Gecikme**](#show-an-element-a-few-seconds-after-the-screen-opens) — ekran açıldıktan birkaç saniye sonra bir öğeyi göster
- [**Animasyon**](#animate-an-element-as-it-appears-or-disappears) — bir öğe göründüğünde veya kaybolduğunda animasyon ekle

## Ekran açıldıktan birkaç saniye sonra bir öğeyi göster \{#show-an-element-a-few-seconds-after-the-screen-opens\}

**Delay** alanı, tetikleyici devreye girdikten sonra eylemin ne kadar bekleyeceğini belirler (en fazla 5000 ms). Örneğin, ekran açıldıktan üç saniye sonra bir kapat düğmesi göstermek için **On Screen Appear** tetikleyicisini kullanın ve **Delay** değerini 3000 ms olarak ayarlayın. Tam saniye değerleri kullanın: iOS'ta gecikme bir sonraki tam saniyeye yuvarlanır.

Gecikmeyi görmek için [flow'u bir cihazda test edin](paywall-device-compatibility-preview#preview-on-devices): **Edit action** penceresi bunu önizlemez.

5 saniyeden uzun bir gecikme için [Countdown timer sona erdiğinde öğeyi gösterin](flow-timer#delay-when-a-close-button-appears).

## Öğeyi göründüğünde veya kaybolduğunda canlandırma \{#animate-an-element-as-it-appears-or-disappears\}

**Edit action** penceresi aşağıdaki animasyon ayarlarına sahiptir:

| Ayar | Ne değiştirir |
|---|---|
| **Animation** | Elementin nasıl görüneceği veya kaybolacağı: **None**, **Fade in** veya **Fade out**, **Rise** ya da **Pop** |
| **Easing** | Animasyon sırasında hızın nasıl değişeceği: **Linear**, **Ease in**, **Ease out** veya **Ease in-out** |
| **Duration** | Animasyonun ne kadar süreceği, en fazla 5000 ms |
| **Distance** | **Rise** için: elementin ne kadar hareket edeceği, 1–200 px |
| **Start scale** | **Pop** için: elementin en küçük boyutu, tam boyutunun 0,1–0,99'u |

**Animasyonu düzenle** penceresi animasyonun önizlemesini döngü halinde oynatır. Kullanıcılar bir öğeye yalnızca tamamen göründükten sonra dokunabilir; bu nedenle butonlar için **Duration** değerini kısa tutun.

Birden fazla öğeyi hedef alan bir aksiyon, bu öğeleri aynı anda canlandırır. Öğeleri sırayla canlandırmak için her öğeye ayrı bir aksiyon ekleyin ve her birinin **Delay** değerini bir öncekinden daha yüksek ayarlayın.

## Animasyon ve gecikmenin uygulanmadığı durumlar \{#when-animation-and-delay-dont-apply\}

Üç durumda **Animation** ve **Delay** hiçbir etkisi olmaz:

- **[Koşullu görünürlük](onboarding-element-visibility) ayarlanmış bir öğe**: Öğeyi hedef alan eylemler, öğeyi anında gösterir veya gizler. Animasyon ya da gecikme eklemek için koşulu kaldırın: **Visibility** ayarını **Show** veya **Hide** olarak değiştirin.
- **Yeniden kullanılabilir bir bileşen**: Bir bileşenin içindeki öğe ya da bileşen içindeki bir eylemin hedefi anında görünür veya kaybolur.
- **Bir [alt sayfa (bottom sheet)](builder-containers#bottom-sheet)**: Sayfa, kendi hareketiyle ve gecikme olmaksızın açılıp kapanır.

Üç durumda da **Edit action** penceresi hâlâ **Animation** ve **Delay** seçeneklerini gösterir ve yayınlarken herhangi bir uyarı görmezsiniz.