AndroidStudio, qui se plaignait de la lenteur de l'emballage, a finalement fait un grand pas ! ! !
Composer
Définition officielle :
Jetpack Compose est une nouvelle boîte à outils Android pour la création d'interfaces natives. Il simplifie et accélère le développement de l'interface sur Android. Donnez rapidement vie à vos applications avec moins de code, des outils puissants et une API Kotlin intuitive.
Compose est un framework d'interface utilisateur que Google pousse fort en 2021, offrant des fonctionnalités en tant que package Jetpack.
La fonction principale est de coder l'interface utilisateur——去XML
Une autre fonctionnalité intéressante -实时可见代码修改
Dès que cette fonction est sortie, les étudiants Android allaient être aux anges, et enfin ils pouvaient abandonner la douleur de faire un paquet pendant dix minutes.
Bien sûr, il y a toujours un prix à payer pour l'obtenir, et le prix à payer ici est :
- Restrictions linguistiques : Compose ne prend en charge que le langage kotlin.
- Redéfinition de la syntaxe : supprimez la méthode de mise en page XML d'origine et remplacez-la par du code pour contrôler l'interface utilisateur.
Bien que le temps de conditionnement soit réduit, les nouveaux modèles de programmation prennent également du temps à apprendre.
N'ayez pas peur, vous avez terminé.
Ce chapitre présente principalement deux manières de créer des applications Compose.
-
L'un est un tout nouveau projet, le tout nouveau studio Android, créé en une seule étape.
-
La seconde consiste à ajouter un composant Compose au-dessus d'un projet existant.
Création en une étape
1. Préparez :
- La dernière version d'AndroidStudio
- La dernière version de kotlin
2. Créer
S'il y a une invite pour mettre à jour le plug-in au milieu, mettez-le à jour et n'oubliez pas de redémarrer Android Studio après la mise à jour.
Ce qui précède est le code généré en spécifiant le Empty Compose Activityprojet de création, et rien n'a été modifié. Ce projet peut être exécuté directement.
Vous pouvez modifier le texte du code à volonté, puis l'enregistrer pour vérifier si l'interface de prévisualisation à droite est mise à jour et si l'interface exécutée sur le téléphone mobile est mise à jour en temps réel.
Rénovation de projets existants
1. Préparez :
- La dernière version d'AndroidStudio
- 1.4.32 ou version supérieure kotlin
Au départ, je pensais que ce serait bien sans mettre à jour Android Studio, mais actuellement, Compose ne prend en charge que la version d'aperçu. De nombreuses fonctions, telles que la fonction d'aperçu en temps réel, doivent être prises en charge par Android Studio, il doit donc être mis à jour.
2. Ajouter des dépendances
修改build.gradle与Compose、kotlin相关的配置。
app文件夹下的build.gradle文件里添加如下依赖
android {
buildFeatures {
// Enables Jetpack Compose for this module
compose = true
}
// Set both the Java and Kotlin compilers to target Java 8.
compileOptions {
sourceCompatibility = JavaVersion.VERSION_1_8
targetCompatibility = JavaVersion.VERSION_1_8
}
kotlinOptions {
jvmTarget = "1.8"
useIR = true
}
composeOptions {
kotlinCompilerVersion = "1.4.32"
kotlinCompilerExtensionVersion = "1.0.0-beta07"
}
}
dependencies {
//composei相关依赖
implementation("androidx.compose.ui:ui:1.0.0-beta07")
// Tooling support (Previews, etc.)
implementation("androidx.compose.ui:ui-tooling:1.0.0-beta07")
// Foundation (Border, Background, Box, Image, Scroll, shapes, animations, etc.)
implementation("androidx.compose.foundation:foundation:1.0.0-beta07")
// Material Design
implementation("androidx.compose.material:material:1.0.0-beta07")
// Material design icons
implementation("androidx.compose.material:material-icons-core:1.0.0-beta07")
implementation("androidx.compose.material:material-icons-extended:1.0.0-beta07")
// Integration with observables
implementation("androidx.compose.runtime:runtime-livedata:1.0.0-beta07")
implementation("androidx.compose.runtime:runtime-rxjava2:1.0.0-beta07")
implementation 'androidx.activity:activity-compose:1.3.0-alpha06'
// UI Tests
androidTestImplementation("androidx.compose.ui:ui-test-junit4:1.0.0-beta07")
}
复制代码项目根目录下的build.gradle文件下的kotlin版本要与前面的kotlinCompilerVersion配置一致，版本大于或等于1.4.32
根目录下build.gradle文件：
dependencies {
classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:1.4.32"
}
复制代码3、代码修改
假设原有代码如下：
package com.example.maomao.democomposefromexisted
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
}
}
复制代码修改后：
package com.example.maomao.democomposefromexisted
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Surface
import androidx.activity.compose.setContent
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.tooling.preview.Preview
import com.example.maomao.democomposedefault.ui.theme.DemoComposeDefaultTheme
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
// setContentView(R.layout.activity_main)
setContent {
DemoComposeDefaultTheme {
// A surface container using the 'background' color from the theme
Surface(color = MaterialTheme.colors.background) {
Greeting("Android")
}
}
}
}
@Composable
fun Greeting(name: String) {
Text(text = "毛毛 $name!")
}
@Preview(showBackground = true)
@Composable
fun DefaultPreview() {
DemoComposeDefaultTheme {
Greeting("Android")
}
}
}
复制代码修改完代码，右侧会有Build & Refresh的提醒，点击刷新preview界面，即可看到预览。
运行查看结果。
PS：如果有报错
DemoComposeDefaultTheme找不到，那就走前面的一步式创建创建Empty Compose Activity项目，把里面的DemoComposeDefaultTheme相关的累拷贝进你原有项目。
到目前为止，这只是初步让项目跑起来，还没到真正的逻辑开发。
只是体验Compose新功能的看客，到这里可以结束了。
如果是真正需要项目迁移，那就要提前准备好kotlin语法基础，和Compose代码布局的语法。然后才能上手开发。
后续有时间会更新Compose语法相关文章，敬请期待。