آموزش Column Layout در جت پک کامپوز

آموزش Column Layout در جت پک کامپوز
برای پخش این ویدیو باید ابتدا وارد سایت شوید.
ورود ثبت نام

آموزش Column Layout در جت پک کامپوز

تمام ویدیوهای آموزش Jetpack Compose؛ توسعه UI در اندروید، دسکتاپ و وب
شروع کار با Jetpack Compose
آشنایی با کامپوننت‌ها در جت پک کامپوز
چیدمان عناصر در Jetpack Compose
مفهوم State در جت پک کامپوز
مجموعه آیتم‌ها
توسعه تم (پوسته) اپلیکیشن

هدف از Layout در Jetpack Compose

جت پک کامپوز برای توسعه UI از لایه‌ها برای مشخص کردن موقعیت کامپوننت‌ها استفاده می‌کند.

جت پک کامپوز برای تبدیل حالت‌ها به عناصر UI از طریق موارد زیر بهره می‌برد:

  • ترکیب عناصر
  • چیدمان عناصر
  • ترسیم عناصر

در اینجا ما به بررسی چیدمان عناصر به کمک ستون‌ها (Column) خواهیم پرداخت.

 

چرا به ستون‌ها نیاز داریم؟

فرض کنید که دو کامپوننت را به شکل زیر در UI خود تعریف کرده‌اید:

@Composable fun ArtistCard() { Text("Alfred Sisley") Text("3 minutes ago") }

 

در این کد هر دو متن بر روی هم هم‌پوشانی خواهند شد. دلیل این امر این است که هیچگونه چیدمانی برای کامپوننت‌های خود در نظر نگرفته‌ایم.

اگر بخواهیم این عناصر به صورت زیر هم و عمودی قرار گیرند، باید یک Column تعریف کنید.

@Composable fun ArtistCard() { Column { Text("Alfred Sisley") Text("3 minutes ago") } }

 

ارسال نظر :
پاسخ به