Jetpack Compose از قابلیت همکاری با Views پشتیبانی میکند - میتوانید از Compose در Views و Views در Compose استفاده کنید. این امر امکان پذیرش Compose را در برنامههای مبتنی بر View موجود بدون نیاز به انتقال فوری همه Views فراهم میکند.
مراحل مهاجرت
- ایجاد یک برنامه: یک برنامه قوی و گام به گام برای انجام مهاجرت ایجاد کنید. ما یک لیست اولویتبندی شده از کارهای مهاجرت را توصیه میکنیم.
- کاندیدای XML برای مهاجرت را شناسایی کنید: کوچکترین اجزایی که گرههای برگ در سلسله مراتب هستند را شناسایی و از آنها شروع کنید و طرح مهاجرت را از پایین به بالا به تدریج به اجزای بالاتر در سلسله مراتب گسترش دهید. کاندیداهای خوب برای مهاجرت اولیه، کوچک، بدون تابعیت و دارای وابستگیهای کمتر هستند.
- سلسله مراتب را تجزیه و تحلیل کنید: پس از شناسایی نمای XML برای مهاجرت، ساختار طرح XML و پیادهسازی آن را تجزیه و تحلیل کنید.
- ثبت وضعیت اولیه: یک تست اسکرینشات اجرا کنید تا وضعیت اولیه نمای XML انتخابشده ثبت شود.
- پیشنیاز: تنظیم وابستگیهای Compose مشخص کنید که آیا پروژه وابستگیهای Compose و کامپایلر را تنظیم کرده است یا خیر. اگر اینطور نیست، بخش «تنظیم وابستگیهای Compose و کامپایلر» را دنبال کنید.
- پیشنیاز: تنظیم قالببندی Compose. مشخص کنید که آیا پروژه از قبل تنظیمات قالببندی Compose را دارد یا خیر. اگر ندارد، از تنظیم قالببندی Compose پیروی کنید. قالببندی XML اصلی را در حین تعامل برنامه نگه دارید. برای درک الگوهای نحوهی بیان و تا زمانی که پروژه به طور کامل به Compose منتقل شود ، Migrate XML Theme to Compose را انجام دهید.
- انتقال نمای XML به Compose: تبدیل کد XML به Compose را شروع کنید، قالببندی مناسب را اعمال کنید و پیشنمایشهای Compose را برای Composableهای منتقلشده اضافه کنید. برای سناریوهای رایج انتقال، به منابع اضافی مراجعه کنید. به عنوان مثال، برای انتقال به APIهای Lazy در Compose، مراحل Migrate RecyclerView to Compose را دنبال کنید.
- جایگزینی کاربردها: کاربردهای قبلی نمای XML را برای استفاده از مؤلفه جدید Compose جایگزین کنید. برای افزودن Compose در Views، مراحل موجود در Compose in Views را دنبال کنید. برای افزودن Views در Compose، مراحل موجود در Views in Compose را دنبال کنید.
- اعتبارسنجی مهاجرت: تأیید کنید که وضعیت اولیه ثبتشده در تست اسکرینشات با پیشنمایش Composable منتقلشده یکسان باشد. اگر مطابقت نداشتند، روی رابط کاربری Composable جدید تکرار کنید و آن را بهبود دهید تا با وضعیت اولیه همتراز شود. تستهای رابط کاربری Compose جدیدی برای Composable جدید ایجاد کنید.
- حذف XML: به محض اینکه کامپوننت تازه منتقل شده با رابط کاربری XML اولیه مطابقت پیدا کرد، کد منسوخ شده XML View و تستهای آن را حذف کنید.
سناریوهای رایج مهاجرت
تأیید کنید که پسوندهای dp و sp ( 16.dp ، 20.sp ) در composableها استفاده میشوند. اگر tools:text در نمای XML وجود دارد، از آن در یک composable جداگانه @Preview استفاده کنید.
تبدیل ویژگی به اصلاحکننده
بیشتر ویژگیهای XML بخشی از زنجیره modifier یا پارامترهای تابع composable میشوند.
| ویژگی XML | معادل نوشتن |
|---|---|
android:layout_width="match_parent" | Modifier.fillMaxWidth() |
android:layout_height="match_parent" | Modifier.fillMaxHeight() |
android:layout_width="wrap_content" | (رفتار پیشفرض، معمولاً نیازی به اصلاحکننده نیست) |
android:padding="Xdp" | Modifier.padding(X.dp) |
android:layout_margin="Xdp" | Modifier.padding(X.dp) (لایه بیرونی) |
android:gravity="center" | contentAlignment = Alignment.Center (جعبهای) یا horizontalAlignment / verticalArrangement (ستون/ردیف) |
android:background="@color/white" | Modifier.background(colorResource(R.color.white)) |
android:visibility="gone" | داخل بلوک if (visible) { ... } قرار میگیرد. |
انتقال استایلها (styles.xml)
سبکهای XML اغلب چندین ویژگی را برای ایجاد یک سبک ترکیب میکنند. در Compose، این کار با ایجاد یک متغیر قابل ترکیب با یک سبک خاص انجام میشود.
توابع @Composable جداگانهای را با نامهای متناسب با سبک و کامپوننت پایه ارائه دهید تا تفاوت در سبکبندی و موارد استفاده برای آن کامپوننتها را نشان دهند.
- الگو: اگر یک عنصر XML از یک سبک سفارشی استفاده میکند (مثلاً
style="@style/MyPrimaryButton")، سعی نکنید آن سبک را به صورت درونخطی تکرار کنید. در عوض، پیشنهاد دهید که یک composable خاص ایجاد شود. - مثال:
- XML:
<Button style="@style/MyPrimaryButton" ... /> - نوشتن:
MyPrimaryButton(onClick = { ... })
- XML:
- گروههای ویژگی مشترک: اگر یک استایل، اصلاحکنندههای مشترکی (مانند padding + height) را تنظیم میکند، آنها را در یک ویژگی افزونهی خوانا یا یک متغیر اصلاحکنندهی مشترک استخراج کنید.