Jetpack Compose چندین محفظه چیدمان ارائه میدهد تا به شما در ساختاردهی و
مرتب کردن مؤلفههای میانای کاربر کمک کند. درحالیکه ترکیبپذیرهای چیدمان اصلی مانند Row و
Column ترتیبهای ساده را مدیریت میکنند، بسیاری از برنامهها با تغییر اندازه صفحهنمایش و رشد دادههای کاربر به راهحلهای محفظه واکنشگراتر و سازگارتر نیاز دارند.
محفظههای چیدمان شامل موارد زیر است:
- فهرستهای تنبل و شبکههای تنبل: مؤلفههایی مانند
LazyColumn،LazyRow، وLazyVerticalGridکه مجموعههای داده بزرگ یا با اندازه پویا را بهطور کارآمد فقط با ترکیببندی و چیدمان مواردی که درحالحاضر در نمای دید قابلمشاهده هستند نمایش میدهند. - ورقزن: دربرگیرندههایی مثل
HorizontalPagerوVerticalPagerکه به کاربران امکان میدهند بین صفحههای محتوا تند بکشند یا پیمایش کنند. - چیدمانهای جاری: محفظههای یکبعدی واکنشگرا
(
FlowRowوFlowColumn) که وقتی فضا تمام میشود، بهطور خودکار موارد سرریز را به ردیف یا ستون بعدی منتقل میکنند. - شبکه: ساختاری انعطافپذیر و دوبعدی که موارد را در چیدمانهای چندستونی یا چندردیفی نمایش میدهد و با اندازه ظرف سازگار میشود.
- FlexBox: محفظه سازگارشوندهای با الهام از CSS Flexbox که کنترل دقیقی بر نحوه پیچیدن، رشد، کوچک شدن، و تراز شدن موارد در امتداد محورهای اصلی و متقاطع برای پر کردن فضای دردسترس ارائه میدهد.
انتخاب محتوی چیدمان درست
هنگام ساختن چیدمان در Compose، انتخاب بین محفظههای چیدمان پایه و پیشرفتهتر به طراحی شما، اینکه آیا موارد باید درصورت محدود بودن فضا پیچیده شوند، و نحوه تغییر اندازه پویای موارد بستگی دارد.
جدول زیر قابلیتهای هریک از محفظههای چیدمان Compose 1D را خلاصه میکند:
محتوی |
موارد را به خطوط جدید میبرد |
رشد هر مورد |
کوچک کردن هر مورد |
اندازه شروع هر مورد |
موارد بزرگ میشوند تا فضای دردسترس را در چند خط پر کنند |
تغییر ترتیب موارد |
بارکردن کُند |
بهترین برای: |
ردیف / ستون |
❌ |
✅ (ازطریق |
❌ |
❌ |
❌ |
❌ |
❌ |
|
FlowRow / FlowColumn |
✅ |
محدود |
❌ |
❌ |
جزئی |
❌ |
❌ |
|
LazyRow / LazyColumn |
❌ |
❌ |
❌ |
❌ |
❌ |
❌ |
✅ |
|
FlexBox |
✅ |
✅ |
✅ |
✅ |
✅ |
✅ |
❌ |
|
جدول زیر قابلیتهای Grid و سایر ترکیبپذیرهای مشابه را خلاصه میکند:
محتوی |
تراز دوبعدی دقیق |
گسترش مورد (ستونها) |
گسترش مورد (ردیفها) |
بارکردن کُند |
بهترین برای: |
شبکه |
✅ |
✅ (ازطریق |
✅ |
❌ |
|
LazyVerticalGrid |
✅ |
✅ (ازطریق |
❌ |
✅ |
|
LazyStaggeredGrid |
❌ (فقط ۱ روز) |
جزئی (فقط بازه کامل) |
❌ |
✅ |
|
LazyHorizontalGrid |
✅ |
❌ |
✅ |
✅ |
|
ترکیب کردن ردیفها و ستونها |
❌ |
❌ |
❌ |
❌ |
|