为了包含 Jetpack Compose 1.0.0-beta05 的更新内容,这篇文章在第一次发布后做出了更新。如果您希望查看 原始版本,请点击 这里。...2020 年,我开始了缓慢迁移 Tivi UI 的任务,目标是使其转为由 Jetpack Compose 编写。大约 12 个月之后,任务完成!...,同时每个 Fragment 的 UI 使用了 Jetpack Compose 实现。...代码行数 我知道在比较软件项目时,计算源代码行数不是特别有用的统计方式;但这种方式能够提供一个视角,帮助我们了解事物是如何变化的。 为了进行测试,我使用了 cloc 工具。...您可以查看我们发布的文章来了解更多: 深入详解 Jetpack Compose | 优化 UI 构建 深入详解 Jetpack Compose | 实现原理 注意事项 关于上面的所有结果,有些事项需要注意
Android Jetpack组件 Compose 使用 前言 正文 一、创建Compose项目 1. setContent 2....,通过预览达到我们想要的效果,而Jetpack推出的新组件Compose就解决了这个痛点,下面让我们来了解它,使用它。...使用它,来感受声明式UI的强大之处。 正文 Jetpack Compose是一个用于构建原生Android UI的现代工具包。...,我尽可能的说明详细一些,其实Compose出来已经有一段时间了,在新的AS更新后,对于Compose开发更加友好的,下面来创建一个项目吧。...一、创建Compose项目 这里我们选择的是Empty Compose Activity,点击Next。
前言 大约在一年半前,我发布了Compose的第一篇文章 Jetpack Compose开篇 之 HelloWorld,连我自己也没想到,这一年半的时间中我竟再也没有看过Compose..., 如今Compose...已经发布了稳定版本,还没学会Compose让我的头发又白了许多~ 使用Navigation在Compose中导航 如果你之前不喜欢Android提倡的”单Activity“应用,那么在Compose中相信你会慢慢习惯的...接下来我们来看,如何使用navigation来进行页面导航呢?...对象需要两个必传参数,一个是NavController,一个是起始路由地址,NavController 对象是 Navigation 组件的中心 API,我们可以通过 rememberNavController创建...name = name,现在我们将年龄修改为一个可选参数,来看看如何修改。
前言 Android 开发中我们普遍使用今日头条的适配框架。...今日头条方案: 基于系统将 dp 转换为 px 的公式 px = dp * density 来实现适配,通过在运行时动态修改 density 值的大小,使得修改后计算出的屏幕宽度就等于设计稿的宽度,从而使得在不同屏幕尺寸下我们都可以直接使用设计稿给出的...所以Jetpack Compose中我们也可以参考这种方式做适配。 只适配单方向 假如屏幕 长是817dp,应用只显示为横屏。
为了让 Jetpack Compose 的使用体验更上一层楼,以及了解大家对 Compose 开发、学习方面的内容需求,这里诚邀您参与 Jetpack Compose 使用情况调研, 点击这里 即刻参与调研...在分析了各种选择后,我们做出了 (在当时) 一个大胆的决定——使用当时还处于 Alpha 预览阶段的 Jetpack Compose。...优先考虑 当我们对新的界面渲染层使用 Jetpack Compose 时,需要优先考虑以下两点: 开发者的工作效率 : Play 商店团队有数百个工程师改进代码,因此开发起来应该很容易 (也很有趣)。...开发者的工作效率 一年多来 ,我们一直在使用 Jetpack Compose 编写用户界面代码,也得益于 Jetpack Compose 让界面开发变得更加简单。...当在 Play 商店中创建在滚动情况下频繁使用的大量重复使用界面组件时,我们发现不必要的重组会增加丢失的帧时间,从而导致卡顿。
前言 如需以左右或上下方式浏览内容,您可以分别使用 HorizontalPager 和 VerticalPager可组合项。 这些可组合项的功能与视图系统中的 ViewPager类似。...官方文档: https://android-dot-google-developers.gonglchuangl.net/jetpack/compose/layouts/pager?...import androidx.compose.foundation.pager.PagerState import androidx.compose.runtime.Composable import...androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.snapshotFlow import androidx.compose.ui.Alignment...使用 val pagerState = rememberPagerState( initialPage = 0, initialPageOffsetFraction = 0f, ) {
前言 本文使用OkDownloader进行文件下载 https://github.com/ydxlt/okdownloader https://ydxlt.github.io/okdownloader/...DownloadItem) fun onFailure(downItem: DownloadItem) fun onLoading(downItem: DownloadItem) } 使用
(最简单10s就能明白); Compose 如何安装到传统 View 视图上; 门外汉-从布局窥一眼 这是一段 Compose 的简单代码,我们演示了多层嵌套下的示例: 如果按照传统 View 的思维...所以我们简单点可以总结为: JetPack-Compose 其自定义了一个 基础容器- ComposeView ,以及其他扩展View,比如 AndroidComposeView ,并对其进行封装,对外提供了各种我们在上层所使用的各种组件或者容器...self = parent parent = self.parent } return self } createAndxxxRecomposer(rootView) 创建一个...compositionContext internal fun createAndInstallWindowRecomposer(rootView: View): Recomposer { //使用默认的工厂创建一个...碎碎念 本文是理解 Compose 设计中比较简单的一篇,适合初学的同学简单了解 Compose与View 的相爱相杀。后续我将继续深追 Compose 的部分源码设计以及在实际落地中的场景解决方案。
概述 Compose已经内置了许多组件,诸如Column,Row,Box等。开发者可以通过这些组合这些已有的组件来定制自己的专属组件。...使用Layout Modifier 使用 Modifier.layout() 手动控制元素的测量和布局。通常layout修饰符的使用方法像下面这样。...Layout Modifier使用示例 有时你想在屏幕上展示一段文本信息,通常你会使用到Compose内置的Text组件。...对于定制“ViewGroup”的场景,我们应该使用Layout Composable了。首先我们需要创建一个Layout Composable。...,创建自己定制的Column,并添加了一些子元素。
但是Docker Compose允许您使用YAML文件来定义多容器应用程序,从而解决了这个问题。您可以根据需要配置任意数量的容器,如何构建和连接它们以及应该存储数据的位置。...本指南将说明docker-compose.yml文件的组织方式,并说明如何使用它来创建几个基本的应用程序配置。 注意:通常,使用Docker Compose构建的应用程序中的容器都将在同一主机上运行。...: 指示 使用 版 指定Compose文件语法版本。...从Scratch 构建应用程序 一次创建一个docker-compose.yml文件,以说明构建多容器应用程序的步骤。...您可以定义它们如何协同工作和通信。
下载docker镜像 sudo docker pull sequenceiq/spark:1.6.0 创建docker-compose.yml文件 创建一个目录,比如就叫 docker-spark,然后在其下创建...创建并启动spark集群 sudo docker-compose up 集群启动后,我们可以查看一下集群状态 sudo docker-compose ps Name...默认我们创建的集群包括一个master节点和一个worker节点。我们可以通过下面的命令扩容或缩容集群。...sudo docker-compose scale worker=2 扩容后再次查看集群状态,此时集群变成了一个master节点和两个worker节点。...运行spark作业 首先登录到spark集群的master节点 sudo docker exec -it /bin/bash 然后使用spark-submit命令来提交作业
docker-compose文件 创建 docker-compose.yml 文件,内如如下: version: "2" services: namenode: image: bde2020...hadoop集群 sudo docker-compose up 启动hadoop集群后,可以使用下面命令查看一下hadoop集群的容器信息 # 查看集群包含的容器,以及export的端口号 sudo docker-compose...停止集群后,创建的容器并不会被删除,此时可以使用 "sudo docker-compose rm" 来删除已经停止的容器。...也可以使用 "sudo docker-compose down" 来停止并删除容器。...删除容器后,使用 “sudo docker volume ls” 可以看到上面集群使用的volume信息,我们可以使用 “sudo docker rm ” 来删除。
import androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf...import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier...使用方法: Box( modifier = Modifier .align(Alignment.Bottom) .padding(0.dp, 0.dp, 6.dp...import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier...null, interactionSource = remember { MutableInteractionSource() }) { onClick() } } 使用方法
关于开发中常见的状态页组件,我们已经见了很多,但是在 JetPack Compose 中该如何去写呢?虽然也有大佬写了相关demo ,但是如果要应用到实际中,不免有些捉襟见肘 。...那么我们下面就开始构思一下,如何设计这个状态页组件 StateX。 基本思路 其实只要写过 compose 的代码,应该都明白,其实更简单了。...而在 compose 中,重组会执行所有调用的地方,并判断是否需要执行,我们必须要考虑如何避免重复的重组。...一切就是这么简单,在 compose 中如何使用状态页,已经分享大家了,至于大家要怎么改,可以参考 StateX 。...总结 本篇是 Compose 落地实践中比较常见的一篇,借此实践便于大家更好的理解 Compose 的编程思想。后续我将继续深追 Compose 的部分源码设计以及在实际落地中的场景解决方案
关于开发中常见的状态页组件,我们已经见了很多,但是在 JetPack Compose 中该如何去写呢?虽然也有大佬写了相关demo ,但是如果要应用到实际中,不免有些捉襟见肘 。...看完基本条件,其实也都不难,在 View 中设计一个状态页组件,大家都知道怎么做,但是 Compose 呢? 那么我们下面就开始构思一下,如何设计这个状态页组件 StateX。...而在 compose 中,重组会执行所有调用的地方,并判断是否需要执行,我们必须要考虑如何避免重复的重组。...一切就是这么简单,在 compose 中如何使用状态页,已经分享大家了,至于大家要怎么改,可以参考 StateX 。...总结 本篇是 Compose 落地实践中比较常见的一篇,借此实践便于大家更好的理解 Compose 的编程思想。后续我将继续深追 Compose 的部分源码设计以及在实际落地中的场景解决方案。
遵循如何在Ubuntu 18.04上安装和使用Docker的步骤1和2,在您的服务器上安装Docker 。 本教程已在19.03.8版上进行了测试。...遵循如何在Ubuntu 18.04上安装Docker Compose的步骤1,在您的服务器上安装Docker Compose 。 本教程已在1.21.2版上进行了测试。...我们可以使用docker-compose up命令启动容器,该命令将按照指定的顺序创建和运行容器。...让我们使用更新后的配置重新创建webserver服务: docker-compose up -d –force-recreate –no-deps webserver docker-compose...在本教程中,我们使用Docker Compose通过Nginx Web服务器创建了Drupal安装。
Jetpack Compose for Desktop 使用过程中遇到的几个大坑 最近在用 Jetpack Compose for Desktop 写一些好玩的,用的时候遇到了很多大坑,在这里总结如下:...目前还没有看到解决方案。...@See https://github.com/JetBrains/compose-jb/issues/2011 错误的使用二进制流方式从 ClassLoader Resources 中加载字体导致界面整体卡顿...解决方案是,改用 ResourceFont fun Font( resource: String, weight: FontWeight = FontWeight.Normal,...FontStyle = FontStyle.Normal ): Font = ResourceFont(resource, weight, style) 如此一来,卡顿问题便得到了解决 Tray 过晚被创建导致
在谷歌官方的 《Jetpack Compose 使用前后对比》 一文说道:Tivi应用在使用了 Compose 后,我们发现 APK 大小缩减了 41%,方法数减少了 17%。...二 如何快速学习Compose 接下来,我将给大家介绍一份谷歌大佬强势分享《Jetpack Compose 权威指南》,手把手教大家Jetpack Compose从入门到精通。...Jetpack Compose应用1 开始前的准备 创建DEMO 遇到的问题 2. Jetpack Compose应用2 3....用Jetpack Compose写一个玩安卓App 准备工作 引入依赖 新建 Activity 创建 Compose PlayTheme 画页面 底部导航栏 管理状态 添加页面 5....用Compose快速打造一个“电影App” 成品 实现方案 实战 不足 …… 如果想要全方位系统学习了解Compose,那么这份《Jetpack Compose 权威指南》你一定不要错过。
大家好,写给初学者的Jetpack Compose教程第4篇更新了。 今天我们要介绍的是Compose当中至关重要的一个组件,State。...这么简单的功能,使用View去写的话你一定三两下就搞定了吧。而现在使用Compose要如何去实现呢?...这里我又要再次引用 写给初学者的Jetpack Compose教程,为什么要学习Compose? 这篇文章中提到的知识点:声明式UI的工作流程有点像是刷新网页一样。...这个方案之前在View系统中就被广泛使用,在Compose当中也仍然有效。我们稍后就会讲解如何在Compose中使用ViewModel。...接下来就是如何在Compose中监听和修改这两个变量的值,这部分会有一些不同。
总的来说与Compose最为契合的架构还是MVVM。MVVM凭借着Controller清晰简洁、方便测试、开发解耦等优势深得各开发大佬的青睐。 ##如何快速入门 Compose ?...Android Jetpack Compose 最全上手指南 Jetpack Compose 环境准备和Hello World 布局 使用Material design 设计 Compose 布局实时预览...Jetpack Compose应用1 开始前的准备 创建DEMO 遇到的问题 [01add93a48bbcf8bfdc7356b6b9fe777.png] 2....用Jetpack Compose写一个玩安卓App 准备工作 引入依赖 新建 Activity 创建 Compose PlayTheme 画页面 底部导航栏 管理状态 添加页面 [274bc5afd753120deda3ee7347399959...用Compose快速打造一个“电影App” 成品 实现方案 实战 不足 …… [bfce1ec63d48d3e96a784e51d1199870.png] 对于Compose学习困难的小伙伴,希望这份《
领取专属 10元无门槛券
手把手带您无忧上云