Yarının görüntü modlarına hazırlanıyor

PWA'lar "display_override" kullanabilir özel görüntüleme modlarıyla başa çıkmak için çok iyi bir araçtır.

Web uygulaması manifesti, tarayıcıya Progressive Web Uygulaması ve kullanıcının masaüstü veya mobil cihazına yüklendiğinde nasıl davranması gerektiği. Uygulamanız kullanıma sunulduğunda display özelliği aracılığıyla, hangi tarayıcı kullanıcı arayüzünün gösterileceğini özelleştirebilirsiniz. Örneğin, adres çubuğu ve tarayıcı chrome. Hatta oyunları tam ekran gösterecek şekilde de geliştirebilirsiniz. Hızlı bir özet olarak, bu makalenin yazıldığı sırada belirtilen görüntüleme modlarını aşağıda bulabilirsiniz.

Özellik Kullanım
fullscreen Web uygulamasını herhangi bir tarayıcı kullanıcı arayüzü olmadan açar ve tamamını kaplamasını sağlıyor.
standalone Bağımsız bir görünüm ve tarz için web uygulamasını açar uygulamasını indirin. Uygulama, tarayıcıdan ayrı olarak kendi penceresinde çalışır ve URL çubuğu gibi standart tarayıcı kullanıcı arayüzü öğelerini gizler.
minimal-ui Bu mod standalone moduna benzer ancak kullanıcı arayüzü öğeleri gibi, gezinmeyi denetlemek için (örneğin, geri yükleyin ve yeniden yükleyin).
browser Standart bir tarayıcı deneyimi.

Bu görüntüleme modları iyi tanımlanmış bir yedek zincirini izler. ("fullscreen""standalone""minimal-ui""browser"). Tarayıcı, zincirdeki bir sonraki görüntüleme moduna geri döner.

display mülkünün eksikleri

Bu kablolu yedek zinciri yaklaşımının üç yolu vardır:

  • "minimal-ui" belirtilen tarayıcıda desteklenmiyorsa geliştirici, "minimal-ui" iznini tekrar "browser" görüntüleme moduna geçmeye zorlayamaz.
  • Geliştiriciler, "standalone" modu penceresinde tarayıcının geri düğmesi eklemesi veya hariç tutması gibi tarayıcılar arası farklılıkları yönetemezler.
  • Mevcut davranış nedeniyle yeni ekran eklemek imkansız geriye dönük uyumlu olacak şekilde değiştirebilirsiniz. Çünkü sekmeli uygulama modu gibi keşiflerde zincirindeki doğal bir yeri ayarlamaya benzer.

display_override mülkü

Bu sorunlar, tarayıcının önce dikkate aldığı display_override özelliği tarafından çözülür. display özelliğini seçin. Değeri, sıralı olarak kabul edilen bir dize dizisidir ve desteklenen ilk görüntü modu uygulanır. Hiçbiri desteklenmiyorsa tarayıcı, display alanına girin.

Aşağıdaki örnekte, görüntüleme modu yedek zinciri aşağıdaki gibi olur. ("window-controls-overlay" ile ilgili ayrıntılar, bu makalenin kapsamı dışındadır.)

  1. "window-controls-overlay" (İlk olarak display_override uygulamasına bakın.)
  2. "minimal-ui"
  3. "standalone" (display_override tükendiğinde display değerini değerlendirin.)
  4. "minimal-ui" (Son olarak display yedek zincirini kullanın.)
  5. "browser"
{
  "display_override": ["window-controls-overlay", "minimal-ui"],
  "display": "standalone",
}

Geriye dönük uyumlu olmaya devam etmek için, gelecekteki görüntüleme modları yalnızca display_override, ancak display değil. display_override özelliğini desteklemeyen tarayıcılar, display özelliğini kullanır ve yoksayar display_override adresini bilinmeyen bir web uygulaması manifest mülkü olarak güncelleyin.

Tasdik

display_override özelliği Doğan Murphy