ট্যাবলেট, ফোল্ডেবল, Googlebook, ChromeOS ডিভাইস, গাড়ির ডিসপ্লে এবং টিভি সহ ৩০০ মিলিয়নেরও বেশি Android বড় স্ক্রিনের ডিভাইস আজ ব্যবহার করা হচ্ছে এবং আরও অনেক কিছু ক্রমাগত আসছে। ক্রমবর্ধমান সংখ্যা এবং বৈচিত্র্যময় বড় স্ক্রিনের ডিভাইসে—পাশাপাশি স্ট্যান্ডার্ড ফোনে—ব্যবহারকারীকে সেরা অভিজ্ঞতা প্রদান করতে,অ্যাডাপ্টিভ অ্যাপ তৈরি করুন।
অ্যাডাপ্টিভ অ্যাপ কী?
অ্যাডাপ্টিভ অ্যাপ, অ্যাপ ডিসপ্লেতে হওয়া পরিবর্তনের উপর ভিত্তি করে লেআউট পরিবর্তন করে, মূলত অ্যাপ উইন্ডোর সাইজ। তবে, অ্যাডাপ্টিভ অ্যাপ ফোল্ডেবল ডিভাইসের ভঙ্গিতে পরিবর্তন, যেমন টেবিলটপ বা বইয়ের ভঙ্গি এবং স্ক্রিন ডেনসিটি ও ফন্ট সাইজে পরিবর্তনও মানিয়ে নেয়।
বিভিন্ন উইন্ডো সাইজের সাথে মানানসই করার জন্য UI এলিমেন্টকে শুধু বড় বা ছোট করার পরিবর্তে, অ্যাডাপ্টিভ অ্যাপ লেআউট কম্পোনেন্টকে পরিবর্তন করে এবং কন্টেন্ট দেখায় বা লুকায়। যেমন, স্ট্যান্ডার্ড ফোনে, একটি অ্যাডাপ্টিভ অ্যাপ নিচের দিকে নেভিগেশন বার দেখাতে পারে, কিন্তু বড় স্ক্রিনে, একটি নেভিগেশন রেল। বড় স্ক্রিনে, অ্যাডাপ্টিভ অ্যাপ আরও কন্টেন্ট দেখায়, যেমন, টু-পেন, লিস্ট-ডিটেল লেআউট; ছোট স্ক্রিনে, কম কন্টেন্ট, হয় লিস্ট অথবা ডিটেল।
আগে, অ্যাপ সাধারণত ফুল স্ক্রিনে চলত। বর্তমানে, অ্যাপগুলি ডিভাইসের স্ক্রিনের সাইজ নির্বিশেষে ইচ্ছামতো সাইজের উইন্ডোতে মাল্টি-উইন্ডো মোডে চলে। ব্যবহারকারী যেকোনও সময় উইন্ডোর সাইজ পরিবর্তন করতে পারবেন। তাই, এমনকি একটি ডিভাইসের ধরনের ক্ষেত্রেও, অ্যাপকে অবশ্যই অ্যাডাপ্টিভ হতে হবে।
অ্যাডাপ্টিভ অ্যাপ যেকোনও ডিভাইসে যেকোনও কনফিগারেশনে দারুণ দেখায় ও ভালভাবে কাজ করে।
অ্যাডাপ্টিভ UI কেন তৈরি করবেন?
ব্যবহারকারীরা আশা করেন যে আপনার অ্যাপ তাদের সব ডিভাইসে ত্রুটিহীনভাবে কাজ করবে এবং বড় স্ক্রিনে উন্নত ক্ষমতা প্রদান করবে। অ্যাপের অভিজ্ঞতা আরও ভালো করতে এবং প্রোডাক্টিভিটি বাড়াতে ব্যবহারকারীরা মাল্টি-উইন্ডো মোডে মাল্টিটাস্ক করেন।
স্ট্যান্ডার্ড ফোনে সিঙ্গেল-টাস্কিংয়ের মধ্যে সীমাবদ্ধ অ্যাপগুলি বিভিন্ন সম্ভাবনার প্রসারিত ব্যবহারকারী বেস মিস করে।
Google Play
Google Play ট্যাবলেট ও ফোল্ডেবল ডিভাইসের জন্য নির্দিষ্ট অ্যাপ কালেকশন ও সাজেশন প্রদান করে, যার মাধ্যমে ব্যবহারকারীরা খুব ভাল কোয়ালিটির অ্যাপ খুঁজে পেতে পারেন।
Play-তে বড় স্ক্রিনের জন্য অপ্টিমাইজ করা অ্যাপ ও গেমকে অপ্টিমাইজ না করা অ্যাপের থেকে বেশি র্যাঙ্ক দেওয়া হয়। Play বড় স্ক্রিন অ্যাপ কোয়ালিটি নির্দেশিকা-এর উপর ভিত্তি করে র্যাঙ্কিং করে। উন্নত র্যাংকিং, মাল্টি-ডিভাইস ব্যবহারকারীদের তাদের ফোনে বড় স্ক্রিন–নির্দিষ্ট রেটিং ও রিভিউ দেখার সুবিধা দিয়ে খুঁজে নেওয়ার যোগ্যতা বাড়ায়।
যেসব অ্যাপ Play Store-এর বড় স্ক্রিন কোয়ালিটি স্ট্যান্ডার্ড পূরণ করে না, সেগুলির অ্যাপের বিবরণ পৃষ্ঠায় একটি সতর্কতা দেখানো হয়। এই সতর্কতার মাধ্যমে ব্যবহারকারীদের জানানো হয় যে, বড় স্ক্রিনের ডিভাইসে অ্যাপটি ভালভাবে কাজ নাও করতে পারে।
Google Play-তে খুঁজে নেওয়ার যোগ্যতা বাড়াতে এবং আপনার অ্যাপ ডাউনলোড করতে পারে এমন ডিভাইসের সংখ্যা সর্বাধিক করতে, অ্যাডাপ্টিভ অ্যাপ তৈরি করুন।
কীভাবে শুরু করবেন
অ্যাপ ডেভেলপমেন্টের সব পর্যায়ে, পরিকল্পনা থেকে শুরু করে ডিপ্লয়মেন্ট পর্যন্ত, অ্যাডাপ্টিভ ডিজাইনের কথা মাথায় রাখুন। গ্রাফিক ডিজাইনারদের অ্যাডাপ্টিভ ডিজাইন সম্পর্কে জানান। আপনার অ্যাপকে অ্যাডাপ্টিভ হিসেবে ডিজাইন করুন এবং আপনি এমন একটি অ্যাপ তৈরি করবেন যা ম্যানেজ করা যায়, এক্সটেন্ড করা যায় এবং ভবিষ্যতের ফর্ম ফ্যাক্টর ও উইন্ডোইং মোডের জন্য প্রস্তুত।
সব ডিসপ্লে সাইজ ও কনফিগারেশনে কাজ করে এমন অ্যাডাপ্টিভ অ্যাপ তৈরি করতে, নিম্নলিখিত ধাপগুলি অনুসরণ করুন:
- লেআউট সংক্রান্ত সিদ্ধান্ত নিতে উইন্ডো সাইজ ক্লাস ব্যবহার করা
- Compose Material 3 অ্যাডাপ্টিভ লাইব্রেরি ব্যবহার করে তৈরি করা
- টাচ ছাড়াও অন্যান্য ইনপুট কাজ করে
- সব ধরনের ডিভাইসে পরীক্ষা করুন
Android স্কিল
GitHub-এ দেখুনআপনার অ্যাপকে অ্যাডাপ্টিভ করে তোলা
adaptive Android স্কিল ব্যবহার করে আপনার অ্যাপের UI আপডেট করুন যাতে এটি বিভিন্ন Android ডিভাইস ও ডিসপ্লেতে মানানসই হয়।android skills add adaptiveউইন্ডো সাইজ ক্লাস
অ্যাপ ফুল স্ক্রিনে থাকলেও, বিভিন্ন ডিভাইসে—বা ফোল্ডেবল ডিভাইসের ক্ষেত্রে একই ডিভাইসে—অ্যাপ উইন্ডোর সাইজ আলাদা হতে পারে। ডিভাইসের ওরিয়েন্টেশন আলাদা হলে অ্যাস্পেক্ট রেশিও আলাদা হয়। মাল্টি‑উইন্ডো মোডে, অ্যাপ উইন্ডোর সাইজ, অ্যাস্পেক্ট রেশিও এবং ওরিয়েন্টেশন ডিভাইসের স্ক্রিনের থেকে আলাদা হতে পারে।
অ্যাডাপ্টিভ অ্যাপ উইন্ডোর সাইজ, অ্যাস্পেক্ট রেশিও এবং ওরিয়েন্টেশন নির্ধারণ ও ম্যানেজ করার সমস্যাকে সহজ ও সাধারণ করে তোলে। লেআউট রেন্ডার করার সময় এটি শুধুমাত্র অ্যাপ উইন্ডোকে বিবেচনা করে, যা অ্যাপ উইন্ডো ফুল স্ক্রিন হলেও কাজ করে।
উইন্ডো সাইজ ক্লাস অ্যাপ উইন্ডোকে উইন্ডোর প্রস্থ বা উচ্চতার উপর ভিত্তি করে কমপ্যাক্ট, মাঝারি বা এক্সপ্যান্ড করা হিসেবে শ্রেণীবদ্ধ করে।
Compose
Material 3 অ্যাডাপ্টিভ লাইব্রেরি-এর currentWindowAdaptiveInfo() টপ‑লেভেল ফাংশন ব্যবহার করে আপনার অ্যাপের WindowSizeClass কম্পিউট করুন। ফাংশনটি
WindowAdaptiveInfo-এর একটি ইনস্ট্যান্স রিটার্ন করে, যার মধ্যে windowSizeClass থাকে। উইন্ডো সাইজ ক্লাস পরিবর্তন হলেই আপনার অ্যাপ
আপডেট পায়:
val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClass
কন্টেন্ট প্যান
কোনও অ্যাক্টিভিটির লেআউটকে কখনও কখনও স্ক্রিন হিসেবে উল্লেখ করা হয়। যেমন, আপনার অ্যাপে হোম স্ক্রিন, তালিকা স্ক্রিন ও আইটেমের বিবরণ স্ক্রিন থাকতে পারে। এই পরিভাষা থেকে বোঝা যায় যে প্রতিটি অ্যাক্টিভিটি ডিভাইসের স্ক্রিন জুড়ে দেখানো হয়।
তবে, ডিভাইসের স্ক্রিন যদি যথেষ্ট বড় হয় এবং এক্সপ্যান্ড করা প্রস্থের উইন্ডো সাইজ ক্লাস সাপোর্ট করে, তাহলে একাধিক অ্যাক্টিভিটি স্ক্রিন একই সময়ে অনস্ক্রিন থাকতে পারে। প্যানেল হল আলাদা আলাদা অ্যাক্টিভিটির কন্টেন্ট ডিসপ্লে করার জন্য আরও সঠিক শব্দ।
মেটেরিয়াল ডিজাইন-এ যেমন উল্লেখ করা আছে, উইন্ডো সাইজ ক্লাস আপনাকে মাল্টি-পেন লেআউটে কতগুলি কন্টেন্ট পেন দেখাতে হবে তা নির্ধারণ করতে দেয়।
প্যানে নেভিগেট করা যায়। কমপ্যাক্ট ও মাঝারি উইন্ডো সাইজ ক্লাসে, অ্যাপ একটি প্যানেল দেখায়; তাই, যেকোনও গন্তব্যে নেভিগেট করলে একটি প্যানেল দেখা যায়।
বড় করা উইন্ডো সাইজ ক্লাসে, অ্যাপ একাধিক প্যানে সম্পর্কিত কন্টেন্ট দেখাতে পারে, যেমন তালিকা-বিবরণ লেআউট। যেকোনও প্যানে নেভিগেট করলে দুটি প্যানেলের লেআউট দেখা যায়। উইন্ডোর সাইজ কম্প্যাক্ট বা মিডিয়ামে পরিবর্তিত হলে, অ্যাডাপ্টিভ অ্যাপ শুধুমাত্র একটি প্যান, নেভিগেশন ডেস্টিনেশন, তালিকা বা বিবরণ দেখায়।
|
|
|
Compose Material 3 Adaptive
Jetpack Compose হল অ্যাডাপ্টিভ অ্যাপ তৈরি করার আধুনিক, ঘোষণামূলক পদ্ধতি এতে একাধিক লেআউট ফাইলের ডুপ্লিকেশন এবং রক্ষণাবেক্ষণের বোঝা থাকে না।
Compose Material 3 অ্যাডাপ্টিভ লাইব্রেরিতে কম্পোজেবল থাকে যা উইন্ডো সাইজ ক্লাস, নেভিগেশন কম্পোনেন্ট, মাল্টি‑পেন লেআউট এবং ফোল্ডেবল পসচার ও হিঞ্জ লোকেশন ম্যানেজ করে, যেমন:
NavigationSuiteScaffold: অ্যাপ উইন্ডো সাইজ ক্লাস ও ডিভাইসের ভঙ্গির উপর নির্ভর করে নেভিগেশন বার ও নেভিগেশন রেলের মধ্যে অটোমেটিক পাল্টায়।ListDetailPaneScaffold: তালিকা-বিবরণ ক্যানোনিকাল লেআউট প্রয়োগ করে।অ্যাপ উইন্ডোর সাইজ অনুযায়ী লেআউট অ্যাডাপ্ট করে। বড় উইন্ডো সাইজ ক্লাসে পাশাপাশি প্যানে একটি তালিকা এবং তালিকা আইটেমের বিবরণ দেখায়, কিন্তু ছোট এবং মাঝারি উইন্ডো সাইজ ক্লাসে শুধু তালিকা বা বিবরণ দেখায়।
SupportingPaneScaffold: সাপোর্টিং প্যানেল ক্যানোনিকাল লেআউট প্রয়োগ করে।এক্সপ্যান্ড করা উইন্ডো সাইজ ক্লাসে মূল কন্টেন্ট প্যান ও একটি সহায়ক প্যান দেখায়, কিন্তু কম্প্যাক্ট ও মিডিয়াম উইন্ডো সাইজ ক্লাসে শুধু মূল কন্টেন্ট প্যান দেখায়।
অ্যাডাপ্টিভ অ্যাপ ডেভেলপ করার জন্য Compose Material 3 অ্যাডাপ্টিভ লাইব্রেরি হল একটি গুরুত্বপূর্ণ ডিপেন্ডেন্সি।
কনফিগারেশন ও ধারাবাহিকতা
কনফিগারেশন পরিবর্তনের সময় অ্যাডাপ্টিভ অ্যাপ ধারাবাহিকতা বজায় রাখে।
অ্যাপ উইন্ডোর সাইজ পরিবর্তন করা হলে, ফোল্ডেবল ডিভাইসের পসচার পরিবর্তন করা হলে অথবা স্ক্রিন ডেনসিটি বা ফন্ট পরিবর্তন করা হলে, কনফিগারেশন পরিবর্তন হয়।
ডিফল্ট হিসেবে, কনফিগারেশন পরিবর্তন অ্যাপ অ্যাক্টিভিটি আবার তৈরি করে এবং সব অ্যাক্টিভিটি
স্টেট হারিয়ে যায়। ধারাবাহিকতা বজায় রাখতে, অ্যাডাপ্টিভ অ্যাপ অ্যাক্টিভিটির onSaveInstanceState() পদ্ধতিতে বা ViewModel-এ স্টেট সেভ করে।
ভঙ্গি
অ্যাডাপ্টিভ অ্যাপ ফোল্ডেবল ডিভাইসের ভঙ্গিতে হওয়া পরিবর্তনের সাথে মানিয়ে নেয়। ভঙ্গিমার মধ্যে টেবিলটপ ও বই ভঙ্গিমা অন্তর্ভুক্ত।
Jetpack WindowManager-এ WindowInfoTracker ইন্টারফেস আপনাকে
ডিভাইসের জন্য DisplayFeature অবজেক্টের তালিকা পেতে দেয়। ডিসপ্লে ফিচারের মধ্যে
FoldingFeature.State রয়েছে, যা ডিভাইসটি সম্পূর্ণ নাকি অর্ধেক খোলা আছে তা
নির্দেশ করে।
Compose Material 3 অ্যাডাপ্টিভ লাইব্রেরি
currentWindowAdaptiveInfo() টপ‑লেভেল ফাংশন প্রদান করে, যা
windowPosture সহ WindowAdaptiveInfo-এর ইনস্ট্যান্স রিটার্ন করে।
টাচ ছাড়াও ইনপুট দেওয়ার পদ্ধতি
ব্যবহারকারীরা প্রায়ই বড় স্ক্রিনের ডিভাইসের সাথে এক্সটার্নাল কীবোর্ড, ট্র্যাকপ্যাড, মাউস ও স্টাইলাস কানেক্ট করেন। পেরিফেরাল ব্যবহারকারীর প্রোডাক্টিভিটি, ইনপুট প্রিসিশন, ব্যক্তিগত এক্সপ্রেশন ও অ্যাক্সেসিবিলিটি উন্নত করে। বেশিরভাগ ChromeOS ডিভাইসে কীবোর্ড ও ট্র্যাকপ্যাড বিল্ট-ইন থাকে।
অ্যাডাপ্টিভ অ্যাপ এক্সটার্নাল ইনপুট ডিভাইস সাপোর্ট করে, তবে Android ফ্রেমওয়ার্ক আপনার জন্য বেশিরভাগ কাজ করে:
Jetpack Compose 1.7 ও তার পরবর্তী ভার্সন: কীবোর্ড ট্যাব নেভিগেশন এবং মাউস বা ট্র্যাকপ্যাড ক্লিক, বেছে নেওয়া ও স্ক্রল করার সুবিধা ডিফল্ট হিসেবে কাজ করে।
Jetpack
androidx.compose.material3লাইব্রেরি: ব্যবহারকারীদের স্টাইলাস ব্যবহার করে যেকোনওTextFieldকম্পোনেন্টে লিখতে দেয়।কীবোর্ড শর্টকাট হেল্পার: Android প্ল্যাটফর্ম ও অ্যাপ কীবোর্ড শর্টকাট ব্যবহারকারীদের জন্য খুঁজে পাওয়ার যোগ্য করে তোলে।
onProvideKeyboardShortcuts()উইন্ডো কলব্যাক ওভাররাইড করে কীবোর্ড শর্টকাট হেল্পারে আপনার অ্যাপের কীবোর্ড শর্টকাট প্রকাশ করুন।
সব সাইজের ফর্ম ফ্যাক্টরকে সম্পূর্ণভাবে সাপোর্ট করার জন্য, অ্যাডাপ্টিভ অ্যাপ সব ধরনের ইনপুটকে সাপোর্ট করে।
অ্যাডাপ্টিভ অ্যাপ কীভাবে পরীক্ষা করবেন
বিভিন্ন স্ক্রিন ও উইন্ডোর সাইজ এবং বিভিন্ন ডিভাইস কনফিগারেশন পরীক্ষা করুন। আপনার অ্যাপ লেআউট চেক করতে হোস্ট‑সাইড স্ক্রিনশট ও কম্পোজ প্রিভিউ ব্যবহার করুন। Android Studio এমুলেটর এবং Google ডেটা সেন্টারে হোস্ট করা রিমোট Android ডিভাইসে আপনার অ্যাপ রান করুন।
বড় স্ক্রিনের অ্যাপ কোয়ালিটি সংক্রান্ত নির্দেশিকা
বড় স্ক্রিন অ্যাপ কোয়ালিটি নির্দেশিকা আপনাকে যাচাই করতে সাহায্য করে যে আপনার অ্যাডাপ্টিভ অ্যাপ ট্যাবলেট, ফোল্ডেবল এবং ChromeOS ডিভাইসে ভালভাবে কাজ করে। নির্দেশিকায় এমন টেস্ট অন্তর্ভুক্ত থাকে যা আপনাকে ক্রিটিকাল ইউজার জার্নির জন্য অ্যাপের কার্যকারিতা যাচাই করতে সাহায্য করে। যদিও নির্দেশিকাগুলি বড় স্ক্রিনের উপর ফোকাস করে, সেগুলি সব স্ক্রিন সাইজের সাথে মানানসই।
একাধিক কনফিগারেশন
Compose 1.7 এবং তার পরবর্তী ভার্সনে DeviceConfigurationOverride ইন্টারফেস
আপনাকে ডিভাইস কনফিগারেশনের বিভিন্ন দিক ওভাররাইড করতে দেয়। আপনি যে কম্পোজেবল কন্টেন্টই পরীক্ষা করতে চান না কেন, API
স্থানীয়ভাবে বিভিন্ন ডিভাইস কনফিগারেশন
সিমুলেট করে। যেমন, আপনি একটি ডিভাইস বা এমুলেটরে আপনার টেস্ট স্যুটের একটি রান-এ একাধিক,
যথেচ্ছ UI সাইজ পরীক্ষা করতে পারেন।
DeviceConfigurationOverride.then() এক্সটেনশন ফাংশনের মাধ্যমে, আপনি
ফন্টের সাইজ, লোকেল, থিম ও লেআউটের সাইজের মতো একাধিক কনফিগারেশন প্যারামিটার
একই সাথে পরীক্ষা করতে পারবেন।
হোস্ট-সাইড স্ক্রিনশট
হোস্ট-সাইড স্ক্রিনশট টেস্ট হল আপনার অ্যাপ লেআউটের ভিজ্যুয়াল অ্যাপিয়ারেন্স যাচাই করার একটি দ্রুত এবং স্কেলেবল উপায়। বিভিন্ন ডিসপ্লে সাইজের জন্য আপনার UI পরীক্ষা করতে হোস্ট-সাইড স্ক্রিনশট ব্যবহার করুন।
আরও তথ্যের জন্য, কম্পোজ প্রিভিউ স্ক্রিনশট টেস্টিং দেখুন।
প্রিভিউ কম্পোজ করুন
Compose প্রিভিউ আপনাকে Android Studio-এর ডিজাইন ভিউতে আপনার অ্যাপের UI চেক করতে দেয়। প্রিভিউতে @PreviewScreenSizes,
@PreviewFontScale ও @PreviewLightDark-এর মতো অ্যানোটেশন ব্যবহার করা হয় যাতে আপনি বিভিন্ন কনফিগারেশনে কম্পোজেবল
কন্টেন্ট দেখতে পান। এমনকি আপনি প্রিভিউয়ের সাথে ইন্টার্যাক্টও করতে পারবেন।
এছাড়াও, Android Studio প্রিভিউতে সাধারণ ব্যবহারযোগ্যতা সংক্রান্ত সমস্যা হাইলাইট করে, যেমন বোতাম বা টেক্সট ফিল্ড যা খুব চওড়া।
আরও তথ্যের জন্য, কম্পোজেবল প্রিভিউয়ের মাধ্যমে আপনার UI-এর প্রিভিউ দেখুন।
ইমুলেটর
Android Studio বিভিন্ন লেআউট সাইজ পরীক্ষা করার জন্য বিভিন্ন ধরনের এমুলেটর অফার করে:
- রিসাইজ করা যায় এমন এমুলেটর: ফোন, ট্যাবলেট বা ফোল্ডেবল ডিভাইসের এমুলেটর এবং এটি আপনাকে এগুলির মধ্যে চটপট পাল্টাতে দেয়
- Pixel Fold এমুলেটর: Pixel Fold বড় স্ক্রিনের ফোল্ডেবল ফোন এমুলেট করে
- Pixel Tablet এমুলেটর: Pixel Tablet-এর বড় স্ক্রিন ডিভাইসের এমুলেটর
- ডেস্কটপ এমুলেটর: আপনাকে ফ্রি-ফর্ম উইন্ডোয়িং, মাউস হোভার এবং কীবোর্ড শর্টকাট পরীক্ষা করতে দেয়
রিমোট ডিভাইস স্ট্রিমিং
Google ডেটা সেন্টারে হোস্ট করা রিমোট Android ডিভাইসের সাথে নিরাপদে কানেক্ট করুন এবং লেটেস্ট Pixel ও Samsung ডিভাইসে আপনার অ্যাপ চালান। অ্যাপ ইনস্টল ও ডিবাগ করুন, ADB কমান্ড রান করুন এবং ডিভাইস রোটেট ও ফোল্ড করে দেখুন যে আপনার অ্যাপ বিভিন্ন ধরনের আসল ডিভাইসে ভালোভাবে কাজ করছে কিনা।
Android Studio-তে রিমোট ডিভাইস স্ট্রিমিং ইন্টিগ্রেট করা আছে। আরও তথ্যের জন্য, Firebase দ্বারা পরিচালিত Android ডিভাইস স্ট্রিমিং দেখুন।
অতিরিক্ত রিসোর্স
- I/O প্রেজেন্টেশন: অ্যাডাপ্টিভ Android অ্যাপ তৈরি করা