Android Jetpack组件 Compose 使用介绍

最新推荐文章于 2024-07-17 15:04:58 发布

2401_84003630

最新推荐文章于 2024-07-17 15:04:58 发布

阅读量883

点赞数 10

本文链接：https://blog.csdn.net/2401_84003630/article/details/137162508

版权

程序员专栏收录该内容

284 篇文章 2 订阅

订阅专栏

② item点击事件
四、源码

前言

===============================================================

一直以来，在Android 中构建UI页面是一个很耗时的操作，我们需要图形界面和xml去创建布局，通过预览达到我们想要的效果，而Jetpack推出的新组件Compose就解决了这个痛点，下面让我们来了解它，使用它。

在这里插入图片描述

使用它，来感受声明式UI的强大之处。

正文

===============================================================

Jetpack Compose是一个用于构建原生Android UI的现代工具包。Jetpack Compose 通过更少的代码、强大的工具和直观的 Kotlin API 简化并加速了 Android 上的 UI 开发。

听起来好像老牛逼了！！！下面我们用一下吧，这里我要说明一下，Compose 需要使用新版本的Android Studio，目前最新的是大黄蜂版本，以及使用Kotlin去开发，如果你对Kotlin一无所知，这可能学起来有一点难度，我尽可能的说明详细一些，其实Compose出来已经有一段时间了，在新的AS更新后，对于Compose开发更加友好的，下面来创建一个项目吧。

一、创建Compose项目

在这里插入图片描述

这里我们选择的是Empty Compose Activity，点击Next。

在这里插入图片描述

然后我们修改项目名和包名，这里看到开发语言是Kotlin，而且是灰色的不可更改的，这说明如果你要使用Compose就必须要用Kotlin，这也是未来Android开发语言的趋势，我相信现在还有很多是使用Java，但也需要慢慢转变了，这是一个漫长的过程，点击Finish，完成项目的创建。

在这里插入图片描述

项目创建完成之后，我们看到这里的项目目录没有了layout文件夹了，而我们的MainActivity现在里面又有一些代码。

在这里插入图片描述

这里我们看到在MainActivity中有一个DefaultPreview函数，然后这边有一个手机的图标，我们点击它，就可以就会直接运行到当前AS所连接到设备，无论是虚拟设备还是真机。如果我们需要预览当前的页面的话，可以点击右上角的Split，然后右侧就会看到Default Preview。

在这里插入图片描述

这里就是Hello Android，我们先了解这个Hello Android 怎么来的。

在这里插入图片描述

1. setContent

首先是这个setContent的闭包，包含的是页面的内容，这里我们首先看到的是EasyComposeTheme，表示的是你项目的主题，主题用于设置项目页面的样式，可以看看能设置哪些参数：

在这里插入图片描述

下面我们看找个

Greeting(“Android”)

这是一个组合函数，所有的组合函数都要使用@Composable注解。

在这里插入图片描述

函数命名就按自己的意思来，这里面是Text就表示通过Compose编辑识别为TextView，然后设置文本值：

“Hello $name!”

这是标准的Kotlin的String类型的使用方式，这里的text = 不是必须要写的，你可以去掉。

在这里插入图片描述

我们预览一下看看效果：

在这里插入图片描述

我们发现，这里重叠了，类似于相对布局的效果，那么如果要纵向排列呢？

2. 排列效果

这里我们可以使用Column{}。

在这里插入图片描述

如果这个函数不需要输入参数，那么括号是可以去掉的，然后我们预览一下看看。

在这里插入图片描述

那么横向排列的话是什么样子呢？

在这里插入图片描述

这样就知道了控件是怎么布局的了。

在这里插入图片描述

@Preview注解是方便开发者在不运行的前提下可预览效果，也就是说DefaultPreview这个函数是开发者自己用的。

在这里插入图片描述

这里我把这里的代码注释掉，那么你在AS中就无法预览了，现在我们就了解了MainActivity中的基本构建了，那么下面我们再来观察一下gradle。

3. gradle

首先是项目的build.gradle。

在这里插入图片描述

这里是设置compose 版本的地方，然后我们再看app下的build.gradle

在这里插入图片描述

这里主要是设置compose可用，通知设置kotlin 编译器扩展版本。

在这里插入图片描述

再看这里依赖，主要是有compose的ui，我们之前看到的Text就在这个库里面，以及支持compose的material组件，还有就是compose的预览。其他的地方就没啥大的变化了，到现在你就知道这个Compose项目的结构和使用了。

二、布局

布局无非就是横向纵向排列，在上面就已经说明了，下面我们来改动一下，稍微复杂的布局。

在这里插入图片描述

这里我们就是先设置横向，然后是纵向，预览效果如下：

在这里插入图片描述

① 布局填充

上面的这个排版不太好看，都填充满了，我们加一点内填充，这样就完成了填充，相比之前就要好看一些。

在这里插入图片描述

② 大小设置

作为开发者要学会多尝试，比如我们再改一下这个图片的参数，现在我们的图片是没有设置大小的，目前是默认大小，现在我们设置一下大小为60dp：

在这里插入图片描述

③ 图片设置

正方形图片不好看，下面我们改成圆的。Modifier支持链式调用，很方便。

在这里插入图片描述

圆的很方便，现在我们改成圆角的，要怎么改呢？

在这里插入图片描述

是不是很nice呢？你还记得在之前的项目中这样操作要怎么做吗？是不是很方便呢？我们还可以给图片加一个边框，如下图所示：
自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长或者是报班学习，但对于培训机构动则近万的学费，着实压力不小。自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！

因此收集整理了一份《2024年Android移动开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点，真正体系化！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！

如果你觉得这些内容对你有帮助，可以扫码获取！！（备注：Android）

尾声

如果你想成为一个优秀的 Android 开发人员，请集中精力，对基础和重要的事情做深度研究。

对于很多初中级Android工程师而言，想要提升技能，往往是自己摸索成长，不成体系的学习效果低效漫长且无助。整理的这些架构技术希望对Android开发的朋友们有所参考以及少走弯路，本文的重点是你有没有收获与成长，其余的都不重要，希望读者们能谨记这一点。

这里，笔者分享一份从架构哲学的层面来剖析的视频及资料分享给大家梳理了多年的架构经验，筹备近6个月最新录制的，相信这份视频能给你带来不一样的启发、收获。

PS：之前因为秋招收集的二十套一二线互联网公司Android面试真题（含BAT、小米、华为、美团、滴滴）和我自己整理Android复习笔记（包含Android基础知识点、Android扩展知识点、Android源码解析、设计模式汇总、Gradle知识点、常见算法题汇总。）

架构篇

《Jetpack全家桶打造全新Google标准架构模式》

《Android学习笔记总结+移动架构视频+大厂面试真题+项目实战源码》，点击传送门即可获取！

、设计模式汇总、Gradle知识点、常见算法题汇总。）

[外链图片转存中…(img-DzfPSgKi-1711752586765)]

架构篇

《Jetpack全家桶打造全新Google标准架构模式》
[外链图片转存中…(img-ztF4MUuy-1711752586765)]

《Android学习笔记总结+移动架构视频+大厂面试真题+项目实战源码》，点击传送门即可获取！

2401_84003630

关注

10
点赞
踩
11

收藏

觉得还不错? 一键收藏
0
评论
Android Jetpack组件 Compose 使用介绍

前言一直以来，在Android 中构建UI页面是一个很耗时的操作，我们需要图形界面和xml去创建布局，通过预览达到我们想要的效果，而Jetpack推出的新组件Compose就解决了这个痛点，下面让我们来了解它，使用它。使用它，来感受声明式UI的强大之处。正文Jetpack Compose是一个用于构建原生Android UI的现代工具包。Jetpack Compose 通过更少的代码、强大的工具和直观的 Kotlin API 简化并加速了 Android 上的 UI 开发。听起来好像老牛逼了！！
复制链接

扫一扫