Unity UI'da Sonsuz Kaydırma Nasıl Uygulanır?

Kullanıcı arayüzünde sonsuz kaydırma, içeriğin (listeler, ızgaralar veya kaydırma görünümleri gibi) dinamik olarak yüklendiği ve kullanıcı kaydırdıkça ek öğeleri görüntüleyerek sınırsız içerik yanılsaması yarattığı bir tekniği ifade eder. Bu özellik, kullanıcıyı tüm öğelerle aynı anda yormadan büyük veri kümeleri veya koleksiyonlar sunmak için uygulamalarda ve oyunlarda yaygın olarak kullanılır.

Bu derste, Unity'nin kullanıcı arayüzü çerçevesinde verimli bir sonsuz kaydırma sisteminin nasıl uygulanacağını öğreneceğiz. Kaydırma görünümünü ayarlamayı, içeriği dinamik olarak yüklemeyi, kaydırma olaylarını yönetmeyi ve performansı optimize etmeyi ele alacağız.

Adım 1: Projeyi Kurma

Unity'te yeni bir 2D veya 3D proje oluşturarak başlayın. Projenize "InfiniteScrollingUI" adını verin. Window -> Package Manager'yi seçerek ve önceden kurulmamışsa UIElements ve TextMeshPro paketlerini yükleyerek gerekli kullanıcı arayüzü bileşenlerinin kurulu olduğundan emin olun.

Adım 2: Kaydırma Görünümünü Oluşturma

Unity Düzenleyicide:

1. Hiyerarşi penceresine sağ tıklayın ve UI -> ScrollView seçeneğini seçin.
2. Viewport ve Content oyun nesnelerini bulmak için Hiyerarşideki ScrollView'ı genişletin.
3. Content oyun nesnesinden varsayılan Text bileşenini silin.

Adım 3: Öğe Şablonunu Ayarlama

Kaydırma görünümünde görüntülenecek öğeler için bir kullanıcı arayüzü şablonu oluşturun:

1. İçerik oyun nesnesine sağ tıklayın ve UI -> Metin'yi seçin. Bu sizin öğe şablonunuz olacaktır.
2. Metin öğesinin görünümünü tasarımınıza uyacak şekilde özelleştirin (örneğin, yazı tipi boyutu, renk).
3. Oyunda görünmesini önlemek için Text bileşeninin işaretini kaldırarak öğe şablonunu devre dışı bırakın.

Adım 4: Sonsuz Kaydırma Davranışının Komut Dosyasını Oluşturma

Öğelerin kaydırma görünümünde dinamik olarak yüklenmesini ve görüntülenmesini yönetmek için bir komut dosyası oluşturun. Assets klasörüne sağ tıklayın, Create -> C# Script seçeneğini seçin ve "InfiniteScrollingUI" olarak adlandırın. Kod düzenleyicinizde açmak için komut dosyasına çift tıklayın.

// InfiniteScrollingUI.cs
using UnityEngine;
using UnityEngine.UI;
using System.Collections.Generic;

public class InfiniteScrollingUI : MonoBehaviour
{
    public RectTransform itemTemplate;
    public RectTransform content;

    private List items = new List();

    void Start()
    {
        InitializeItems();
    }

    void InitializeItems()
    {
        for (int i = 0; i < 20; i++)
        {
            RectTransform newItem = Instantiate(itemTemplate, content);
            newItem.gameObject.SetActive(true);
            newItem.GetComponent().text = "Item " + i;
            items.Add(newItem);
        }
    }

    public void OnScroll(Vector2 scrollDelta)
    {
        if (scrollDelta.y < 0 && content.anchoredPosition.y < -itemTemplate.rect.height * (items.Count - 10))
        {
            RectTransform firstItem = items[0];
            items.RemoveAt(0);
            firstItem.anchoredPosition = items[items.Count - 1].anchoredPosition + Vector2.up * itemTemplate.rect.height;
            items.Add(firstItem);
        }
        else if (scrollDelta.y > 0 && content.anchoredPosition.y > 0)
        {
            RectTransform lastItem = items[items.Count - 1];
            items.RemoveAt(items.Count - 1);
            lastItem.anchoredPosition = items[0].anchoredPosition - Vector2.up * itemTemplate.rect.height;
            items.Insert(0, lastItem);
        }
    }
}

InfiniteScrollingUI komut dosyasını ScrollView oyun nesnesine ekleyin. Denetçi penceresinde, Öğe Şablonu ve Content RectTransforms'ları ilgili alanlara atayın.

Adım 5: Kaydırma Olaylarını Yönetme

Kaydırma olaylarını algılamak için ScrollView'ye bir olay tetikleyicisi ekleyin ve InfiniteScrollingUI betiğinin OnScroll yöntemini çağırın.

1. Hiyerarşide ScrollView oyun nesnesini seçin.
2. Denetçi penceresinde Bileşen Ekle'ye tıklayın ve Olay Tetikleyici'yi seçin.
3. Yeni Etkinlik Türü Ekle'yi tıklayın ve Kaydırma'yi seçin.
4. ScrollView oyun nesnesini Hiyerarşiden yeni kaydırma olayının Object alanına sürükleyin.
5. Event açılır menüsünde InfiniteScrollingUI -> OnScroll öğesini seçin.

Adım 6: Sonsuz Kaydırma Sisteminin Test Edilmesi

Sonsuz kaydırma sisteminizi test etmek için Unity içindeki oynat düğmesine basın. Öğelerin dinamik olarak yüklendiğini ve geri dönüştürüldüğünü görmek için ScrollView'de yukarı ve aşağı kaydırın.

Çözüm

Unity kullanıcı arayüzünde sonsuz kaydırma sistemi uygulamak, büyük veri kümelerini işlemek ve kullanıcı arayüzü yanıt verme hızını artırmak için değerli bir tekniktir. Dinamik içerik yükleme ve geri dönüşümden yararlanarak, ister listeler, ızgaralar veya diğer kullanıcı arayüzü bileşenleri arasında geziniyor olsunlar, kullanıcılar için kusursuz bir tarama deneyimi oluşturabilirsiniz.

Sonsuz kaydırma sistemini özel proje gereksinimlerinize göre uyarlamak için farklı kullanıcı arayüzü düzenlerini, kaydırma hızlarını ve optimizasyonları deneyin. Bu yaklaşım yalnızca kullanıcı katılımını artırmakla kalmaz, aynı zamanda uygulamanızın farklı cihaz ve platformlarda verimli bir şekilde performans göstermesini de sağlar.