כדי ליהנות מחוויית הפיתוח הטובה ביותר עם 'כתיבה', כדאי להוריד ולהתקין את Android Studio. הוא כולל הרבה תכונות עריכה חכמות, כמו פרויקט חדש והיכולת להציג בתצוגה מקדימה מיידית את ממשק המשתמש של הכתיבה ואת האנימציות.
פועלים לפי ההוראות הבאות כדי ליצור פרויקט פיתוח אפליקציה חדש ולהגדיר אותו אפשר ליצור הודעה לפרויקט אפליקציה קיים, או לייבא אפליקציה לדוגמה שנכתבה ב'כתיבה'.
יצירת אפליקציה חדשה עם תמיכה בכתיבה
כדי להתחיל פרויקט חדש שכולל תמיכה בכתיבה כברירת מחדל, ב-Android Studio יש מגוון תבניות לפרויקטים שיעזרו לכם להתחיל. שפת תרגום כדי ליצור פרויקט חדש עם הגדרות פיתוח נייטיב כמו שצריך, צריך לבצע את הפעולות הבאות:
- אם בחלון ברוכים הבאים אל Android Studio, לוחצים על התחלת פרויקט Android Studio. אם כבר יש לך פרויקט Android Studio פתוח , בוחרים באפשרות File > (קובץ >) חדש > פרויקט חדש בסרגל התפריטים.
- בחלון Select a Project Template, בוחרים באפשרות ריק פעילות ולוחצים על הבא.
- בחלון Configure your project, מבצעים את הפעולות הבאות:
- מגדירים את שם, שם החבילה ושמירת המיקום כרגיל. כך. לתשומת ליבכם, בתפריט הנפתח שפה, השפה Kotlin היא שזמינה כי 'ניסוח אוטומטי' ב-Jetpack פועל רק בכיתות שנכתבו ב- Kotlin.
- בתפריט הנפתח רמת API מינימלית, בוחרים באפשרות API 21 ואילך.
- לוחצים על סיום.
עכשיו אתם יכולים להתחיל לפתח אפליקציה באמצעות 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, מבצעים את הפעולות הבאות:
- אם נמצאים בחלון ברוכים הבאים אל Android Studio, בוחרים באפשרות ייבוא דוגמת קוד של Android. אם כבר יש לכם פרויקט פתוח של Android Studio: בוחרים באפשרות File > (קובץ >) חדש > אפשר לייבא טעימה מסרגל התפריטים.
- בסרגל החיפוש שבחלק העליון של האשף עיון בטעימות, מקלידים 'compose'.
- בוחרים אחת מהאפליקציות לדוגמה של 'Jetpack פיתוח נייטיב' מתוצאות החיפוש. לוחצים על Next.
- משנים את Application name (שם האפליקציה) או את Project location (מיקום הפרויקט) או שומרים את ערכי ברירת המחדל.
- לוחצים על סיום.
מערכת Android Studio מורידה את האפליקציה לדוגמה לנתיב שציינתם ופותח את
פרויקט. לאחר מכן אפשר לבדוק את MainActivity.kt
בכל אחת מהדוגמאות כדי לראות
ממשקי API של Jetpack Compose כמו אנימציה של עמעום הדרגתי, רכיבים מותאמים אישית, באמצעות
טיפוגרפיה, והצגת צבעים בהירים כהים בתצוגה המקדימה של סביבת פיתוח משולבת (IDE).
כדי להשתמש ב-Jetpack פיתוח נייטיב ל-Wear OS, מומלץ לעיין במאמר איך מגדירים את Jetpack Compose ב-Wear OS.
מומלץ עבורך
- הערה: טקסט הקישור מוצג כאשר JavaScript מושבת
- ניווט באמצעות 'כתיבה'
- בדיקת פריסת הכתיבה
- תגובה למיקוד