1080×1920 Mobil Arayüzü Farklı Telefonlara Uyarlama

Konu, Amaç ve Beklenen Sonuç

Unity UI uyumluluğunun temeli, Canvas ölçekleme ile RectTransform anchor/pivot kararlarını birlikte kullanmaktır. Canvas Scaler genel ölçeği belirler; anchor’lar ise elemanın ebeveynine göre nerede kalacağını tanımlar. Safe Area, Layout Group ve Content Size Fitter gibi bileşenler belirli sorunları çözer; hepsini aynı RectTransform üzerinde kontrolsüz birleştirmek yerleşim döngülerine veya beklenmeyen boyutlara yol açabilir.

Adım Adım Uygulama

1. Adım

1. Hedef yönü ve tasarım referans çözünürlüğünü belirle. Portre mobil arayüzde 1080×1920 bir tasarım referansı olabilir; bu değer fiziksel cihaz çözünürlüğü zorunluluğu değildir.

2. Adım

2. Root Canvas üzerinde Canvas Scaler’ı Scale With Screen Size yap; Reference Resolution ve Match Width Or Height değerini içerik davranışına göre test ederek seç.

3. Adım

3. Her UI öğesinde anchor’ı görsel yerleşim niyetine göre ayarla: köşe butonu köşeye, tam genişlik panel yatay stretch’e, merkez modal merkeze bağlanmalıdır.

4. Adım

4. Çentik ve sistem alanları için Screen.safeArea verisini üst seviye güvenli alan container’ına uygula; arka plan gibi taşması gereken görselleri bu container dışında bırak.

5. Adım

5. Dinamik listelerde Vertical/Horizontal/Grid Layout Group ve Content Size Fitter sorumluluklarını ayır. Scroll View içinde yalnız görünür öğeler çok fazlaysa sanallaştırma/pooling düşün.

6. Adım

6. Metin için TextMeshPro autosize değerlerini sınırsız bırakma; uzun TR/EN metin, büyük erişilebilirlik metni ve dar ekran senaryolarını dene.

7. Adım

7. Game View/Device Simulator ön izlemesine ek olarak gerçek cihazlarda 16:9, 19.5:9/20:9 ve tablet oranlarını test et.

Uygulamalı Örnek

1080×1920 referanslı bir menüde üst para paneli top-stretch, alt navigasyon bottom-stretch, orta içerik full-stretch anchor kullanabilir. Match değeri 0.5 başlangıç noktası olarak denenir; ancak karar 16:9 ve 20:9 ekranlarda gerçek taşma/boşluk ölçümüne göre verilir. Çentikli cihazda yalnız etkileşimli içerik safe-area container içinde tutulur. Bu örneği kendi projenize uyarlarken değerleri ezberlemek yerine “1080×1920 Mobil Arayüzü Farklı Telefonlara Uyarlama” konusundaki aynı neden-sonuç ilişkisini koruyun.

Yaygın Hatalar ve Nedenleri

1. Sadece Canvas Scaler ayarlayıp anchor’ları varsayılan bırakmak.

2. Match değerini rastgele seçmek ve uç en-boy oranlarında kontrol etmemek.

3. Safe Area’yı bütün arka plana uygulayıp istenmeyen boş şeritler oluşturmak.

4. Layout Group ve Content Size Fitter ile aynı ekseni birden fazla bileşene yönettirmek.

5. Uzun metin ve yerelleştirmeyi sonradan test etmek.

6. Scroll View içine yüzlerce aktif öğe koyup performans ölçmemek.

Son Kontrol ve Doğrulama

1. En dar ve en uzun ekran oranında üst/alt taşma kontrolü yap. Sonuç “1080×1920 Mobil Arayüzü Farklı Telefonlara Uyarlama” için somut kabul ölçütü olarak kullanılmalıdır.

2. Cihazı döndürme destekleniyorsa orientation değişiminde layout’u doğrula.

3. TR ve EN’de en uzun buton/metin değerlerini kullan.

4. Safe Area olan ve olmayan iki cihazda ekran görüntüsü karşılaştır.

5. Profiler/UI modülüyle büyük listelerin layout/rebuild maliyetini ölç.

Kısa Sonuç

1080×1920 Mobil Arayüzü Farklı Telefonlara Uyarlama için kaliteli sonuç, aracı veya ayarı bir kez kullanmaktan değil; doğru sorumluluğu seçip uygulamayı gerçek koşulda doğrulamaktan gelir.

Kaynaklar

Bu makaledeki teknik kavramları doğrulamak ve sürüme bağlı ayrıntıları kontrol etmek için aşağıdaki birincil/resmî kaynaklar kullanılmıştır. Yazılım arayüzleri ve platform gereksinimleri zamanla değişebileceği için özellikle yayın/build/SEO gibi güncel konularda son sürüm dokümantasyonunu kontrol edin.

1. Canvas – Unity Scripting API: https://docs.unity3d.com/kr/current/ScriptReference/Canvas.html

2. Canvas Scaler – Unity Manual: https://docs.unity3d.com/ja/2023.2/Manual/script-CanvasScaler.html

3. Designing UI for Multiple Resolutions – Unity: https://docs.unity3d.com/cn/2018.3/Manual/HOWTO-UIMultiResolution.html

4. Rect Transform – Unity Manual: https://docs.unity3d.com/6000.0/Documentation/Manual/class-RectTransform.html

5. Auto Layout – Unity Manual: https://docs.unity3d.com/6000.0/Documentation/Manual/UIAutoLayout.html

6. Event System – Unity Manual: https://docs.unity3d.com/6000.0/Documentation/Manual/EventSystem.html

7. Profiler Window – Unity Manual: https://docs.unity3d.com/cn/current/Manual/ProfilerWindow.html

8. Profiler API – Unity: https://docs.unity3d.com/cn/6000.0/ScriptReference/Profiling.Profiler.html