Flow ve paywall'ları getirme - iOS

Flow’unuzu tasarladıktan sonra bunu mobil uygulamanızda gösterebilirsiniz. İlk adım, aşağıda açıklandığı gibi placement ile ilişkili flow veya paywall’ı ve görünüm yapılandırmasını getirmektir.

Başlamadan önce

İhtiyacınız olanlar:

• Adapty Kontrol Paneli’nde ürünler: Ürünlerinizi oluşturun.
• Ürünler içeren bir flow: Flow & Paywall Builder’da oluşturun ve ürünleri ona atayın.
• Bir placement: Placement oluşturun ve flow’unuzu buna atayın.
• Adapty SDK kurulu: iOS SDK kurulum kılavuzuna bakın.

Flow/paywall getirme

Eğer builder’da bir flow veya paywall tasarladıysanız, bunu kullanıcıya göstermek için mobil uygulama kodunuzda render etme konusunda endişelenmenize gerek yok. Bu tür bir flow veya paywall, içinde ne gösterileceğini ve nasıl gösterileceğini zaten kapsar. Bununla birlikte, placement aracılığıyla ID’sini, görünüm yapılandırmasını almanız ve ardından mobil uygulamanızda göstermeniz gerekir.

Flow veya paywall’ı ve görünüm yapılandırmasını mümkün olduğunca erken — ideal olarak göstermeden çok önce — getirin. Görünüm yapılandırmasını getirir getirmez, SDK arka planda görsellerini indirip önbelleğe almaya başlar. Ne kadar erken getirirseniz, bu indirmelerin tamamlanması için o kadar fazla zaman olur. Flow veya paywall’ı gösterdiğinizde, yapılandırması ve görselleri zaten önbelleğe alınmış ve görüntülenmeye hazır olabilir.

Bir flow veya paywall almak için getFlow metodunu kullanın:

do {
    let flow = try await Adapty.getFlow(placementId: "YOUR_PLACEMENT_ID")
    // the requested flow/paywall
} catch {
    // handle the error
}

Adapty.getFlow(placementId: "YOUR_PLACEMENT_ID") { result in
    switch result {
        case let .success(flow):
            // istenen flow/paywall
        case let .failure(error):
            // hatayı işle
    }
}

Parametreler:

Yanıt parametreleri:

Görünüm yapılandırmasını getirme

Flow veya paywall’ı getirdikten sonra, flow.hasViewConfiguration aracılığıyla bir görünüm yapılandırması içerip içermediğini kontrol edin. Bu işaret, placement’ın Adapty Kontrol Paneli’nde nasıl tasarlandığını ayırt eder:

• true — placement, Flow & Paywall Builder (bir flow) veya eski Paywall Builder (bir paywall) kullanılarak tasarlanmış. Adapty, kullanıcı arayüzünü sizin için oluşturur. Görünüm yapılandırmasını getirmek ve flow veya paywall’ı sunmak için aşağıdaki adımlarla devam edin.
• false — placement, Builder arayüzü olmayan özel bir paywall’dır.

getFlowConfiguration yöntemini kullanarak görünüm yapılandırmasını yükleyin.

guard flow.hasViewConfiguration else {
    // handle as remote config paywall
    return
}

let flowConfiguration = try await AdaptyUI.getFlowConfiguration(forFlow: flow)

Parametreler:

Yüklendikten sonra, flow/paywall’ı gösterin.

Varsayılan kitle için bir flow veya paywall alarak daha hızlı yükleme sağlayın

Genellikle flow’lar ve paywall’lar neredeyse anında yüklenir, dolayısıyla bu süreci hızlandırmak için özel bir şey yapmanız gerekmez. Ancak çok sayıda kitle ve placement’ınız varsa ve kullanıcılarınızın internet bağlantısı zayıfsa, bir flow veya paywall’ın yüklenmesi istediğinizden daha uzun sürebilir. Böyle durumlarda, hiçbir şey göstermek yerine pürüzsüz bir kullanıcı deneyimi sunmak amacıyla varsayılan bir flow veya paywall görüntülemek isteyebilirsiniz.

Bunu çözmek için, belirtilen placement’ın All Users kitlesi için flow ya da paywall’ı getiren getFlowForDefaultAudience metodunu kullanabilirsiniz. Ancak, önerilen yaklaşımın flow veya paywall’ı getFlow metoduyla getirmek olduğunu anlamak önemlidir; bu konunun ayrıntıları yukarıdaki Paywall Bilgisini Getirme bölümünde ele alınmıştır.

Adapty.getFlowForDefaultAudience(placementId: "YOUR_PLACEMENT_ID") { result in
    switch result {
        case let .success(flow):
            // the requested flow
        case let .failure(error):
            // handle the error
    }
}

Varlıkları özelleştirme

Paywall/flow’unuzdaki görsel ve videoları özelleştirmek için özel varlıkları uygulayın.

Hero görseller ve videolar önceden tanımlanmış ID’lere sahiptir: hero_image ve hero_video. Özel bir varlık paketinde, bu öğeleri ID’leri aracılığıyla hedefleyerek davranışlarını özelleştirebilirsiniz.

Diğer görseller ve videolar için Adapty kontrol panelinde özel bir ID ayarlamanız gerekir.

Örneğin şunları yapabilirsiniz:

• Bazı kullanıcılara farklı bir görsel veya video gösterin.
• Uzaktan yüklenen ana görsel yüklenirken yerel bir önizleme görseli gösterin.
• Video oynatılmadan önce bir önizleme görseli gösterin.
• Uygulamayla birlikte gelen medyayı gösterin; böylece ilk ekran herhangi bir indirme yapılmadan yüklenir. Bkz. Uygulama paketinden ilk ekran medyasını gösterme.
• Oynatıcının video yüklenmeden önce düzende yer ayırabilmesi için videonun piksel çözünürlüğünü belirtin (en boy oranı = width / height). Atlamak için nil geçin.

İşte özel varlıkları basit bir sözlük aracılığıyla nasıl sağlayabileceğinize dair bir örnek:

let customAssets: [String: AdaptyCustomAsset] = [
    // Show a local image using a custom ID
    "custom_image": .image(
        .uiImage(value: UIImage(named: "image_name")!)
    ),

    // Show a local preview image while a remote main image is loading
    "hero_image": .image(
        .remote(
            url: URL(string: "https://example.com/image.jpg")!,
            preview: UIImage(named: "preview_image")
        )
    ),

    // Show a local video with a preview image and a known resolution
    "hero_video": .video(
        .file(
            url: Bundle.main.url(forResource: "custom_video", withExtension: "mp4")!,
            preview: .uiImage(value: UIImage(named: "video_preview")!),
            resolution: CGSize(width: 1080, height: 1920)
        )
    ),
]

let flowConfig = try await AdaptyUI.getFlowConfiguration(
    forFlow: flow,
    assetsResolver: customAssets
)

Geliştirici tanımlı zamanlayıcıları ayarlama

Mobil uygulamanızda özel zamanlayıcılar kullanmak için AdaptyTimerResolver protokolünü uygulayan bir nesne oluşturun. Bu nesne, her özel zamanlayıcının nasıl render edileceğini tanımlar. İsterseniz bu protokole zaten uyan bir [String: Date] sözlüğünü doğrudan kullanabilirsiniz. İşte bir örnek:

@MainActor
struct AdaptyTimerResolverImpl: AdaptyTimerResolver {
    func timerEndAtDate(for timerId: String) -> Date {
        switch timerId {
        case "CUSTOM_TIMER_6H":
            Date(timeIntervalSinceNow: 3600.0 * 6.0) // 6 hours
        case "CUSTOM_TIMER_NY":
            Calendar.current.date(from: DateComponents(year: 2025, month: 1, day: 1)) ?? Date(timeIntervalSinceNow: 3600.0)
        default:
            Date(timeIntervalSinceNow: 3600.0) // 1 hour
        }
    }
}

Bu örnekte, CUSTOM_TIMER_NY ve CUSTOM_TIMER_6H, Adapty Kontrol Paneli’nde ayarladığınız geliştirici tanımlı zamanlayıcıların Timer ID’leridir. timerResolver, uygulamanızın her zamanlayıcıyı doğru değerle dinamik olarak güncellemesini sağlar. Örneğin:

• CUSTOM_TIMER_NY: Zamanlayıcının bitiş anına, örneğin Yılbaşı’na kadar kalan süre.
• CUSTOM_TIMER_6H: Kullanıcı paywall’ı açtığında başlayan 6 saatlik sürede kalan zaman.

Adapty Kontrol Paneli’nde Paywall Builder ile paywallınızın görsel kısmını tasarladıktan sonra, bunu mobil uygulamanızda gösterebilirsiniz. İlk adım, aşağıda açıklandığı gibi placement ile ilişkilendirilmiş paywall’ı ve görünüm yapılandırmasını almaktır.

Bu konunun Paywall Builder ile özelleştirilmiş paywalllar için geçerli olduğunu unutmayın. Paywalllarınızı manuel olarak uyguluyorsanız, Remote config paywalllar için paywallları ve ürünleri getirme bölümüne bakın.

Paywall Builder ile tasarlanan paywallı getirme

Paywall Builder kullanarak bir paywall tasarladıysanız, onu kullanıcıya göstermek için mobil uygulama kodunuzda ayrıca render etmenize gerek yoktur. Böyle bir paywall, hem paywallda neyin gösterileceğini hem de nasıl gösterileceğini içerir. Bununla birlikte, ID’sini placement aracılığıyla, görünüm yapılandırmasını ise ayrıca almanız ve ardından uygulamanızda sunmanız gerekir.

En iyi performansı sağlamak için, kullanıcıya sunmadan önce görsellerin indirilmesine yeterince zaman tanımak amacıyla paywallı ve görünüm yapılandırmasını mümkün olduğunca erken almanız önemlidir.

Paywall almak için getPaywall metodunu kullanın:

do {
    let paywall = try await Adapty.getPaywall("YOUR_PLACEMENT_ID")
    // the requested paywall
} catch {
    // handle the error
}

Adapty.getPaywall(placementId: "YOUR_PLACEMENT_ID", locale: "en") { result in
    switch result {
        case let .success(paywall):
            // the requested paywall
        case let .failure(error):
            // handle the error
    }
}

Parametreler:

Yanıt parametreleri:

Paywall Builder ile tasarlanmış paywallın görünüm yapılandırmasını çekme

Paywall’ı çektikten sonra, Paywall Builder kullanılarak oluşturulduğunu gösteren bir görünüm yapılandırması içerip içermediğini kontrol edin. Bu, paywall’ı nasıl göstereceğiniz konusunda size rehberlik eder. Görünüm yapılandırması mevcutsa Paywall Builder paywall’ı olarak ele alın; değilse remote config paywall’ı olarak işleyin.

Görünüm yapılandırmasını yüklemek için getPaywallConfiguration metodunu kullanın.

guard paywall.hasViewConfiguration else {
    //  use your custom logic
    return
}

do {
    let paywallConfiguration = try await AdaptyUI.getPaywallConfiguration(
            forPaywall: paywall,
            products: products
    )
    // use loaded configuration
} catch {
    // handle the error
}

Parametreler:

Yüklendikten sonra, paywall’ı gösterin.

Daha hızlı getirmek için varsayılan kitle paywallını alma

Paywalllar genellikle neredeyse anında getirilir, bu nedenle bu süreci hızlandırmak konusunda endişelenmenize gerek yoktur. Ancak çok sayıda kitle ve paywalliniz varsa ve kullanıcılarınızın internet bağlantısı zayıfsa, paywall getirme işlemi istediğinizden daha uzun sürebilir. Bu gibi durumlarda, hiç paywall göstermemek yerine sorunsuz bir kullanıcı deneyimi sağlamak için varsayılan bir paywall görüntülemek isteyebilirsiniz.

Bunu çözmek için, belirtilen placement’ın All Users kitlesine ait paywall’unu getiren getPaywallForDefaultAudience metodunu kullanabilirsiniz. Ancak önerilen yaklaşımın, yukarıdaki Paywall Bilgisini Getirme bölümünde ayrıntılı olarak açıklandığı gibi getPaywall metoduyla paywall getirmek olduğunu bilmek önemlidir.

Adapty.getPaywallForDefaultAudience(placementId: "YOUR_PLACEMENT_ID", locale: "en") { result in
    switch result {
        case let .success(paywall):
            // the requested paywall
        case let .failure(error):
            // handle the error
    }
}

Varlıkları özelleştirme

Paywallınızdaki görselleri ve videoları özelleştirmek için özel varlıkları uygulayın.

Hero görseller ve videolar önceden tanımlanmış ID’lere sahiptir: hero_image ve hero_video. Özel bir varlık paketinde, bu öğeleri ID’leriyle hedefler ve davranışlarını özelleştirirsiniz.

Diğer görseller ve videolar için Adapty kontrol panelinde özel bir ID belirlemeniz gerekir.

Örneğin şunları yapabilirsiniz:

• Bazı kullanıcılara farklı bir görsel veya video göstermek.
• Uzak ana görsel yüklenirken yerel bir önizleme görseli göstermek.
• Bir video başlamadan önce önizleme görseli göstermek.

Özel varlıkları basit bir sözlük aracılığıyla nasıl sağlayabileceğinize dair bir örnek:

let customAssets: [String: AdaptyCustomAsset] = [
    // Özel bir kimlik kullanarak yerel bir görsel göster
    "custom_image": .image(
        .uiImage(value: UIImage(named: "image_name")!)
    ),

    // Uzak ana görsel yüklenirken yerel bir önizleme görseli göster
    "hero_image": .image(
        .remote(
            url: URL(string: "https://example.com/image.jpg")!,
            preview: UIImage(named: "preview_image")
        )
    ),

    // Önizleme görseli olan yerel bir video göster
    "hero_video": .video(
        .file(
            url: Bundle.main.url(forResource: "custom_video", withExtension: "mp4")!,
            preview: .uiImage(value: UIImage(named: "video_preview")!)
        )
    ),
]

let paywallConfig = try await AdaptyUI.getPaywallConfiguration(
    forPaywall: paywall,
    assetsResolver: customAssets
)

Geliştirici tanımlı zamanlayıcıları ayarlama

Mobil uygulamanızda özel zamanlayıcılar kullanmak için AdaptyTimerResolver protokolünü uygulayan bir nesne oluşturun. Bu nesne, her özel zamanlayıcının nasıl görüntüleneceğini tanımlar. Tercih ederseniz, bu protokole zaten uygun olduğu için doğrudan bir [String: Date] sözlüğü de kullanabilirsiniz. İşte bir örnek:

@MainActor
struct AdaptyTimerResolverImpl: AdaptyTimerResolver {
    func timerEndAtDate(for timerId: String) -> Date {
        switch timerId {
        case "CUSTOM_TIMER_6H":
            Date(timeIntervalSinceNow: 3600.0 * 6.0) // 6 saat
        case "CUSTOM_TIMER_NY":
            Calendar.current.date(from: DateComponents(year: 2025, month: 1, day: 1)) ?? Date(timeIntervalSinceNow: 3600.0)
        default:
            Date(timeIntervalSinceNow: 3600.0) // 1 saat
        }
    }
}

Bu örnekte, CUSTOM_TIMER_NY ve CUSTOM_TIMER_6H, Adapty Kontrol Paneli’nde ayarladığınız geliştirici tanımlı zamanlayıcıların Timer ID’leridir. timerResolver, uygulamanızın her zamanlayıcıyı doğru değerle dinamik olarak güncellemesini sağlar. Örneğin:

• CUSTOM_TIMER_NY: Yılbaşı gibi zamanlayıcının bitiş anına kadar kalan süre.
• CUSTOM_TIMER_6H: Kullanıcının paywall’ı açtığı andan itibaren başlayan 6 saatlik sürede kalan zaman.