התחלה מהירה

כדי ליהנות מחוויית הפיתוח הטובה ביותר עם Compose, כדאי להוריד ולהתקין את Android Studio. הוא כולל הרבה תכונות עריכה חכמות, כמו תבניות פרויקט חדשות ואפשרות לראות מיד תצוגה מקדימה של ממשק המשתמש ואנימציות של הכתיבה.

להורדת Android Studio

בעזרת ההוראות הבאות תוכלו ליצור פרויקט אפליקציה חדש ב-Compose, להגדיר את Compose לפרויקט אפליקציה קיים או לייבא אפליקציה לדוגמה שנכתבה ב-Compose.

יצירת אפליקציה חדשה עם תמיכה ב-Compose

אם רוצים להתחיל פרויקט חדש שכולל תמיכה ב-Compose כברירת מחדל, אפשר להיעזר בתבניות השונות של פרויקטים ב-Android Studio. כדי ליצור פרויקט חדש עם הגדרה נכונה של Compose:

  1. אם אתם נמצאים בחלון Welcome to Android Studio, לוחצים על Start a new Android Studio project. אם כבר פתחתם פרויקט ב-Android Studio, תוכלו לבחור באפשרות קובץ > חדש > פרויקט חדש בסרגל התפריטים.
  2. בחלון Select a Project Template, בוחרים באפשרות Empty Activity ולוחצים על Next.
  3. בחלון Configure your project (הגדרת הפרויקט), מבצעים את הפעולות הבאות:
    1. מגדירים את הערכים Name, Package name ו-Save location כרגיל. שימו לב שבתפריט הנפתח Language, האפשרות היחידה שזמינה היא Kotlin, כי Jetpack Compose פועל רק עם כיתות שנכתבו ב-Kotlin.
    2. בתפריט Minimum API level drop-down בוחרים ברמת API 21 ואילך.
  4. לוחצים על סיום.

עכשיו אתם מוכנים להתחיל לפתח אפליקציה באמצעות Jetpack Compose. כדי ללמוד מה אפשר לעשות עם ערכת הכלים, תוכלו להיעזר במדריך של Jetpack פיתוח נייטיב.

הגדרת Compose לאפליקציה קיימת

קודם כול, מגדירים את המהדר של Compose באמצעות הפלאגין Gradle של Compose Compiler.

לאחר מכן צריך להוסיף את ההגדרה הבאה לקובץ build.gradle של האפליקציה:

GroovyKotlin
android {
    buildFeatures {
        compose true
    }
}

android {
    buildFeatures {
        compose = true
    }
}

הגדרת הדגל compose לערך true בתוך הבלוק BuildFeatures של Android מאפשרת להשתמש בפונקציונליות של Compose ב-Android Studio.

לבסוף, מוסיפים את ה-BOM של Compose ואת קבוצת המשנה של יחסי התלות בספריות של Compose שנחוצים לכם ליחסי התלות מהבלוק הבא:

GroovyKotlin
dependencies {

    def composeBom = platform('androidx.compose:compose-bom:2025.02.00')
    implementation composeBom
    androidTestImplementation composeBom

    // Choose one of the following:
    // Material Design 3
    implementation 'androidx.compose.material3:material3'
    // or Material Design 2
    implementation 'androidx.compose.material:material'
    // or skip Material Design and build directly on top of foundational components
    implementation 'androidx.compose.foundation:foundation'
    // or only import the main APIs for the underlying toolkit systems,
    // such as input and measurement/layout
    implementation 'androidx.compose.ui:ui'

    // Android Studio Preview support
    implementation 'androidx.compose.ui:ui-tooling-preview'
    debugImplementation 'androidx.compose.ui:ui-tooling'

    // UI Tests
    androidTestImplementation '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 icons
    implementation 'androidx.compose.material:material-icons-extended'
    // Optional - Add window size utils
    implementation 'androidx.compose.material3.adaptive:adaptive'

    // Optional - Integration with activities
    implementation 'androidx.activity:activity-compose:1.10.0'
    // Optional - Integration with ViewModels
    implementation 'androidx.lifecycle:lifecycle-viewmodel-compose:2.8.5'
    // Optional - Integration with LiveData
    implementation 'androidx.compose.runtime:runtime-livedata'
    // Optional - Integration with RxJava
    implementation 'androidx.compose.runtime:runtime-rxjava2'

}

dependencies {

    val composeBom = platform("androidx.compose:compose-bom:2025.02.00")
    implementation(composeBom)
    androidTestImplementation(composeBom)

    // Choose one of the following:
    // Material Design 3
    implementation("androidx.compose.material3:material3")
    // or Material Design 2
    implementation("androidx.compose.material:material")
    // or skip Material Design and build directly on top of foundational components
    implementation("androidx.compose.foundation:foundation")
    // or only import the main APIs for the underlying toolkit systems,
    // such as input and measurement/layout
    implementation("androidx.compose.ui:ui")

    // Android Studio Preview support
    implementation("androidx.compose.ui:ui-tooling-preview")
    debugImplementation("androidx.compose.ui:ui-tooling")

    // UI Tests
    androidTestImplementation("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 icons
    implementation("androidx.compose.material:material-icons-extended")
    // Optional - Add window size utils
    implementation("androidx.compose.material3.adaptive:adaptive")

    // Optional - Integration with activities
    implementation("androidx.activity:activity-compose:1.10.0")
    // Optional - Integration with ViewModels
    implementation("androidx.lifecycle:lifecycle-viewmodel-compose:2.8.5")
    // Optional - Integration with LiveData
    implementation("androidx.compose.runtime:runtime-livedata")
    // Optional - Integration with RxJava
    implementation("androidx.compose.runtime:runtime-rxjava2")

}

ניסיון באפליקציות לדוגמה של Jetpack Compose

הדרך המהירה ביותר להתנסות ביכולות של Jetpack Compose היא לנסות את האפליקציות לדוגמה של Jetpack Compose שמתארחות ב-GitHub. כדי לייבא פרויקט אפליקציה לדוגמה מ-Android Studio:

  1. אם אתם נמצאים בחלון Welcome to Android Studio, בוחרים באפשרות Import an Android code sample. אם כבר יש לכם פרויקט פתוח ב-Android Studio, תוכלו לבחור באפשרות קובץ > חדש > ייבוא דוגמה בסרגל התפריטים.
  2. בסרגל החיפוש שבחלק העליון של האשף Browse Samples, מקלידים "compose".
  3. בוחרים אחת מהאפליקציות לדוגמה של 'Jetpack פיתוח נייטיב' מתוצאות החיפוש ולוחצים על Next.
  4. משנים את Application name ואת Project location או משאירים את ערכי ברירת המחדל.
  5. לוחצים על סיום.

Android Studio מוריד את האפליקציה לדוגמה לנתיב שציינתם ופותח את הפרויקט. לאחר מכן אפשר לבדוק את MainActivity.kt בכל אחת מהדוגמאות כדי לראות ממשקי API של Jetpack Compose כמו אנימציה של עמעום הדרגתי, רכיבים מותאמים אישית, שימוש בטיפוגרפיה והצגת צבעים בהירים כהים בתצוגה המקדימה של סביבת הפיתוח המשולבת.

כדי להשתמש ב-Jetpack פיתוח נייטיב ל-Wear OS, כדאי לעיין במאמר איך מגדירים את Jetpack Compose ב-Wear OS.

אין המלצות כרגע.

אפשר לנסות לחשבון Google.