এপ্রিল 2017 থেকে, Android O-এর জন্য Chrome পিকচার-ইন-পিকচার সমর্থন করে । এটি ব্যবহারকারীদের একটি ছোট ওভারলে উইন্ডোতে একটি <video> উপাদান খেলতে দেয় যা অন্যান্য উইন্ডো দ্বারা অবরুদ্ধ নয়, যাতে তারা অন্যান্য কাজ করার সময় দেখতে পারে।
এটি কীভাবে কাজ করে তা এখানে: Chrome খুলুন, একটি ভিডিও রয়েছে এমন একটি ওয়েবসাইটে যান এবং এটিকে পূর্ণস্ক্রীনে চালান৷ সেখান থেকে, আপনার অ্যান্ড্রয়েড হোম স্ক্রিনে যেতে হোম বোতাম টিপুন এবং প্লে করা ভিডিওটি স্বয়ংক্রিয়ভাবে পিকচার-ইন-পিকচারে রূপান্তরিত হবে। এতটুকুই! সুন্দর সুন্দর ডান?
এটা, কিন্তু, ডেস্কটপ সম্পর্কে কি? ওয়েবসাইট যদি সেই অভিজ্ঞতা নিয়ন্ত্রণ করতে চায়?
ভাল খবর হল যে আমরা কথা বলার সাথে সাথে একটি পিকচার-ইন-পিকচার ওয়েব API স্পেসিফিকেশন তৈরি করা হচ্ছে। এই বৈশিষ্ট্যের লক্ষ্য হল ওয়েবসাইটগুলিকে API-তে নিম্নলিখিত বৈশিষ্ট্যগুলির সেট প্রকাশ করে এই আচরণ শুরু এবং নিয়ন্ত্রণ করার অনুমতি দেওয়া:
- যখন একটি ভিডিও ছবি-ইন-পিকচার মোডে প্রবেশ করে এবং ছেড়ে যায় তখন ওয়েবসাইটটিকে অবহিত করুন।
- ওয়েবসাইটটিকে ব্যবহারকারীর অঙ্গভঙ্গির মাধ্যমে একটি ভিডিও উপাদানে পিকচার-ইন-পিকচার ট্রিগার করার অনুমতি দিন।
- ওয়েবসাইটটিকে পিকচার-ইন-পিকচার থেকে প্রস্থান করার অনুমতি দিন।
- Picture-in-Picture ট্রিগার করা যায় কিনা তা পরীক্ষা করার জন্য ওয়েবসাইটটিকে অনুমতি দিন।
এবং এটি দেখতে কেমন হতে পারে:
<video id="video" src="https://example.com/file.mp4"></video>
<button id="pipButton"></button>
<script>
// Hide button if Picture-in-Picture is not supported.
pipButton.hidden = !document.pictureInPictureEnabled;
pipButton.addEventListener('click', function() {
// If there is no element in Picture-in-Picture yet, let's request Picture
// In Picture for the video, otherwise leave it.
if (!document.pictureInPictureElement) {
video.requestPictureInPicture()
.catch(error => {
// Video failed to enter Picture-in-Picture mode.
});
} else {
document.exitPictureInPicture()
.catch(error => {
// Video failed to leave Picture-in-Picture mode.
});
}
});
</script>
প্রতিক্রিয়া
তাহলে আপনি কি মনে করেন? অনুগ্রহ করে আপনার প্রতিক্রিয়া জমা দিন এবং Picture-in-Picture WICG রিপোজিটরিতে সমস্যাগুলি উত্থাপন করুন৷ আমরা আপনার চিন্তা শুনতে আগ্রহী!
অ্যান্ড্রয়েডের ডিফল্ট পিআইপি আচরণ প্রতিরোধ করা
আজ, আপনি একটি রিসাইজ ইভেন্টে প্রতিক্রিয়া জানিয়ে এবং কখন উইন্ডোর আকার উল্লেখযোগ্যভাবে পরিবর্তিত হয়েছে তা সনাক্ত করে (নীচের কোড দেখুন) Chrome-এ Android এর ডিফল্ট PiP আচরণ ব্যবহার করা থেকে ভিডিও প্রতিরোধ করতে পারেন। এটি একটি স্থায়ী সমাধান হিসাবে সুপারিশ করা হয় না কিন্তু ওয়েব API কার্যকর না হওয়া পর্যন্ত একটি অস্থায়ী বিকল্প প্রদান করে।
// See whether resize is small enough to be PiP. It's a hack, but it'll
// work for now.
window.addEventListener('resize', function() {
if (!document.fullscreenElement) {
return;
}
var minimumScreenSize = 0.33;
var screenArea = screen.width * screen.height;
var windowArea = window.outerHeight * window.outerWidth;
// If the size of the window relative to the screen is less than a third,
// let's assume we're in PiP and exit fullscreen to prevent Auto PiP.
if ((windowArea / screenArea) < minimumScreenSize) {
document.exitFullscreen();
}
});