Xamarin'de tvOS Simgeleri ve Görüntüleriyle Çalışma

Makale
03/16/2017

Büyüleyici simgeler ve görüntüler oluşturmak, Apple TV uygulamalarınız için çevreleyici bir kullanıcı deneyimi geliştirmenin kritik bir parçasıdır. Bu kılavuzda, Xamarin.tvOS uygulamalarınız için gerekli grafik varlıklarını oluşturmak ve eklemek için gereken adımlar ele alınacaktır:

Görüntüyü Başlat - Uygulamanız ilk kez başlatıldığında bir başlatma görüntüsü görüntülenir ve başlatma tamamlandıktan sonra uygulamanın ilk ekranıyla değiştirilir.
Katmanlı Görüntüler - Apple TV'ye özel olarak, Apple'ın yeni Katmanlı Görüntüleri, seçili öğeler için bir 3B efekt oluşturmak için Parallax Efekti ile çalışır. Katmanlı Görüntüler oluşturmanın çeşitli yolları vardır.
Uygulama Simgesi - Simgeler yalnızca Apple TV Giriş ekranı için değil App Store için de gereklidir. Bunlar Katmanlı Görüntü olarak sağlanmalıdır.
Üst Raf Görüntüsü - Uygulamanız Giriş ekranının Üst Satırına yerleştirilirse uygulamanızın özelliklerini vurgulamak için Bir Üst Raf Görüntüsü gerekir. İsteğe bağlı olarak, uygulamanızdaki içeriği vurgulamak için Dinamik Üst Raf İçeriği sağlayabilirsiniz.
Game Center Görüntüleri - Uygulamanız bir oyunsa ve Game Center kullanıyorsa, birkaç ek görüntü gerekir.
Xamarin.tvOS Proje Görüntülerini Ayarlama - Xamarin.tvOS uygulamanız için Görüntü ve Uygulama Simgesini Başlat'ı ayarlamak için gereken adımları kapsar.

Önemli

Apple TV'deki tüm görüntüler 1x çözünürlüktedir (@1x) ve yalnızca bu boyuttaki görüntüleri kullanmanız gerekir. Daha büyük, daha yüksek çözünürlüklü grafiklerin indirilmesi ve daha fazla bellek ve depolama alanı kullanılması zaman almakla kalmaz, çalışma zamanında dinamik olarak yeniden ölçeklendirilmeleri gerekir ve çizim performansını olumsuz etkiler.

Görüntüyü Başlat

Görüntü Başlat, Xamarin.tvOS uygulamanız Apple TV'de ilk kez başlatıldığında görüntülenen ilk şeydir ve bu nedenle her tvOS uygulamasının bir Başlatma Görüntüsü sağlaması gerekir.

Görüntü Başlat hızlı görünür ve uygulamanızın hızlı ve duyarlı olduğu izlenimi verir. Apple TV, Görüntüyü Başlat'ı kısa bir süre sonra uygulamanızın ilk ekranıyla değiştirir.

Lansman Görüntüleri reklamlar veya artistik ifadeler için bir fırsat değildir, yalnızca uygulamanızın hızlı bir şekilde başlatıldığı ve kullanıma hazır olduğu izlenimini vermek için mevcuttur.

Görüntü Boyutunu Başlat	Notlar
1920x1080 px	Yalnızca katmanlı olmayan .png dosyaları

Apple, uygulamanızın Başlatma Görüntüsünü tasarlamak için aşağıdaki önerileri yapar:

İlk Ekranla Neredeyse Aynı - Başlatma Ekranınız, uygulamanızın ilk ekranına mümkün olduğunca yakın olmalıdır. Farklı grafikler veya öğeler dahil olmak, ilk ekran göründüğünde rahatsız edici bir "flash" ile sonuçlanabilir.
Metin Kullanmaktan Kaçının - Başlatma Görüntüleri statiktir ve bu nedenle görüntülenmeden önce yerelleştirilmeyecektir.
Downplay Launch - Apple TV kullanıcıları sık sık uygulama değiştirdiğinden, uygulama başlatma işlemine dikkat çekmemelisiniz.
Reklam veya Marka Yok - Başlatma Resminiz, uygulamanızın ilk ekranının statik bir parçası olmadığı sürece Hakkında ekranı olarak kullanılmamalı veya herhangi bir marka eklememelidir. Reklamlar kesinlikle yasaktır.

Başlat Görüntüsünü Ayarlama

tvOS projeniz için Görüntüyü Başlat'ı ayarlamak için lütfen aşağıdakileri yapın:

Çözüm Gezgini düzenlemek üzere açmak için çift tıklayınAssets.xcassets:
Varlık Düzenleyicisi'nde varlığa LaunchImages tıklayın:
1x Apple TV girdisine tıklayın ve Resmi Başlat'ı seçin veya isteğe bağlı olarak dosya sisteminden yeni bir görüntü sürükleyin:
Değişikliklerinizi kaydedin.

Katmanlı Görüntüler

Apple TV'de yeni eklenen Katmanlı Görüntüler, Parallax Efekti ile birlikte çalışarak, kullanıcıyı kanepede odadaki ekrandaki içeriğe zihinsel olarak bağlı tutmaya yardımcı olan bir 3B efekt üretir.

Katmanlı Görüntüler, tam bir görüntü oluşturmak için birleştirilen iki (2) ila beş (5) ayrı katman içerir. Arka plan katmanı dışında, her katman derinlik yanılsaması oluşturmak için saydamlık ile birlikte Z sırasını kullanır. Kullanıcı Katmanlı Görüntü ile etkileşime geçtiğinde, bu etkiyi oluşturmak için daha yüksek Z sıralı katmanlar ölçeklendirilir ve çakışılır.

Önemli

Katmanlı Görüntüler, uygulamanızın simgeleri için gereklidir ve diğer Odaklanabilir Öğeler (Üst Raf Görüntüsü gibi) için isteğe bağlıdır. Ancak Apple, uygulamanıza odaklanabilecek tüm resimler için Katmanlı Görüntüler kullanılmasını önerir.

Apple, Katmanlı Görüntülerinizi tasarlamak için aşağıdaki önerileri yapar:

Arka Plan Katmanını Opak Yapma - Apple TV'de Katmanlı Görüntü'nüzü kullanmaya çalıştığınızda arka plan katmanınızın (katman 1) donuk olması gerekir . Diğer tüm katmanlar, 3B efekti geliştirmek için birden çok saydamlık düzeyi içerebilir.
Ön Plan, Orta ve Arka Plan Öğelerini Yalıtma - Öne çıkan öğeleri (oyun karakterleri gibi) ön plana yerleştirin, ikincil öğeler veya gölgeler için ortayı kullanın. Son olarak, üst katmanlarınıza bir aşama sağlamak için nötr bir arka plan ekleyin.
Metni Ön Planda Tut - Metninizin daha yüksek düzeyler tarafından gizlenmesini istemiyorsanız, genellikle en üst katmanda olmalıdır.
Basit Katmanlama Kullanma - Parallax Efekti hafif olacak şekilde tasarlanmıştır, bu nedenle jarring, gerçek dışı etkileri önlemek için katmanlarınızı en az düzeyde tutun.
Kasa Bölgesi Ekleme - Parallax Efekti sırasında üst katmanlar kırpılabildiğinden, her katmana bir Kasa Bölgesi kenarlı kenarlık oluşturmanız gerekir. İçeriğinizi katmanların kenarına çok yakın hale getirdiğinizde kırpılabilir. Üst katmanlar, alt katmanlara göre daha fazla ölçeklendirme ve kırpma deneyimi yaşar. Aşağıdaki Resim Katmanlarını Boyutlandırma bölümüne bakın.
Önizleme Sık Sık - İstenen 3B efektin oluştuğundan ve tek tek katmanlardaki içeriğin kırpılmadığından emin olmak için Katmanlı Görüntüler sık sık önizlenmelidir. Katmanlı Resimlerinizin beklendiği gibi işlenmek için gerçek Apple TV donanımında önizlemesini görüntülemeniz gerekir.

Mümkün olduğunda, her zaman Katmanlı Görüntülerinizi görüntülemek için yerleşik UIKit denetimleri kullanmanız gerekir; bunlar odakta olduğunda Parallax Efekti'ni otomatik olarak alır.

Görüntü Katmanlarını Boyutlandırma

Katmanlı Görüntünüzü oluşturacak her katmana bir Kasa Bölgesi kenarını eklemeyi unutmamanız önemlidir. Parallax Efekti sırasında tek tek katmanlar ölçeklendirilebildiğinden ve kırpılabildiğinden, katmanın kenarına çok yakınsa katmanların içeriği kırpılabilir:

Katmanlı Görüntüler Oluşturma

tvOS, Katmanlı Görüntüler ile aşağıdaki biçimlerde çalışır:

CAR Files - Bu Apple tarafından oluşturulan özel bir Varlık Kataloğu biçimidir. DOĞRUDAN CAR dosyaları oluşturmazsınız, bunlar herhangi bir LSR dosyasından derleme zamanında oluşturulur ve uygulama paketinize eklenir.
LSR Görüntüleri - Bu Apple tarafından oluşturulan özel bir görüntü biçimidir. Katmanlı Görüntüleri LSR biçiminde oluşturmak ve önizlemek için Parallax Exporter Adobe Photoshop Eklentisini veya Parallax Önİzleyicisini kullanın.
Assets.xcassets - Bir Varlık Kataloğu'nda bulunan ve derleme zamanında BIR CAR veya LSR biçimli Katmanlı Görüntüde derlenecek iki (2) ile beş (5) standart .png biçimli görüntü arasında.
LCR Dosyaları - Bu Apple tarafından oluşturulan özel bir dosya biçimidir. LCR dosyaları, içerik sunucularınızdan birinden indirilen ek içerik olarak kullanılmak üzere tasarlanmıştır. LCR dosyası hiçbir zaman uygulama paketinize dahil edilmemelidir. LCR dosyaları, Xcode ile birlikte gelen layerutil komut satırı aracı kullanılarak LSR veya Photoshop dosyalarından oluşturulur.

Parallax Önİzleyicisi

Apple, Uygulama Simgeleri ve isteğe bağlı Odaklanabilir Öğeler için gereken Katmanlı Görüntüleri önizlemek için Parallax Önizleyicisi'ni oluşturmuş ve oluşturmuştur. Önİzleyici, tamamlanmış Katmanlı Görüntüyü oluşturan her katmanı gösterir:

Katmanlı Görüntünün önizlemesini görüntülerken fareyi kullanarak görüntüyü döndürebilir ve Parallax Efektinin önizlemesini görüntüleyebilirsiniz. + Katman eklemek ve kaldırmak için (artı) ve - (eksi) düğmelerini kullanın.

Yeni bir Katmanlı Görüntü oluştururken, LSR biçiminde dışarı aktarılabilir ve uygulamanızın paketine eklenebilir.

Katmanlı Görüntüler oluşturma ve önizleme hakkında daha fazla bilgi için lütfen tvOS için Uygulama Programlama Kılavuzu'nun Apple'ın Parallax Artwork Oluşturma bölümüne bakın.

Uygulama Simgeleri

Xamarin.tvOS uygulamanız yalnızca Apple TV Giriş ekranı için bir Uygulama Simgesi değil, aynı zamanda App Store için de bir simge gerektirir. Uygulama Simgesi, potansiyel kullanıcınız üzerinde harika bir izlenim bırakacak ilk değişikliğinizdir ve uygulamanızın amacını bir bakışta iletmeniz gerekir.

Her uygulama, Uygulama Simgesinin hem küçük hem de büyük bir sürümünü sağlamalıdır. Küçük simge, uygulama yüklendiğinde Apple TV Giriş ekranında kullanılır. Büyük sürüm App Store tarafından kullanılır. Büyük Uygulama Simgesi, küçük simge sürümünün genel görünümünü taklit etmelidir.

Küçük Simge	Çözüm	Çözüm
Gerçek Boyut	400x240px	1280x768px
Kasa Bölge Boyutu	370x222px
Odaklanmamış Boyut	300x180px
Odaklanmış Boyut	370x222px

Önemli

Uygulama Simgeleriniz Katmanlı Görüntüler olarak sağlanmalıdır. Daha fazla ayrıntı için lütfen yukarıdaki Katmanlı Görüntü bölümüne bakın.

Apple, Uygulama Simgelerinizi oluşturmak için aşağıdaki önerileri sağlar:

Tek Odak Noktası Sağlayın – Simgenizi doğrudan simgenin ortasına yerleştirilmiş tek bir odak noktasıyla tasarlar.
Basit Arka Plan Kullanma – Üst katmanların göze çarpması için simge arka planınızı basit tutun. Basit bir renk veya ince gradyan kullanmayı göz önünde bulundurun.
Metin Miktarını Sınırla – Kullanıcı tarafından seçildiğinde uygulamanın adı simgenin altında görüneceğinden, yalnızca simgenin tasarımı için gerekli olduğunda metin eklemeniz gerekir.
Ekran Görüntülerini kullanma – Ekran görüntüleri bir simge için çok karmaşıktır ve kullanıcının uygulamanızın amacını bir bakışta görmesine izin vermez.
Simgeleri Kare Tut – tvOS otomatik olarak simgelerinizin köşelerini aşağı yuvarlayan bir maske uygular. Bu yuvarlama işlemini kendiniz eklemeyin.
Katmanlarınızı Dikkatlice Ayırın – Metin en üst katmanda, ortadaki ikincil öğelerde ve üst katmanlarınızın parlamasını sağlayan nötr bir arka planda olmalıdır.
Gradyanları ve Gölgeleri Dikkatle Kullanma – Gradyanlar ve gölgeler Parallax Efekti ile çakıştırılabilir, bu nedenle dikkatli bir şekilde kullanılmalıdır. Basit yukarıdan aşağıya, açıktan koyuya gradyan stilleri en iyi şekilde çalışır. Gölgeler normalde en iyi keskin, sert kenarlı tonlar olarak çalışır.
Katman Saydamlığını Değiştir – 3B efektini artırmak için Uygulama Simgenizin üst düzeylerinde farklı saydamlık düzeyleri kullanın. Arka plan katmanı opak olmalıdır, aksi takdirde hataya neden olur.

Uygulama Simgelerini Ayarlama

tvOS projeniz için gereken Uygulama Simgeleri'ni ayarlamak için lütfen aşağıdakileri yapın:

Çözüm Gezgini düzenlemek üzere açmak için çift tıklayınAssets.xcassets:
Varlık Düzenleyicisi'nde varlığı genişletinApp Icon & Top Shelf Image:
Ardından varlığı genişletin App Icon - Small :
Ardından varlığı genişletin Back ve girişe Contents tıklayın:
1x Apple TV girdisine tıklayın ve bir görüntü dosyası seçin.
ve Middle varlıkları için Front yukarıdaki adımları yineleyin.
Ardından varlığı tanımlamak için aynı adımları yineleyin App Icon - Large .
Değişikliklerinizi kaydedin.

Üst Raf Resmi

Kullanıcı, Xamarin.tvOS uygulamanızı Apple TV Giriş ekranında üst satıra yerleştirmişse, uygulamanız kullanıcı tarafından seçildiğinde büyük bir Üst Raf Görüntüsü görüntülenir. Bu görüntü, uygulamanızın özelliklerini vurgulamalı veya içeriğine doğrudan bağlantılar sağlamalıdır.

Üst Raf Görüntüsü tek bir statik .png veya .lsr dosya olarak sağlanabilir (bkz. Katmanlı Görüntüler Oluşturma) veya çalışma zamanında tek bir Odaklanabilir Öğe satırı olarak dinamik olarak oluşturulabilir (aşağıdaki Dinamik Üst Raf İçeriğine bakın).

Üst Raf Görüntü Boyutu	Notlar
1920x720px	Statik .png veya katmanlı .lsr dosyası

Apple, Üst Raf Görüntülerinizi oluşturmak için aşağıdaki önerileri sağlar:

Zengin Statik Görüntü Kullan – Uygulamanız dinamik içerik sağlamazsa Üst Raf Görüntüsü odaklanamaz. Uygulamanın veya markanızın özelliklerini vurgulamak için bu görüntüyü kullanın.
Uygulama İçeriği bağlantısı – Dinamik Üst Raf Düzenleri, kullanıcınızın uygulamanızda en önemli bulduğu içeriğe hızlı bir bağlantı sağlar. Uygulamanızı başlatmak ve verilen içeriğe hemen geçmek için hızlı bir bağlantı sağlamak için bu alanı kullanın.
En Son İçeriği Sergile – Zengin Üst Raf içeriği, bir kullanıcıyı uygulamanıza çizebilir ve daha fazla kullanmak istemelerini sağlayabilir. En yüksek puanlı veya en yeni içeriği göstermek için bunu bir alan olarak kullanın.
Kişiselleştirilmiş İçerik – Kullanıcılar en sık kullandıkları veya sık kullandıkları uygulamaları Giriş ekranının Üst Satırına yerleştirir. En çok ilgilenebilecekleri içeriği görüntülemek için Üst Raf'ı kullanın.
İzin Verilmeyen Reklamlar – Reklamların Üst Rafta görüntülenmesi kesinlikle yasaktır. En son satın alınabilir içeriği gösterebilirsiniz, ancak hiçbir fiyatlandırma bilgisi görüntülenmemelidir.

Üst Raf Görüntüsünü Ayarlama

tvOS projeniz için gereken Üst Raf Görüntüsünü ayarlamak için lütfen aşağıdakileri yapın:

Çözüm Gezgini düzenlemek üzere açmak için çift tıklayınAssets.xcassets:
Varlık Düzenleyicisi'nde varlığı genişletinApp Icon & Top Shelf Image:
Varlığa Top Shelf Image tıklayın:
1x Apple TV girdisine tıklayın ve bir görüntü dosyası seçin.
Değişikliklerinizi kaydedin.

Dinamik Üst Raf İçeriği

Üst Raf, statik bir Üst Raf Görüntüsü görüntülemek yerine, dinamik bir Odaklanabilir Öğeler satırı veya dinamik bir kaydırma başlıkları kümesi içerebilir. Bu dinamik stilin her ikisi de uygulamanız tarafından sağlanan içeriği vurgulamanıza veya en çok kullanılan özelliklere atlamanıza olanak sağlar.

Bölümlenmiş İçerik Satırı

Bu dinamik Üst Raf içerik türü, isteğe bağlı olarak bölümlere ayrılmış tek bir kaydırma satırı sunar. Genellikle yeni, sık kullanılan veya son görüntülenen uygulama içeriğini vurgulamak için kullanılır.

İçerik, geçerli içerik parçasının (şu anda odakta olan) altında görünen bir etiketin bulunduğu tek, yatay kaydırmalı bir içerik listesi olarak sunulur. Kullanıcı belirli bir içerik parçasını seçerse uygulamanız başlatılır ve doğrudan bu içeriğe alınmalıdır.

Aşağıdaki içerik boyutları gerekli olacaktır:

Size	Poster (2:3)	Kare (1:1)	HDTV (16:9)
Gerçek Boyut	404x608px	608x608px	908x512px
Kasa Bölge Boyutu	380x570px	570x570px	852x479px
Odaklanmamış Boyut	333x500px	500x500px	782x440px
Odaklanmış Boyut	380x570px	570x570px	852x479px

Apple, Bölümlenmiş İçerik Satırı için aşağıdaki önerileri sağlar:

Satırı Tamamlayın: Ekranın tüm genişliğine yaymak için yeterli içerik sağlamanız gerekir.
Karma Görüntüleri Ölçeklendirme – Bölümlenmiş İçerik Satırı, görüntü boyutlarının bir karışımını barındıracak şekilde tasarlanmıştır (yukarıda sağlanan listeden). Ancak görüntü boyutlarını karıştırırsanız, içerik görünümünü normalleştirmek için ek ölçeklendirme uygulanacağını unutmayın.

Gelen Başlık Başlıklarını Kaydırma

İsteğe bağlı olarak, Xamarin.tvOS uygulamanız içeriğini Üst Raf'ta ekranı neredeyse dolduracak şekilde otomatik olarak kaydırma ve döngüye alma başlık koleksiyonu olarak sunabilir. Bu stil genellikle yeni TV programları gibi zengin ve yeni içerikleri göstermek için kullanılır.

Otomatik kaydırmaya ek olarak, kullanıcı başlıkların denetimini alabilir ve Siri Remote'ı kullanarak iki yönde de kaydırabilir. Bir başlık odaktayken Siri Remote'ta küçük, dairesel bir hareket yapmak, bu başlık için Parallax Efekti'ni etkinleştirir.

Başlık Resmi (Ekstra Geniş)

Size	Çözüm
Gerçek Boyut	1940x624px
Kasa Bölge Boyutu	1740x620px
Odaklanmamış Boyut	1740x560px
Odaklanmış Boyut	1740x620px

Kayan İç BaşlıkLar statik .png veya katmanlı .lsr dosya olarak sağlanabilir.

Apple, Kayan Inset Başlıkları için aşağıdaki önerileri sağlar:

İçerik Miktarı - Kaydırmanın doğal hissetmesi için en az üç (3) başlık sağlamanız gerekir. Sekizden fazla (8) başlık eklememelisiniz veya son kullanıcı için gezintiyi zorlaştırıyor.
İçerik Metni - Başlığınız için metin gerekiyorsa başlık görüntüsüne eklenmelidir. Katmanlı Görüntüler kullanıyorsanız, metniniz en üst katmanda olmalıdır.

Dinamik Üst Raf içeriği sağlamak için uygulamanıza Üst Raf Uzantısı ekleme hakkında daha fazla bilgi için lütfen Apple'ın TVServices Framework Başvurusu'na bakın.

Game Center Resimleri

Xamarin.tvOS uygulamanız bir oyunsa ve Game Center desteğini dahil ettiyseniz, birkaç görüntü varlığı daha gerekir:

Başarı Simgeleri - Otomatik olarak daire içine kırpılacak her başarı için opak bir resim gerekir. Başarılar odaklanılamayan öğelerdir.
Pano Resmi - Oyun Merkezi'nde uygulamanızın panosunun en üstünde görünecek isteğe bağlı bir resim sağlanabilir. Bu görüntüler odaklanılamaz.
Puan Tablosu Resmi - Uygulamanızın desteklediği her puan tablosu için bir (1) ila üç (3) 16:9 en boy oranı görüntüleri sağlamanız gerekir. Bunlar statik .png veya katmanlı .lsr dosyalar olabilir. Puan Tablosu resmi odaklanılabilir.

Size	Başarı Simgeleri	Pano Resmi	Puan Tablosu Resmi
Görünür Boyut	200x200px	923x150px	yok
Gerçek Boyut	320x320px	yok	659x371px
Kasa Bölge Boyutu	yok	yok	618x348px
Odaklanmamış Boyut	yok	yok	548x309px
Odaklanmış Boyut	yok	yok	618x348px

Game Center ile çalışma hakkında daha fazla bilgi için lütfen Apple'ın Game Center Programlama Kılavuzu'na bakın.

Görüntülerle Çalışma

tvOS 9, iOS 9'un bir alt kümesi olduğundan, Xamarin.iOS uygulamasında görüntü eklemek ve görüntülemek için kullanılan tekniklerin aynısı bir Xamarin.tvOS uygulamasında da çalışır. Daha fazla bilgi için lütfen Görüntü Görüntüleme belgelerimize bakın.

Xamarin.tvOS Proje Görüntülerini Ayarlama

Yukarıda belirtildiği gibi, tüm tvOS uygulamaları bir Başlatma Görüntüsü ve Uygulama Simgesi gerektirir. Bu bölüm, Varlık Kataloğu'nda ayarlandıktan sonra Xamarin.tvOS uygulama projeniz için Görüntü ve Uygulama Simgesini Başlat'ı seçmeyi kapsar.

Aşağıdakileri yapın:

Çözüm Gezgini düzenlemek üzere açmak için öğesine Info.plist çift tıklayın:
Info.Plist Düzenleyicisi'nde, Uygulama Simgeleri için Varlıklar Kataloğu'nu (yukarıda Uygulama Simgelerini Ayarlama bölümünde yapılandırılır) seçin:
Ardından, Görüntüleri Başlat için Varlıklar Kataloğu'nu seçin (Yukarıda, Görüntüyü Başlat bölümünde yapılandırılır).
Değişikliklerinizi kaydedin.

Özet

Bu makalede, Xamarin.tvOS uygulamasında kullanılan tüm görüntü türleri ve boyutları ele alınmıştır. İlk olarak, Lansman Görüntüleri, Katmanlı Görüntüler, Uygulama Simgeleri, Üst Raf Görüntüleri ve Oyun Merkezi Görüntüleri ele alınmıştır. Ardından Xamarin.tvOS uygulamanızdaki görüntülerle çalışmayı ele alır.

Aracılığıyla paylaş

Xamarin'de tvOS Simgeleri ve Görüntüleriyle Çalışma