Size Class: এটি কী, iOS-এ Compact এবং Regular সাইজ ক্লাস
Size Class হল iOS-এ অ্যাডাপটিভ লেআউটের জন্য একটি মেকানিজম যা প্রতিটি অক্ষ বরাবর সমস্ত ডিভাইসকে দুটি ক্যাটাগরিতে ভাগ করে: Compact (সংকীর্ণ/ছোট) এবং Regular (প্রশস্ত/লম্বা)। এই মানগুলির সংমিশ্রণ নির্ধারণ করে কীভাবে ইন্টারফেস iPhone, iPad, Mac Catalyst এবং CarPlay-তে প্রদর্শিত হয়। Apple Human Interface Guidelines, 2024 অনুযায়ী, Size Class Auto Layout এবং UITraitCollection ব্যবহার করে সমস্ত ডিভাইসের জন্য একটি storyboard তৈরি করতে দেয়। সিস্টেমটি iOS 8 থেকে সমস্ত iOS ডিভাইসে কাজ করে।
মূল বিষয়
- Size Class হল iOS-এ একটি সাইজ শ্রেণীবিভাগ পদ্ধতি যাতে প্রতি অক্ষে দুটি মান আছে: Compact (সংকুচিত) এবং Regular (পূর্ণ আকার)।
- অনুভূমিক Size Class iPhone-এ পোর্ট্রেট ওরিয়েন্টেশনে Compact, iPad-এ — Regular। উল্লম্বটি SE ছাড়া সমস্ত iPhone-এ Regular।
- UITraitCollection বর্তমান Size Class পাওয়ার এবং রানটাইমে ট্রেইট কালেকশন পরিবর্তনে সাড়া দেওয়ার জন্য একটি প্রোগ্রামেটিক ইন্টারফেস।
- Interface Builder Vary for Traits টুলের সাহায্যে প্রতিটি Size Class সংমিশ্রণের জন্য কনস্ট্রেইন্ট এবং এলিমেন্ট দৃশ্যমানতা কনফিগার করতে দেয়।
- অ্যাডাপটিভ লেআউট Size Class-এর সাথে iPhone এবং iPad-এর জন্য আলাদা storyboard প্রতিস্থাপন করে — একটি ফাইল সমস্ত ডিভাইসের সাথে খাপ খায়।
Size Class কী?
Size Class হল iOS-এ একটি বিমূর্ত স্ক্রিন শ্রেণীবিভাগ, যা Apple iOS 8-তে অ্যাডাপটিভ লেআউট একীভূত করার জন্য প্রবর্তন করেছিল। নির্দিষ্ট ডিভাইস মডেল চেক করার পরিবর্তে, Size Class দুটি বৈশিষ্ট্য সংজ্ঞায়িত করে: উপলব্ধ অনুভূমিক এবং উল্লম্ব স্থান। প্রতিটি বৈশিষ্ট্য দুটি মানের একটি নেয় — Compact (সীমিত স্থান) বা Regular (পর্যাপ্ত স্থান)। এই মানগুলির সংমিশ্রণ একটি ট্রেইট কালেকশন গঠন করে, যা সমস্ত ইন্টারফেস এলিমেন্টে পাঠানো হয়।
ইতিহাস এবং উদ্দেশ্য
Size Class-এর আগে, ডেভেলপাররা iPhone এবং iPad-এর জন্য আলাদা storyboard তৈরি করত বা কোডে UI_USER_INTERFACE_IDIOM() চেক ব্যবহার করত। এর ফলে কোড নকল, storyboard ফুলে যাওয়া এবং নতুন স্ক্রিন সাইজ সমর্থনে অসুবিধা হত। Size Class একটি সার্বজনীন পদ্ধতি অফার করে সমস্যার সমাধান করেছে: ডেভেলপার 4টি Compact/Regular সংমিশ্রণের জন্য ইন্টারফেস কনফিগার করে, এবং iOS স্বয়ংক্রিয়ভাবে উপযুক্তটি নির্বাচন করে। iPad-এ Split View এবং বিভিন্ন iPhone সাইজের আগমনের সাথে, সিস্টেমটি অ্যাডাপটিভ লেআউটের জন্য অপরিহার্য হয়ে উঠেছে।
Size Class কীভাবে কাজ করে
Size Class iOS দ্বারা বর্তমান স্ক্রিনের প্রস্থ এবং উচ্চতার ভিত্তিতে গণনা করা হয়, ওরিয়েন্টেশন এবং মাল্টিটাস্কিং বিবেচনা করে। মানগুলি নির্দিষ্ট পিক্সেলের সাথে আবদ্ধ নয় — এটি একটি যৌক্তিক শ্রেণী। উদাহরণস্বরূপ, iPhone 16 Pro পোর্ট্রেটে অনুভূমিক Compact এবং উল্লম্ব Regular। একই iPhone ল্যান্ডস্কেপে — উভয় অক্ষে Compact। Split View-এ 1/3 স্ক্রিনে অ্যাপ সহ iPad অনুভূমিক Compact পায়, যদিও পূর্ণ স্ক্রিন মোডে এটি Regular। সিস্টেমটি স্বয়ংক্রিয়ভাবে ওরিয়েন্টেশন বা Split View পরিবর্তনের সময় Size Class আপডেট করে।
কী কী সাইজ ক্লাস আছে
Size Class দুটি অক্ষে দুটি মানের চারটি সংমিশ্রণ ব্যবহার করে। প্রতিটি সংমিশ্রণের নিজস্ব প্রয়োগ রয়েছে ডিভাইসের ধরন এবং তার ওরিয়েন্টেশনের উপর নির্ভর করে। এই সংমিশ্রণগুলি বোঝা iOS-এর জন্য অ্যাডাপটিভ ইন্টারফেস ডিজাইনের ভিত্তি। সিস্টেমটি সমস্ত বর্তমান Apple ডিভাইস কভার করে: iPhone, iPad, Mac Catalyst এবং CarPlay। Apple wAny hAny সংমিশ্রণ (বেস লেআউট) দিয়ে ডিজাইন শুরু করতে এবং নির্দিষ্ট সংমিশ্রণের জন্য পরিমার্জন করতে সুপারিশ করে।
Size Class-এর চারটি সংমিশ্রণ
wCompact hRegular — পোর্ট্রেট iPhone (কিছু ক্ষেত্রে Plus/Max বাদে)। wCompact hCompact — ল্যান্ডস্কেপ iPhone SE/6/7/8। wRegular hRegular — যেকোনো ওরিয়েন্টেশনে পূর্ণ স্ক্রিন iPad, ল্যান্ডস্কেপে iPhone Plus/Max। wRegular hCompact — সংকীর্ণ বিষয়বস্তু সহ ল্যান্ডস্কেপে iPad। প্রতিটি সংমিশ্রণ নির্ধারণ করে কোন কনস্ট্রেইন্ট এবং এলিমেন্ট সক্রিয়। ডেভেলপার Interface Builder-এ প্রতিটি সংমিশ্রণের জন্য আলাদাভাবে চেহারা সেট করতে পারেন।
Mac Catalyst-এর জন্য Size Class
Mac Catalyst-এ, Size Class সর্বদা wRegular hRegular — পূর্ণ আকারের ইন্টারফেস। এর মানে হল iPad অ্যাপের Mac সংস্করণ সর্বোচ্চ স্থান পায়। ডেভেলপার Mac-কে iPad থেকে আলাদা করতে UIScreen.traitCollection.userInterfaceIdiom-এর মাধ্যমে অতিরিক্ত চেক ব্যবহার করতে পারেন। Mac-এ Size Class স্থিরভাবে কাজ করে, কিন্তু Catalyst অ্যাপগুলির প্রায়ই Size Class-এর বাইরে মাউস এবং কীবোর্ডের জন্য অতিরিক্ত অভিযোজন প্রয়োজন।
Size Class কীভাবে অ্যাডাপটিভ লেআউটকে প্রভাবিত করে
Size Class নির্ধারণ করে কোন Auto Layout কনস্ট্রেইন্ট সক্রিয়, কোন ইন্টারফেস এলিমেন্ট দৃশ্যমান এবং কীভাবে subviews সাজানো। ডেভেলপার বিভিন্ন Size Classes-এর জন্য আলাদা কনস্ট্রেইন্ট সেট করতে পারে, এবং ট্রেইট কালেকশন পরিবর্তনের সময় iOS স্বয়ংক্রিয়ভাবে সেগুলি সুইচ করে। উদাহরণস্বরূপ, iPad (wRegular hRegular)-এ বিস্তারিত সহ টেবিল Master-Detail-এ প্রদর্শিত হয়, iPhone (wCompact hRegular)-এ — Navigation Stack-এ। এটি Size Class-এর সাথে অ্যাডাপটিভ লেআউটের প্রধান পরিস্থিতি।
কনস্ট্রেইন্ট সেট করা এবং সরানো
Interface Builder-এ, ডেভেলপার Vary for Traits বাটনের মাধ্যমে Size Class সংমিশ্রণ নির্বাচন করে এবং কনস্ট্রেইন্ট যোগ করে যা শুধুমাত্র সেই সংমিশ্রণের জন্য প্রযোজ্য হওয়া উচিত। wAny hAny-র জন্য সেট করা কনস্ট্রেইন্ট সর্বদা প্রযোজ্য। নির্দিষ্ট সংমিশ্রণের জন্য সেট করা কনস্ট্রেইন্ট শুধুমাত্র Size Class মিললে সক্রিয় হয়। যদি কোনো সংমিশ্রণের জন্য বিশেষ কনস্ট্রেইন্ট সেট না থাকে, বেস কনস্ট্রেইন্ট ব্যবহার করা হয়। যখন Size Class পরিবর্তিত হয়, iOS কনস্ট্রেইন্ট সেটের মধ্যে ট্রানজিশন অ্যানিমেট করে।
এলিমেন্ট লুকানো এবং দেখানো
Interface Builder-এ Installed ফ্ল্যাগ নির্দিষ্ট Size Classes-এর জন্য এলিমেন্ট লুকানোর অনুমতি দেয়। ডেভেলপার নির্বাচিত সংমিশ্রণের জন্য একটি এলিমেন্টকে Uninstalled হিসাবে চিহ্নিত করে। উদাহরণস্বরূপ, Details বাটন শুধুমাত্র iPad (wRegular hRegular)-এ দৃশ্যমান, এবং iPhone-এ লুকানো। এটি কোডে isHidden পরিচালনার চেয়ে সহজ। প্রোগ্রামেটিক লুকানোর জন্য, traitCollectionDidChange ওভাররাইড করুন বা willTransition পদ্ধতি ব্যবহার করুন, বর্তমান Size Class পরীক্ষা করুন।
Interface Builder-এ Size Class ব্যবহার
Interface Builder Size Class-এর সাথে কাজ করার জন্য ভিজুয়াল Vary for Traits টুল প্রদান করে। ডেভেলপার পছন্দসই সংমিশ্রণ (প্রস্থ এবং উচ্চতা) নির্বাচন করে, এবং Interface Builder সেই সংমিশ্রণের জন্য একটি স্ক্রিন প্রিভিউ দেখায়। এই মোডে করা সমস্ত কনস্ট্রেইন্ট, আকার, ফন্ট এবং দৃশ্যমানতা পরিবর্তন শুধুমাত্র নির্বাচিত Size Class-এ প্রযোজ্য। মোড থেকে বের হলে সেটিংস সংরক্ষিত হয়। এই পদ্ধতি বিভিন্ন ডিভাইসের জন্য অভিযোজন কোড লেখার প্রয়োজনীয়তা প্রতিস্থাপন করে।
Interface Builder-এ ধাপে ধাপে কাজ
Interface Builder-এ Size Class কনফিগার করতে, ডেভেলপার একটি storyboard খোলে, view controller নির্বাচন করে এবং নিচের প্যানেলে Vary for Traits বাটনে ক্লিক করে। তারপর Width (Compact, Regular বা Any) এবং Height (Compact, Regular বা Any) নির্বাচন করে। ইন্টারফেস নির্বাচিত সংমিশ্রণের জন্য সম্পাদনা মোডে পরিবর্তিত হয়। সমস্ত কনস্ট্রেইন্ট পরিবর্তন, এলিমেন্ট যোগ বা অপসারণ শুধুমাত্র এই সংমিশ্রণে প্রযোজ্য। সেটআপ শেষ করার পর, ডেভেলপার মোড থেকে বের হয় — পরিবর্তনগুলি নির্দিষ্ট Size Class সংমিশ্রণের জন্য সংরক্ষিত হয়।
সেরা অনুশীলন
Apple wAny hAny (সমস্ত ডিভাইস কভার করে এমন বেস সংমিশ্রণ) এর জন্য বেস লেআউট দিয়ে শুরু করার পরামর্শ দেয়। তারপর সমস্যাযুক্ত সংমিশ্রণের জন্য লেআউট পরিমার্জন করুন: wCompact hRegular (পোর্ট্রেট iPhone) এবং wRegular hRegular (iPad)। প্রতিটি সংমিশ্রণ কনফিগার করার পরামর্শ দেওয়া হয় না — শুধুমাত্র যেখানে লেআউট ভেঙে যায়। অতিরিক্ত কনফিগারেশন রক্ষণাবেক্ষণ জটিল করে তোলে। সঠিক ফন্ট সাইজের জন্য, Size Class-এর পরিবর্তে Dynamic Type ব্যবহার করুন: ফন্টগুলি স্বয়ংক্রিয়ভাবে স্ক্রিন সাইজের সাথে খাপ খায়।
কোডে Size Class: UITraitCollection
UITraitCollection একটি iOS ক্লাস যা বর্তমান Size Class এবং অন্যান্য পরিবেশ বৈশিষ্ট্য (force touch, ডিসপ্লে স্কেল, ইউজার ইন্টারফেস ইডিয়ম) ধারণ করে। প্রতিটি UIView এবং UIViewController-এর নিজস্ব traitCollection আছে, যা প্যারেন্ট থেকে উত্তরাধিকার সূত্রে প্রাপ্ত। ডেভেলপার traitCollection.horizontalSizeClass এবং traitCollection.verticalSizeClass-এর মাধ্যমে Size Class পায়, যা UIUserInterfaceSizeClass (.compact, .regular বা .unspecified) রিটার্ন করে। Size Class পরিবর্তনগুলি traitCollectionDidChange ওভাররাইড করে ট্র্যাক করা হয়।
উদাহরণ: কোডে লেআউট পরিবর্তন
Size Class-এর সাথে UICollectionView লেআউট অভিযোজনের একটি উদাহরণ বিবেচনা করুন। iPad (wRegular hRegular)-এ দুটি কলাম সহ UICollectionViewCompositionalLayout ব্যবহার করুন, iPhone (wCompact hRegular)-এ — একটি দিয়ে। কোড অনুভূমিক Size Class পরীক্ষা করে এবং উপযুক্ত লেআউট নির্বাচন করে। রোটেশন বা Split View ট্রানজিশনে, iOS traitCollectionDidChange কল করে, এবং কন্ট্রোলার অ্যানিমেশন সহ লেআউট পরিবর্তন করে।
swift
override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
super.traitCollectionDidChange(previousTraitCollection)
if traitCollection.horizontalSizeClass == .Compact {
collectionView.collectionViewLayout = SingleColumnLayout()
} else {
collectionView.collectionViewLayout = DoubleColumnLayout()
}
}ট্রেইট কালেকশন পরিবর্তনে সাড়া দেওয়া
traitCollectionDidChange পদ্ধতি যেকোনো Size Class পরিবর্তনে কল করা হয়: ডিভাইস রোটেশন, Split View-এ প্রবেশ/প্রস্থান, বাহ্যিক ডিসপ্লে সংযোগ। এই পদ্ধতিতে, ডেভেলপার লেআউট আপডেট করে, কালেকশন রিলোড করে, কনস্ট্রেইন্ট অগ্রাধিকার আপডেট করে বা এলিমেন্ট দৃশ্যমানতা পরিবর্তন করে। এটি পরীক্ষা করা গুরুত্বপূর্ণ যে Size Class সত্যিই পরিবর্তিত হয়েছে কিনা, অন্য কোনো বৈশিষ্ট্য নয়: traitCollection.horizontalSizeClass-কে previousTraitCollection?.horizontalSizeClass-এর সাথে তুলনা করুন। অপ্টিমাইজেশন force touch বা ডিসপ্লে স্কেল পরিবর্তনের সময় অপ্রয়োজনীয় পুনরায় অঙ্কন প্রতিরোধ করে।
বিভিন্ন ডিভাইসে Size Class-এর বৈশিষ্ট্য
বিভিন্ন Apple ডিভাইসের Size Class-এর ভিন্ন সংমিশ্রণ আছে, এবং ডেভেলপারকে এই বৈশিষ্ট্যগুলি বিবেচনায় নিতে হবে। iPhone পোর্ট্রেটে — wCompact hRegular, ল্যান্ডস্কেপে — মডেলের উপর নির্ভর করে: iPhone SE/6/7/8 (wCompact hCompact), iPhone X এবং নতুন (wCompact hCompact বা wCompact hRegular বিষয়বস্তুর উপর নির্ভর করে)। iPad পূর্ণ স্ক্রিন মোডে — wRegular hRegular, Split View-এ — wCompact hRegular (1/3 স্ক্রিন) বা wRegular hRegular (2/3 স্ক্রিন) হতে পারে। Mac Catalyst — সর্বদা wRegular hRegular।
iPhone: সমস্ত সাইজ
iPhone-এ, Size Class অধিকাংশ মডেলের জন্য স্থিতিশীল, কিন্তু সূক্ষ্মতা আছে। iPhone Plus (6+, 7+, 8+) এবং Max (X, XS, 11 Pro, 13–16 Pro Max) ল্যান্ডস্কেপে wRegular hCompact — iPad mini-এর মতো। এটি বড় iPhone-এ ল্যান্ডস্কেপে দুটি কলামে বিষয়বস্তু রাখার অনুমতি দেয়। iPhone SE (1ম–3য় জেনারেশন) ল্যান্ডস্কেপে — wCompact hCompact। পোর্ট্রেটে সমস্ত iPhone-এ উল্লম্ব Size Class Regular, ল্যান্ডস্কেপে iPhone SE বাদে যেখানে এটি Compact। অনুভূমিক সর্বদা পোর্ট্রেট এবং ল্যান্ডস্কেপের জন্য Compact (ল্যান্ডস্কেপে Plus/Max বাদে)।
iPad এবং Split View
iPad পূর্ণ স্ক্রিন মোডে — wRegular hRegular, সর্বোচ্চ লেআউট নমনীয়তা প্রদান করে। Split View-এ, আচরণ পরিবর্তিত হয়: যদি অ্যাপ স্ক্রিনের 1/3 অংশ দখল করে (Slide Over বা 1/3-এ Split), অনুভূমিক Size Class Compact হয়ে যায়, যদিও উল্লম্ব Regular থাকে। 2/3 স্ক্রিনে — wRegular hRegular। ডেভেলপারের সমস্ত Split View মোডে ইন্টারফেস পরীক্ষা করা উচিত, কারণ Size Class গতিশীলভাবে পরিবর্তিত হয়। Apple iPad-এ সামঞ্জস্যপূর্ণ আচরণের জন্য UISplitViewController-এর সাথে Size Class ব্যবহার করার পরামর্শ দেয়।
প্রায়শই জিজ্ঞাসিত প্রশ্ন
Size Class CSS-এর ব্রেকপয়েন্ট থেকে কীভাবে আলাদা?
Size Class 4টি সংমিশ্রণ সহ একটি বিচ্ছিন্ন পদ্ধতি, যেখানে CSS ব্রেকপয়েন্টগুলি নির্বিচার সংখ্যক পয়েন্ট সহ একটি ধারাবাহিক পদ্ধতি। Size Class নির্দিষ্ট স্ক্রিন সাইজ থেকে বিমূর্ত হয়, আচরণ অনুসারে ডিভাইসগুলিকে গ্রুপ করে। CSS ব্রেকপয়েন্টগুলি পিক্সেলের সাথে আবদ্ধ, Size Class — যৌক্তিক Compact/Regular শ্রেণীর সাথে।
ল্যান্ডস্কেপে iPhone Plus-এর Size Class অনুভূমিক Regular কেন?
iPhone Plus/Max ল্যান্ডস্কেপে দুটি কলামে বিষয়বস্তু প্রদর্শনের জন্য যথেষ্ট স্ক্রিন প্রস্থ রাখে (iPad mini-এর মতো)। Apple অনুভূমিক Regular নির্ধারণ করে যাতে ডেভেলপার অতিরিক্ত চেক ছাড়াই মাল্টি-কলাম লেআউট ব্যবহার করতে পারে। এটি iPhone-এর জন্য Compact নিয়মের একটি ব্যতিক্রম।
Size Class কি প্রোগ্রামেটিকভাবে পরিবর্তন করা যায়?
Size Class প্রকৃত ডিভাইস বৈশিষ্ট্যের ভিত্তিতে iOS দ্বারা নির্ধারিত হয় এবং অ্যাপ কোড থেকে পরিবর্তন করা যায় না। ডেভেলপার শুধুমাত্র বর্তমান মানে প্রতিক্রিয়া জানাতে পারে। সিস্টেম UI সিস্টেম এলিমেন্টের জন্য Size Class ওভাররাইড করতে পারে, কিন্তু অ্যাপে এটি সম্ভব নয়।
SwiftUI-এর সাথে Size Class কীভাবে কাজ করে?
SwiftUI সরাসরি Size Class ব্যবহার করে না — পরিবর্তে, ডেভেলপার বর্তমান মান পড়ার জন্য @Environment(\.horizontalSizeClass) মডিফায়ার ব্যবহার করে। SwiftUI উচ্চ-স্তরের টুল সরবরাহ করে: Size Classes এবং AnyLayout Layout প্রোটোকলের সাথে অ্যাডাপটিভ লেআউটের জন্য।
বাহ্যিক মনিটর সংযোগ করলে Size Class আপডেট হয়?
হ্যাঁ, Stage Manager বা Sidecar-এর মাধ্যমে বাহ্যিক ডিসপ্লে সংযোগ করলে, iOS Size Class আপডেট করে। বাহ্যিক মনিটর সাধারণত wRegular hRegular পায়, যখন প্রধান স্ক্রিন তার Size Class ধরে রাখে। traitCollectionDidChange প্রতিটি স্ক্রিনে উইন্ডোর জন্য স্বাধীনভাবে কল করা হয়।
সারাংশ
- Size Class প্রতি অক্ষে দুটি Compact/Regular মান সহ iOS স্ক্রিন শ্রেণীবিভাগ পদ্ধতি, মোট 4টি সংমিশ্রণ।
- পোর্ট্রেটে iPhone — wCompact hRegular। পূর্ণ স্ক্রিন মোডে iPad — wRegular hRegular। ল্যান্ডস্কেপে iPhone Plus/Max — wRegular hCompact।
- Interface Builder প্রতিটি Size Class-এর জন্য কনস্ট্রেইন্ট এবং দৃশ্যমানতার ভিজুয়াল কনফিগারেশনের জন্য Vary for Traits সরবরাহ করে।
- UITraitCollection horizontalSizeClass এবং verticalSizeClass-এর মাধ্যমে Size Class পড়ার জন্য প্রোগ্রামেটিক API। পরিবর্তনগুলি traitCollectionDidChange-এ ট্র্যাক করা হয়।
- iPad-এ Split View গতিশীলভাবে Size Class পরিবর্তন করে: 1/3 স্ক্রিনে অনুভূমিক Compact হয়ে যায়, যার জন্য লেআউট অভিযোজন প্রয়োজন।
- SwiftUI Size Class পড়ার জন্য @Environment(\.horizontalSizeClass) এবং রানটাইমে লেআউটের মধ্যে পরিবর্তনের জন্য AnyLayout সরবরাহ করে।
- সুপারিশ wAny hAny-র জন্য লেআউট দিয়ে শুরু করুন, তারপর wCompact hRegular (iPhone) এবং wRegular hRegular (iPad)-এর জন্য অভিযোজিত করুন, বাকি সংমিশ্রণগুলি ওভারলোড না করে।
আমরা একটি মোবাইল অ্যাপ্লিকেশন টার্নকি তৈরি করব
IT Sectr 2017 সাল থেকে স্টার্টআপ এবং ব্যবসার জন্য iOS এবং Android অ্যাপ্লিকেশন তৈরি করে। আমরা আপনাকে পরামর্শ দেব এবং সেরা সমাধান প্রস্তাব করব।
আরও পড়ুন