با مجموعهها، منظم بمانید
ذخیره و طبقهبندی محتوا براساس اولویتهای شما.
برای بهترین تجربه در توسعه با Compose، Android Studio را دانلود و نصب کنید. این شامل بسیاری از ویژگیهای ویرایشگر هوشمند ، مانند قالبهای پروژه جدید و امکان پیشنمایش فوری نوشتن رابط کاربری و انیمیشنها است.
برای ایجاد یک پروژه برنامه جدید Compose، تنظیم Compose برای یک پروژه برنامه موجود یا وارد کردن یک برنامه نمونه نوشته شده در Compose، این دستورالعمل ها را دنبال کنید.
یک برنامه جدید با پشتیبانی از Compose ایجاد کنید
اگر میخواهید پروژه جدیدی را شروع کنید که به طور پیشفرض از Compose پشتیبانی میکند، Android Studio شامل قالبهای مختلف پروژه است تا به شما در شروع کار کمک کند. برای ایجاد یک پروژه جدید که تنظیمات Compose را به درستی انجام داده است، به صورت زیر عمل کنید:
اگر در پنجره خوش آمدید به Android Studio هستید، روی Start a new Android Studio کلیک کنید. اگر از قبل یک پروژه Android Studio باز دارید، File > New > New Project را از نوار منو انتخاب کنید.
در پنجره Select a Project Template ، Empty Activity را انتخاب کرده و روی Next کلیک کنید.
در پنجره Configure your project ، موارد زیر را انجام دهید:
نام، نام بسته و ذخیره مکان را به طور معمول تنظیم کنید. توجه داشته باشید که در منوی کشویی Language ، Kotlin تنها گزینه موجود است زیرا Jetpack Compose فقط با کلاسهای نوشته شده در Kotlin کار میکند.
در منوی کشویی حداقل سطح API ، سطح API 21 یا بالاتر را انتخاب کنید.
روی Finish کلیک کنید.
اکنون شما آماده شروع توسعه یک برنامه با استفاده از Jetpack Compose هستید. برای کمک به شروع کار و یادگیری در مورد کارهایی که میتوانید با جعبه ابزار انجام دهید، آموزش Jetpack Compose را امتحان کنید.
در نهایت، Compose BOM و زیر مجموعه وابستگی های کتابخانه Compose را که نیاز دارید به وابستگی های خود از بلوک زیر اضافه کنید:
شیار
dependencies{defcomposeBom=platform('androidx.compose:compose-bom:2025.08.00')implementationcomposeBomandroidTestImplementationcomposeBom// Choose one of the following:// Material Design 3implementation'androidx.compose.material3:material3'// or Material Design 2implementation'androidx.compose.material:material'// or skip Material Design and build directly on top of foundational componentsimplementation'androidx.compose.foundation:foundation'// or only import the main APIs for the underlying toolkit systems,// such as input and measurement/layoutimplementation'androidx.compose.ui:ui'// Android Studio Preview supportimplementation'androidx.compose.ui:ui-tooling-preview'debugImplementation'androidx.compose.ui:ui-tooling'// UI TestsandroidTestImplementation'androidx.compose.ui:ui-test-junit4'debugImplementation'androidx.compose.ui:ui-test-manifest'// Optional - Included automatically by material, only add when you need// the icons but not the material library (e.g. when using Material3 or a// custom design system based on Foundation)implementation'androidx.compose.material:material-icons-core'// Optional - Add full set of material iconsimplementation'androidx.compose.material:material-icons-extended'// Optional - Add window size utilsimplementation'androidx.compose.material3.adaptive:adaptive'// Optional - Integration with activitiesimplementation'androidx.activity:activity-compose:1.10.1'// Optional - Integration with ViewModelsimplementation'androidx.lifecycle:lifecycle-viewmodel-compose:2.8.5'// Optional - Integration with LiveDataimplementation'androidx.compose.runtime:runtime-livedata'// Optional - Integration with RxJavaimplementation'androidx.compose.runtime:runtime-rxjava2'}
کاتلین
dependencies{valcomposeBom=platform("androidx.compose:compose-bom:2025.08.00")implementation(composeBom)androidTestImplementation(composeBom)// Choose one of the following:// Material Design 3implementation("androidx.compose.material3:material3")// or Material Design 2implementation("androidx.compose.material:material")// or skip Material Design and build directly on top of foundational componentsimplementation("androidx.compose.foundation:foundation")// or only import the main APIs for the underlying toolkit systems,// such as input and measurement/layoutimplementation("androidx.compose.ui:ui")// Android Studio Preview supportimplementation("androidx.compose.ui:ui-tooling-preview")debugImplementation("androidx.compose.ui:ui-tooling")// UI TestsandroidTestImplementation("androidx.compose.ui:ui-test-junit4")debugImplementation("androidx.compose.ui:ui-test-manifest")// Optional - Included automatically by material, only add when you need// the icons but not the material library (e.g. when using Material3 or a// custom design system based on Foundation)implementation("androidx.compose.material:material-icons-core")// Optional - Add full set of material iconsimplementation("androidx.compose.material:material-icons-extended")// Optional - Add window size utilsimplementation("androidx.compose.material3.adaptive:adaptive")// Optional - Integration with activitiesimplementation("androidx.activity:activity-compose:1.10.1")// Optional - Integration with ViewModelsimplementation("androidx.lifecycle:lifecycle-viewmodel-compose:2.8.5")// Optional - Integration with LiveDataimplementation("androidx.compose.runtime:runtime-livedata")// Optional - Integration with RxJavaimplementation("androidx.compose.runtime:runtime-rxjava2")}
برنامه های نمونه Jetpack Compose را امتحان کنید
سریعترین راه برای آزمایش قابلیتهای Jetpack Compose، آزمایش برنامههای نمونه Jetpack Compose است که در GitHub میزبانی میشوند. برای وارد کردن نمونه پروژه برنامه از اندروید استودیو به صورت زیر عمل کنید:
اگر در پنجره خوش آمدید به Android Studio هستید، گزینه Import an Code Code را انتخاب کنید. اگر قبلاً یک پروژه Android Studio باز دارید، File > New > Import Sample را از نوار منو انتخاب کنید.
در نوار جستجو نزدیک بالای جادوگر Browse Samples ، «نوشتن» را تایپ کنید.
یکی از برنامه های نمونه Jetpack Compose را از نتایج جستجو انتخاب کنید و روی Next کلیک کنید.
یا نام برنامه و مکان پروژه را تغییر دهید یا مقادیر پیش فرض را حفظ کنید.
روی Finish کلیک کنید.
Android Studio نمونه برنامه را در مسیری که شما مشخص کرده اید دانلود می کند و پروژه را باز می کند. سپس میتوانید MainActivity.kt در هر یک از مثالها بررسی کنید تا APIهای Jetpack Compose مانند انیمیشن crossfade، اجزای سفارشی، استفاده از تایپوگرافی و نمایش رنگهای روشن و تیره را در پیشنمایش درون IDE ببینید.
محتوا و نمونه کدها در این صفحه مشمول پروانههای توصیفشده در پروانه محتوا هستند. جاوا و OpenJDK علامتهای تجاری یا علامتهای تجاری ثبتشده Oracle و/یا وابستههای آن هستند.
تاریخ آخرین بهروزرسانی 2025-08-21 بهوقت ساعت هماهنگ جهانی.
[[["درک آسان","easyToUnderstand","thumb-up"],["مشکلم را برطرف کرد","solvedMyProblem","thumb-up"],["غیره","otherUp","thumb-up"]],[["اطلاعاتی که نیاز دارم وجود ندارد","missingTheInformationINeed","thumb-down"],["بیشازحد پیچیده/ مراحل بسیار زیاد","tooComplicatedTooManySteps","thumb-down"],["قدیمی","outOfDate","thumb-down"],["مشکل ترجمه","translationIssue","thumb-down"],["مشکل کد / نمونهها","samplesCodeIssue","thumb-down"],["غیره","otherDown","thumb-down"]],["تاریخ آخرین بهروزرسانی 2025-08-21 بهوقت ساعت هماهنگ جهانی."],[],[],null,["# Quick start\n\nFor the best experience developing with Compose, download and install [Android\nStudio](/studio). It includes many [smart editor features](/develop/ui/compose/tooling), such as new project\ntemplates and the ability to immediately preview your Compose UI and animations.\n\n[Get Android Studio](/studio)\n\nFollow these instructions to create a new Compose app project, set up\nCompose for an existing app project, or import a sample app written in Compose.\n\nCreate a new app with support for Compose\n-----------------------------------------\n\nIf you want to start a new project that includes support for Compose by default,\nAndroid Studio includes various project templates to help you get started. To\ncreate a new project that has Compose setup correctly, proceed as follows:\n\n1. If you're in the **Welcome to Android Studio** window, click **Start a new\n Android Studio project** . If you already have an Android Studio project open , select **File \\\u003e New \\\u003e New Project** from the menu bar.\n2. In the **Select a Project Template** window, select **Empty\n Activity** and click **Next**.\n3. In the **Configure your project** window, do the following:\n 1. Set the **Name, Package name** , and **Save location** as you normally would. Note that, in the **Language** dropdown menu, **Kotlin** is the only available option because Jetpack Compose works only with classes written in Kotlin.\n 2. In the **Minimum API level dropdown** menu, select API level 21 or higher.\n4. Click **Finish**.\n\nNow you're ready to start developing an app using Jetpack Compose. To help you\nget started and learn about what you can do with the toolkit, try the [Jetpack\nCompose tutorial](/develop/ui/compose/tutorial).\n\nSet up Compose for an existing app\n----------------------------------\n\nFirst, configure the Compose compiler using the [Compose\nCompiler Gradle plugin](/develop/ui/compose/compiler).\n\nThen, add the following definition to your app's `build.gradle` file: \n\n### Groovy\n\n android {\n buildFeatures {\n compose true\n }\n }\n\n### Kotlin\n\n android {\n buildFeatures {\n compose = true\n }\n }\n\nSetting the `compose` flag to `true` inside the Android [`BuildFeatures`](/reference/tools/gradle-api/7.0/com/android/build/api/dsl/BuildFeatures)\nblock enables [Compose functionality](/develop/ui/compose/tooling) in Android Studio.\n\nFinally, add the Compose BOM and the subset of Compose library dependencies\nyou need to your dependencies from the following block: \n\n### Groovy\n\n dependencies {\n\n def composeBom = platform('androidx.compose:compose-bom:2025.08.00')\n implementation composeBom\n androidTestImplementation composeBom\n\n // Choose one of the following:\n // Material Design 3\n implementation 'androidx.compose.material3:material3'\n // or Material Design 2\n implementation 'androidx.compose.material:material'\n // or skip Material Design and build directly on top of foundational components\n implementation 'androidx.compose.foundation:foundation'\n // or only import the main APIs for the underlying toolkit systems,\n // such as input and measurement/layout\n implementation 'androidx.compose.ui:ui'\n\n // Android Studio Preview support\n implementation 'androidx.compose.ui:ui-tooling-preview'\n debugImplementation 'androidx.compose.ui:ui-tooling'\n\n // UI Tests\n androidTestImplementation 'androidx.compose.ui:ui-test-junit4'\n debugImplementation 'androidx.compose.ui:ui-test-manifest'\n\n // Optional - Included automatically by material, only add when you need\n // the icons but not the material library (e.g. when using Material3 or a\n // custom design system based on Foundation)\n implementation 'androidx.compose.material:material-icons-core'\n // Optional - Add full set of material icons\n implementation 'androidx.compose.material:material-icons-extended'\n // Optional - Add window size utils\n implementation 'androidx.compose.material3.adaptive:adaptive'\n\n // Optional - Integration with activities\n implementation 'androidx.activity:activity-compose:1.10.1'\n // Optional - Integration with ViewModels\n implementation 'androidx.lifecycle:lifecycle-viewmodel-compose:2.8.5'\n // Optional - Integration with LiveData\n implementation 'androidx.compose.runtime:runtime-livedata'\n // Optional - Integration with RxJava\n implementation 'androidx.compose.runtime:runtime-rxjava2'\n\n }\n\n### Kotlin\n\n dependencies {\n\n val composeBom = platform(\"androidx.compose:compose-bom:2025.08.00\")\n implementation(composeBom)\n androidTestImplementation(composeBom)\n\n // Choose one of the following:\n // Material Design 3\n implementation(\"androidx.compose.material3:material3\")\n // or Material Design 2\n implementation(\"androidx.compose.material:material\")\n // or skip Material Design and build directly on top of foundational components\n implementation(\"androidx.compose.foundation:foundation\")\n // or only import the main APIs for the underlying toolkit systems,\n // such as input and measurement/layout\n implementation(\"androidx.compose.ui:ui\")\n\n // Android Studio Preview support\n implementation(\"androidx.compose.ui:ui-tooling-preview\")\n debugImplementation(\"androidx.compose.ui:ui-tooling\")\n\n // UI Tests\n androidTestImplementation(\"androidx.compose.ui:ui-test-junit4\")\n debugImplementation(\"androidx.compose.ui:ui-test-manifest\")\n\n // Optional - Included automatically by material, only add when you need\n // the icons but not the material library (e.g. when using Material3 or a\n // custom design system based on Foundation)\n implementation(\"androidx.compose.material:material-icons-core\")\n // Optional - Add full set of material icons\n implementation(\"androidx.compose.material:material-icons-extended\")\n // Optional - Add window size utils\n implementation(\"androidx.compose.material3.adaptive:adaptive\")\n\n // Optional - Integration with activities\n implementation(\"androidx.activity:activity-compose:1.10.1\")\n // Optional - Integration with ViewModels\n implementation(\"androidx.lifecycle:lifecycle-viewmodel-compose:2.8.5\")\n // Optional - Integration with LiveData\n implementation(\"androidx.compose.runtime:runtime-livedata\")\n // Optional - Integration with RxJava\n implementation(\"androidx.compose.runtime:runtime-rxjava2\")\n\n }\n\n| **Note:** Jetpack Compose is shipped using a Bill of Materials (BOM), to keep the versions of all library groups in sync. Read more about it in the [Bill of\n| Materials page](/develop/ui/compose/bom/bom).\n\nTry Jetpack Compose sample apps\n-------------------------------\n\nThe fastest way to experiment with the capabilities of Jetpack Compose is by\ntrying [Jetpack Compose sample apps](https://github.com/android/compose-samples) hosted on GitHub. To import\na sample app project from Android Studio, proceed as follows:\n\n1. If you're in the **Welcome to Android Studio** window, select **Import an\n Android code sample** . If you already have an Android Studio project open, select **File \\\u003e New \\\u003e Import Sample** from the menu bar.\n2. In the search bar near the top of the **Browse Samples** wizard, type \"compose\".\n3. Select one of the Jetpack Compose sample apps from the search results and click **Next**.\n4. Either change the **Application name** and **Project location** or keep the default values.\n5. Click **Finish**.\n\nAndroid Studio downloads the sample app to the path you specified and opens the\nproject. You can then inspect `MainActivity.kt` in each of the examples to see\nJetpack Compose APIs such as crossfade animation, custom components, using\ntypography, and displaying light and dark colors in the in-IDE preview.\n\nTo use Jetpack Compose for Wear OS, see [Set up Jetpack Compose on Wear OS](/training/wearables/compose-setup).\n\nRecommended for you\n-------------------\n\n- Note: link text is displayed when JavaScript is off\n- [Navigating with Compose](/develop/ui/compose/navigation)\n- [Testing your Compose layout](/develop/ui/compose/testing)\n- [React to focus](/develop/ui/compose/touch-input/focus/react-to-focus)"]]