Leanback kullanıcı arayüzü araç setindeki düzenler

TV ekranı genellikle 3, 5 metre uzaktan görüntülenir. Android destekli cihaz ekranlarının çoğundan çok daha büyük olsa da TV ekranı, daha küçük cihaz ekranıyla aynı ayrıntı ve renk düzeyini sağlamaz. Bu faktörler, faydalı ve keyifli bir kullanıcı deneyimi oluşturmak için TV cihazlarını göz önünde bulundurarak uygulama düzenlerini oluşturmanızı gerektirir.

TV için düzen temalarını kullanma

Android temaları, TV uygulamalarınızdaki düzenler için bir temel sağlayabilir. TV cihazında çalışması amaçlanan uygulama etkinliklerinizin görünümünü değiştirmek için bir tema kullanın. Bu bölümde, hangi temaların kullanılacağı açıklanmaktadır.

Leanback teması

androidx.leanback kitaplığında, TV etkinliklerine yönelik tutarlı bir görsel stil sağlayan Theme.Leanback teması bulunur. AndroidX Leanback sınıflarıyla oluşturulmuş tüm TV uygulamaları için bu temayı kullanın. Aşağıdaki kod örneğinde, bu temanın bir etkinliğe nasıl uygulanacağı gösterilmektedir:

<activity
  android:name="com.example.android.TvActivity"
  android:label="@string/app_name"
  android:theme="@style/Theme.Leanback">

NoTitleBar teması

Başlık çubuğu, telefon ve tabletlerdeki Android uygulamaları için standart bir kullanıcı arayüzü öğesidir, ancak TV uygulamaları için uygun değildir. AndroidX Leanback sınıflarını kullanmıyorsanız başlık çubuğunun görüntülenmesini engellemek için TV etkinliklerinize NoTitleBar temasını uygulayın. Bir TV uygulaması manifestinden alınan aşağıdaki kod örneğinde, başlık çubuğu görüntülenmesini kaldırmak için bu temanın nasıl uygulanacağı gösterilmektedir:

<application>
  ...
  <activity
    android:name="com.example.android.TvActivity"
    android:label="@string/app_name"
    android:theme="@android:style/Theme.NoTitleBar">
    ...
  </activity>
</application>

AppCompat temaları

Android mobil uygulamalarında, Theme.AppCompat temalarından biriyle birlikte AppCompatActivity kullanımı çok yaygındır. Bu kombinasyon, cihazda çalışan Android sürümüyle ilgili endişe duymadan çekilebilir tonlama gibi özellikleri kullanmanıza olanak tanır. Yalnızca Android TV'de çalışan bir uygulama geliştiriyorsanız AppCompatActivity kullanmayın. Çünkü bu uygulamanın sağladığı özellikler zaten Android TV'de kullanılabilir veya alakasızdır.

Android mobil ve Android TV arasında paylaşılan kod tabanına sahip bir uygulama derliyorsanız tema oluşturma nedeniyle bazı zorluklarla karşılaşabilirsiniz. AppCompatActivity ve çeşitli AppCompat widget'ları Theme.AppCompat kullanmanızı gerektirir. Leanback kullanıcı arayüzü araç seti parçaları ise FragmentActivity ve Theme.Leanback kullanmanızı bekler.

Android mobil ve Android TV için aynı temel etkinliği kullanmanız gerekiyorsa veya AppCompatImageView gibi AppCompat widget'larına dayalı özel görünümler kullanmak istiyorsanız Theme.AppCompat.Leanback temalarını kullanın. Bu temalar, size tüm AppCompat temalarını verir ve Leanback'e özel değerleri de sağlar.

Theme.AppCompat.Leanback temayı diğer temalarda olduğu gibi özelleştirebilirsiniz. Örneğin, Leanback kullanıcı arayüzü araç setinin OnboardingSupportFragment özelliklerine özgü değerleri değiştirmek isterseniz aşağıdakine benzer bir işlem yapın:

<style name="MyOnboarding" parent="Theme.AppCompat.Leanback.Onboarding">
    <item name="onboardingLogoStyle">@style/MyOnboardingLogoStyle</item>
    <item name="onboardingPageIndicatorStyle">@style/MyOnboardingPageIndicatorStyle</item>
</style>

Temel TV düzenleri oluşturma

TV cihazlarının düzenleri, büyük ekranlarda kullanılabilir ve etkili olduklarından emin olmak için bazı temel yönergelere uymak zorundadır. TV ekranları için optimize edilmiş düzenler oluşturmak üzere aşağıdaki ipuçlarını uygulayın:

• Yatay yönlü düzenler oluşturun. TV ekranları her zaman yatay modda görüntülenir.
• Ekrandaki gezinme denetimlerini ekranın sol veya sağ tarafına yerleştirin ve içerik için dikey alandan tasarruf edin.
• Parçalar kullanarak bölümlere bölünmüş kullanıcı arayüzleri oluşturun. Yatay ekran alanından daha iyi yararlanmak için ListView yerine GridView gibi görüntüleme grupları kullanın.
• Görünümleri düzenlemek için RelativeLayout veya LinearLayout gibi görüntüleme gruplarını kullanın. Bu yaklaşım, sistemin görünümlerin konumunu TV ekranının boyutuna, hizalamasına, en boy oranına ve piksel yoğunluğuna göre ayarlamasına olanak tanır.
• Kullanıcı arayüzünün karışık olmasını önlemek için düzen denetimleri arasına yeterli kenar boşluğu ekleyin.

Fazla tarama

TV'ye yönelik düzenler, izleyicilere tam ekran görüntü sunmak için TV standartlarının değişmesi nedeniyle bazı benzersiz gereksinimlere sahiptir. Bu nedenle TV cihazları, ekranın tamamının dolmasını sağlamak için uygulama düzeninin dış kenarını kırpabilir. Bu davranışa genellikle fazla tarama denir.

Kullanıcı tarafından her zaman görünür olması gereken ekran öğelerini, taramanın güvenli olduğu alanda konumlandırın. Bir düzene sol ve sağ kenarlarda% 48 dp, üst ve alt kenarlardan 27 dp'lik kenar boşluğu eklenmesi, düzendeki ekran öğelerinin aşırı tarama açısından güvenli alanda olmasını sağlar.

Kullanıcının doğrudan etkileşimde bulunmadığı arka plan ekranı öğelerini ayarlamayın ve öğeleri tarama açısından güvenli bir alana kırpmayın. Bu yaklaşım, arka plan ekranı öğelerinin tüm ekranlarda doğru görünmesini sağlar.

Aşağıdaki örnekte, arka plan öğeleri içerebilen bir kök düzeni ile% 5 kenar boşluğuna sahip olan ve aşırı tarama güvenli alandaki öğeler içerebilen iç içe yerleştirilmiş bir alt düzen gösterilmektedir:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="match_parent"
   android:layout_height="match_parent">

   <!-- Screen elements that can render outside the overscan-safe area go here. -->

   <!-- Nested RelativeLayout with overscan-safe margin. -->
   <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       android:layout_marginTop="27dp"
       android:layout_marginBottom="27dp"
       android:layout_marginLeft="48dp"
       android:layout_marginRight="48dp">

      <!-- Screen elements that need to be within the overscan-safe area go here. -->

   </RelativeLayout>

</RelativeLayout>

Dikkat: BrowseSupportFragment gibi AndroidX Leanback sınıflarını veya ilgili widget'ları kullanıyorsanız düzeninize fazladan tarama kenar boşlukları uygulamayın. Bu tür düzenlerde zaten aşırı tarama açısından güvenli kenar boşlukları vardır.

Kullanılabilir metin ve denetimler oluşturma

TV uygulamanızdaki metin ve kontrollerin uzaktan daha kolay görünmesini sağlamak için aşağıdaki ipuçlarını uygulayın:

• Metni, kullanıcıların hızlıca tarayabileceği küçük parçalara ayırın.
• Koyu arka plan üzerinde açık renk metin kullanın. Bu stil, TV'de daha kolay okunur.
• Çizgileri hem çok dar hem de çok geniş olan hafif yazı tipleri veya yazı tipleri kullanmaktan kaçının. Okunabilirliği artırmak için basit sans-serif yazı tipleri ve kenar yumuşatma kullanın.
• Android'in standart yazı tipi boyutlarını kullanın:

  <TextView
        android:id="@+id/atext"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_vertical"
        android:singleLine="true"
        android:textAppearance="?android:attr/textAppearanceMedium"/>
  

• Tüm görünüm widget'larınızın, ekrandan 3 metre uzakta oturan bir kişi tarafından net bir şekilde görülebilecek kadar büyük olmasını sağlayın. Bunu yapmanın en iyi yolu, mutlak boyutlandırma yerine düzene bağlı boyutlandırma, mutlak piksel birimleri yerine yoğunluktan bağımsız piksel (dp) birimlerini kullanmaktır. Örneğin, bir widget'ın genişliğini ayarlamak için piksel ölçümü yerine wrap_content, widget'ın kenar boşluğunu ayarlamak için de px değerleri yerine dp değerlerini kullanın.

Yoğunluktan bağımsız pikseller ve daha büyük ekran boyutlarını işlemeye yönelik bina düzenleri hakkında daha fazla bilgi için Ekran uyumluluğuna genel bakış bölümüne bakın.

TV için düzen kaynaklarını yönetme

Diğer tüm Android cihazlarda olduğu gibi TV'ler de farklı ekran boyutlarına sahiptir ve 720p, 1080p ve 4K dahil ancak bunlarla sınırlı olmamak üzere farklı çözünürlükleri destekler. Uygulamanızın farklı ekran boyutlarını desteklediğinden emin olun.

Farklı ekran boyutları ve çözünürlüklerin farklı piksel yoğunlukları vardır. Kullanıcı arayüzünüzün farklı ekran boyutları, çözünürlük ve piksel yoğunluklarındaki görünümünü korumak için kullanıcı arayüzü ölçümlerini, piksel yerine yoğunluktan bağımsız pikseller (dp) kullanarak tanımlayın. Farklı TV paneli çözünürlükleri için ekran piksel yoğunluğu aşağıda özetlenmiştir.

Panel çözünürlüğü	Ekran piksel yoğunluğu
720p	tvdpi
1080	xhdpi
4K	xxxhdpi

Daha fazla bilgi için Farklı piksel yoğunluklarını destekleme bölümüne bakın.

Büyük ekranlar için düzenleri ve kaynakları optimize etme hakkında daha fazla bilgi için Ekran uyumluluğuna genel bakış bölümüne bakın.

Kaçınılması gereken düzen kalıpları

TV cihazlarında düzgün çalışmayan sayfa düzeni oluşturma konusunda birkaç yaklaşım vardır. TV için düzen geliştirirken kaçınılması gereken bazı kullanıcı arayüzü yaklaşımlarını aşağıda bulabilirsiniz.

• Telefon veya tablet düzenlerini yeniden kullanma: Bir telefon veya tablet uygulamasındaki düzenleri değiştirmeden yeniden kullanmayın. Diğer Android cihaz form faktörleri için oluşturulan düzenler, TV cihazları için uygun değildir ve TV'de çalışacak şekilde basitleştirilmelidir.
• ActionBar kullanımı: İşlem çubuklarının telefon ve tabletlerde kullanılması önerilse de TV arayüzü için uygun değildir. İşlem çubuğu seçenekler menüsü veya açılır menünün kullanılması, bu tür bir menüye uzaktan kumandayla gitmenin zorluğundan dolayı TV uygulamalarında kesinlikle önerilmez.
• ViewPager kullanma: Ekranlar arasında kaydırma özelliği telefonda veya tablette çok işe yarayabilir, ancak bunu TV'de denemeyin.

TV'ye uygun düzenler tasarlama hakkında daha fazla bilgi edinmek için TV tasarım kılavuzuna bakın.

Büyük bit eşlemleri işleme

TV cihazları da, diğer Android cihazlar gibi sınırlı miktarda belleğe sahiptir. Uygulama düzeninizi çok yüksek çözünürlüklü görüntülerle oluşturur veya uygulamanız çalışırken çok sayıda yüksek çözünürlüklü resim kullanırsanız bu düzen hızla bellek sınırlarına maruz kalabilir ve bellekte hata oluşmasına neden olabilir. Çoğu durumda, uygulamanızdaki bit eşlemleri getirmek, kodunu çözmek ve görüntülemek için Glide kitaplığını kullanmanızı öneririz. Bit eşlemlerle çalışırken en iyi performansı elde etme hakkında daha fazla bilgi için genel Android grafikleriyle ilgili en iyi uygulamalarımıza bakın.

Etkili reklamcılık

Oturma odası ortamında, tam ekran olan ve 30 saniye içinde kapatılabilen video reklam çözümleri kullanmanızı öneririz. Android TV'deki reklam işlevlerine (ör. kapatma düğmeleri ve tıklama işlemleri) dokunma yerine D-pad kullanılarak erişilebilmelidir.

Android TV bir web tarayıcısı sağlamaz. Reklamlarınız, Android TV cihazları için onaylanmamış bir web tarayıcısını açmayı denememeli veya Google Play Store içeriğine yönlendirmemelidir.

Not: Sosyal medya hizmetlerine giriş yapmak için WebView sınıfını kullanabilirsiniz.

Ek kaynaklar

TV için tasarım