簡(jiǎn)單介紹
- 今年android11已經(jīng)完爆了android10去年的發(fā)布會(huì)焙格，無(wú)論從ai模型上的優(yōu)化還是jetpack庫(kù)的升級(jí)蔫缸，都能說(shuō)是android11的亮點(diǎn)岂却。這里我們主要介紹與學(xué)習(xí)jetpack的compose是什么居砖，有什么用腾务？
- Compose的使用需要在AS4.2版本（暫時(shí)只有preview版毕骡，沒(méi)穩(wěn)定版）才可以使用。
Compose
Compose是什么
- Compose的宗旨是：用代碼書(shū)寫(xiě)UI岩瘦，增強(qiáng)UI復(fù)用性未巫，減少xml的書(shū)寫(xiě)。就是使用更少的代碼启昧、強(qiáng)大的工具和直觀的 Kotlin API 簡(jiǎn)化并加快了 Android 上的界面開(kāi)發(fā)叙凡。
Compose怎么用
- Compose只是注解接口，內(nèi)部原理在自己看懂后密末，會(huì)在往后出一篇介紹原理握爷，現(xiàn)在我們簡(jiǎn)單介紹如何使用。溫馨提示Compose對(duì)學(xué)習(xí)過(guò)flutter的開(kāi)發(fā)者來(lái)說(shuō)非常容易入門(mén)严里。
- Compose支持的布局：一新啼、Column（列排列的組件）; 二、Row（行排列的組件）刹碾；三燥撞、Statck（疊加的組件）、四迷帜、Scaffold（Scaffold物舒、MaterialTheme等是Material Design風(fēng)格的組件）等。這里簡(jiǎn)單只寫(xiě)出4個(gè)是因?yàn)檫@對(duì)于學(xué)習(xí)過(guò)flutter的開(kāi)發(fā)者來(lái)說(shuō)戏锹，它們4個(gè)已經(jīng)是非常熟悉的老朋友了冠胯。
- 和flutter一樣，Compose讓開(kāi)發(fā)者可以專(zhuān)心使用代碼寫(xiě)開(kāi)發(fā)UI界面锦针，無(wú)需再寫(xiě)一份xml代碼荠察，缺點(diǎn)就是層級(jí)嵌套過(guò)深吧。
開(kāi)始擼代碼
//溫馨提示：擼Compose的代碼伞插，電腦性能要好點(diǎn)割粮，要不然卡成狗屎,因?yàn)閍s也做成實(shí)時(shí)編譯
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
MagicTheme {
Scaffold(
backgroundColor = Color.White,
bodyContent = {
listContent()
}
)
}
}
}
}
//主要簡(jiǎn)單用下flutter這些老朋友寫(xiě)寫(xiě)
@Composable
fun listContent() {
Column(modifier = Modifier.background(Color.DarkGray)) {
Text(text = "測(cè)試", style = TextStyle(color = Color.Blue, fontSize = TextUnit.Sp(14)))
Spacer(modifier = Modifier.padding(vertical = 5.dp))
Row {
Text(text = "測(cè)試1", style = TextStyle(color = Color.Blue, fontSize = TextUnit.Sp(14)))
Text(text = "測(cè)試2", style = TextStyle(color = Color.Blue, fontSize = TextUnit.Sp(14)))
Text(text = "測(cè)試3", style = TextStyle(color = Color.Blue, fontSize = TextUnit.Sp(14)))
}
}
}
//Material Design風(fēng)格
@Composable
fun MagicTheme(
content: @Composable () -> Unit
) {
MaterialTheme(
colors = MagicColors,
typography = typography,
shapes = shapes,
content = content
)
}
####### 最后效果圖
手機(jī)上效果圖
總結(jié)
- 不要想著把a(bǔ)pi全部記下來(lái)，要看時(shí)候直接點(diǎn)擊看源碼參數(shù)媚污，遇到不懂再找官網(wǎng)看下使用舀瓢，這是我學(xué)習(xí)flutter最大收獲，易上手耗美。
- 這里的Compose只是初略減少下京髓，android親爹也打算支持flutter的風(fēng)格了航缀，大家可以抽空玩玩即可。
- 后續(xù)打算先出個(gè)如何刷新Compose上View的數(shù)據(jù)文章堰怨，主要都是些簡(jiǎn)單介紹芥玉，大家也可以看下面官網(wǎng)學(xué)習(xí)即可。
學(xué)習(xí)參考資料：
官網(wǎng)說(shuō)明：https://developer.android.com/jetpack/compose
官網(wǎng)demo：https://github.com/android/compose-samples
