আগামীকালের ডিসপ্লে মোডের জন্য প্রস্তুতি নেওয়া হচ্ছে

বিশেষ ডিসপ্লে মোড সামলানোর জন্য PWA "display_override" প্রপার্টি ব্যবহার করতে পারে।

Thomas Steiner

ওয়েব অ্যাপ ম্যানিফেস্ট হল একটি JSON ফাইল যা আপনার প্রগ্রেসিভ ওয়েব অ্যাপ সম্পর্কে ব্রাউজারকে জানায় এবং ব্যবহারকারীর ডেস্কটপ বা মোবাইল ডিভাইসে ইনস্টল করা হলে এটি কীভাবে আচরণ করবে তা জানায়। display প্রপার্টির মাধ্যমে, আপনার অ্যাপ লঞ্চ করার সময় কোন ব্রাউজার UI দেখানো হবে তা কাস্টমাইজ করতে পারবেন। যেমন, আপনি অ্যাড্রেস বার ও ব্রাউজার ক্রোম লুকাতে পারবেন। এমনকি গেম ফুল স্ক্রিনে লঞ্চ করার জন্য তৈরি করা যেতে পারে। দ্রুত রিক্যাপ হিসেবে, এই নিবন্ধ লেখার সময় উল্লেখ করা ডিসপ্লে মোডগুলি নিচে দেওয়া হল।

প্রপার্টি ব্যবহার করুন
fullscreen কোনও ব্রাউজার UI ছাড়াই ওয়েব অ্যাপ্লিকেশন খোলে এবং উপলভ্য ডিসপ্লে এরিয়া সম্পূর্ণভাবে ব্যবহার করে।
standalone ওয়েব অ্যাপকে এমনভাবে খোলে যাতে সেটি স্ট্যান্ডঅ্যালোন অ্যাপের মতো দেখায়। অ্যাপটি ব্রাউজার থেকে আলাদা নিজস্ব উইন্ডোতে চলে এবং URL বারের মতো স্ট্যান্ডার্ড ব্রাউজার UI এলিমেন্ট লুকায়।
minimal-ui এই মোডটি standalone-এর মতো, তবে এটি ব্যবহারকারীকে নেভিগেশন কন্ট্রোল করার জন্য UI এলিমেন্টের একটি ন্যূনতম সেট প্রদান করে (যেমন ফিরে যাওয়া ও আবার লোড করা)।
browser একটি স্ট্যান্ডার্ড ব্রাউজার অভিজ্ঞতা।

এইসব ডিসপ্লে মোড সুনির্দিষ্ট ফলব্যাক চেইন ("fullscreen" → "standalone" → "minimal-ui" → "browser") অনুসরণ করে। কোনও ব্রাউজার প্রদত্ত মোড সমর্থন না করলে, এটি চেইনের পরবর্তী ডিসপ্লে মোডে ফিরে যায়।

display প্রপার্টির ত্রুটি

এই হার্ড-ওয়্যার্ড ফলব্যাক চেইন পদ্ধতির সমস্যাটি তিনগুণ:

  • কোনও ব্রাউজারে "minimal-ui" কাজ না করলে, ডেভেলপার "browser" ডিসপ্লে মোডে ফিরে না গিয়ে "minimal-ui"-এর জন্য অনুরোধ করতে পারবেন না।
  • ডেভেলপারদের কাছে ক্রস-ব্রাউজার সংক্রান্ত পার্থক্য ম্যানেজ করার কোনও উপায় নেই, যেমন ব্রাউজার "standalone" মোডের জন্য উইন্ডোতে ফিরে যাওয়ার বোতাম অন্তর্ভুক্ত বা বাদ দিলে।
  • বর্তমান আচরণটি ব্যাকওয়ার্ড-কম্প্যাটিবল উপায়ে নতুন ডিসপ্লে মোড চালু করা অসম্ভব করে তোলে, কারণ ট্যাবযুক্ত অ্যাপ্লিকেশন মোডের মতো এক্সপ্লোরেশন ফলব্যাক চেনে স্বাভাবিকভাবে জায়গা পায় না।

display_override প্রপার্টি

display_override প্রপার্টির মাধ্যমে এইসব সমস্যার সমাধান করা হয়, ব্রাউজার display প্রপার্টির আগে প্রপার্টিকে বিবেচনা করে। এর ভ্যালু হল স্ট্রিংয়ের একটি সিকোয়েন্স যা ক্রম অনুযায়ী বিবেচনা করা হয় এবং প্রথম কাজ করে এমন ডিসপ্লে মোড প্রয়োগ করা হয়। কোনওটি কাজ না করলে, ব্রাউজারটি display ফিল্ড মূল্যায়ন করার জন্য ফলব্যাক করে।

নিচের উদাহরণে, ডিসপ্লে মোড ফলব্যাক চেইন নিম্নলিখিতভাবে কাজ করবে। ("window-controls-overlay"-এর বিবরণ এই নিবন্ধের আওতাভুক্ত নয়।)

  1. "window-controls-overlay" (প্রথমে, display_override দেখুন।)
  2. "minimal-ui"
  3. "standalone" (display_override শেষ হয়ে গেলে, display মূল্যায়ন করুন।)
  4. "minimal-ui" (অবশেষে, display ফলব্যাক চেইন ব্যবহার করুন।)
  5. "browser"
{
  "display_override": ["window-controls-overlay", "minimal-ui"],
  "display": "standalone",
}

ব্যাকওয়ার্ড কম্প্যাটিবল হিসেবে কাজ করার জন্য, ভবিষ্যতে যেকোনও ডিসপ্লে মোড শুধুমাত্র display_override-এর ভ্যালু হিসেবে গ্রহণযোগ্য হবে, display-এর ভ্যালু হিসেবে নয়। যেসব ব্রাউজারে display_override কাজ করে না সেগুলি display প্রপার্টিতে ফিরে যায় এবং display_override-কে অজানা ওয়েব অ্যাপ ম্যানিফেস্ট প্রপার্টি হিসেবে উপেক্ষা করে।

কৃতজ্ঞতা স্বীকার

display_override প্রপার্টিটি Daniel Murphy-এর দ্বারা ফর্ম্যালাইজ করা হয়েছে।