Android Compose 01 从入门到入土

前言

  看到最近谷歌新提出的安卓UI设计方案Compose推出了1.0正式版,也正值找工作的重要时期。正所谓技多不压身,在UI布局方面的两个技术Flutter以及Compose中,我选择了Compose。因为涉及到的新知识很多,所以写下博客也是为了未来好查阅资料(

建立Compose项目

  学习Compose开发的第一步就是建立一个Compose项目,在Android Studio中我们可以直接选中Empty Compose Activity进行Compose项目的创建

  像以往创建新项目一样填写好相应的信息点击创建即可,需要注意的是虽然项目中其他的逻辑可以使用Java语言编写但是Compose界面仅支持使用Kotlin语言进行编写

基础知识

  与传统的使用AndroidView布局的项目相比,Compose项目更推荐使用的是单Activity模式。为了便于理解,可以将Compose认为是一种特殊的fragment。

  在Activity onCreat中新增了一个方法setContent作为Compose方法的入口

image-20220811181346628

  其中的ComposeBlogTheme是项目的主题,名字根据项目名变化。因为Compose更推荐使用Material Design风格进行UI设计,所以这个主题就起到了非常关键的作用,只需在其中定义不同主题使用的颜色便可以轻松实现换肤、昼夜模式等操作,但这些我们日后再谈。

  Compose中最具特色的就是他的可嵌套设计,充分吸收了前端的模块化编程的理念,让不同的组件可以相互组合构建界面,例如上图中的Surface就是一个基本的Compose组件在其中我们可以嵌套上我们自己便携的Compose组件。

  所有的Compose组件本质上是一个函数,我们只需要在方法上添加Composable注解即可。

image-20220811182555876

  Preview注解可以使该Compose函数在AndroidStudio中渲染预览,方便我们的调试以及设计。需要注意的是被Preview注解的Compose函数不能传入任何参数,预览的效果如下

image-20220811183110694

  Compose的预览最神的地方不仅仅是他能做到传统xml布局设计的实时显示更改,更重要的是他可以启动互动模式,不需要真正的启动程序也可以进行一些简单的交互调试。


初めて会ったの日から 僕の心の全てを奪った