התחלה מהירה

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

להורדת Android Studio

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

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

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

  1. אם בחלון ברוכים הבאים אל Android Studio, לוחצים על התחלת פרויקט Android Studio. אם כבר יש לך פרויקט Android Studio פתוח , בוחרים באפשרות File > (קובץ >) חדש > פרויקט חדש בסרגל התפריטים.
  2. בחלון Select a Project Template, בוחרים באפשרות ריק פעילות ולוחצים על הבא.
  3. בחלון Configure your project, מבצעים את הפעולות הבאות:
    1. מגדירים את שם, שם החבילה ושמירת המיקום כרגיל. כך. לתשומת ליבכם, בתפריט הנפתח שפה, השפה Kotlin היא שזמינה כי 'ניסוח אוטומטי' ב-Jetpack פועל רק בכיתות שנכתבו ב- Kotlin.
    2. בתפריט הנפתח רמת API מינימלית, בוחרים באפשרות API 21 ואילך.
  4. לוחצים על סיום.

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

הגדרה של 'כתיבה' לאפליקציה קיימת

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

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

מגניב

android {
    buildFeatures {
        compose true
    }
}

Kotlin

android {
    buildFeatures {
        compose = true
    }
}

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

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

מגניב

dependencies {

    def composeBom = platform('androidx.compose:compose-bom:2024.06.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:material3-window-size-class'

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

}

Kotlin

dependencies {

    val composeBom = platform("androidx.compose:compose-bom:2024.06.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:material3-window-size-class")

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

}

כדאי לנסות אפליקציות לדוגמה ב-Jetpack פיתוח נייטיב

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

  1. אם נמצאים בחלון ברוכים הבאים אל Android Studio, בוחרים באפשרות ייבוא דוגמת קוד של Android. אם כבר יש לכם פרויקט פתוח של Android Studio: בוחרים באפשרות File > (קובץ >) חדש > אפשר לייבא טעימה מסרגל התפריטים.
  2. בסרגל החיפוש שבחלק העליון של האשף עיון בטעימות, מקלידים 'compose'.
  3. בוחרים אחת מהאפליקציות לדוגמה של 'Jetpack פיתוח נייטיב' מתוצאות החיפוש. לוחצים על Next.
  4. משנים את Application name (שם האפליקציה) או את Project location (מיקום הפרויקט) או שומרים את ערכי ברירת המחדל.
  5. לוחצים על סיום.

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

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