首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

浅析 JetPack Compose如何安装到View视图上

(最简单10s就能明白); Compose 如何安装到传统 View 视图上; 门外汉-从布局窥一眼 这是一段 Compose 的简单代码,我们演示了多层嵌套下的示例: 如果按照传统 View 的思维...但是现在是 Compose ,最终的绘制真的会有5层吗?...所以我们简单点可以总结为: JetPack-Compose 其自定义了一个 基础容器- ComposeView ,以及其他扩展View,比如 AndroidComposeView ,并对其进行封装,对外提供了各种我们在上层所使用的各种组件或者容器...所以为什么说Compose不在意布局层级呢?...碎碎念 本文是理解 Compose 设计中比较简单的一篇,适合初学的同学简单了解 Compose与View 的相爱相杀。后续我将继续深追 Compose 的部分源码设计以及在实际落地中的场景解决方案。

1.3K64

Jetpack Compose Beta 版现已发布!

时机正好,不妨趁现在开始学习 Compose,并着手规划今年 1.0 版发布之后,您将如何在接下来的项目或功能中使用该工具包。...Compose 的编程思想 Jetpack Compose 是一款声明性 UI 工具包,也是当前视图系统的范式转变,您可利用此工具包声明 UI 在任何给定应用状态下的预期外观,而不是如何生成 UI。...Compose 完全使用 Kotlin 构建,可利用其优秀的 语言特性 提供功能强大、简洁且直观的 API。例如,借助 协程,我们可以编写更简单的异步 API,如描述手势、动画或滚动。...我们还发布了全新及更新的 文档指南、一些视频演示以及全新的 动画 Codelab,帮助您更深入地了解如何使用 Compose 进行构建。...现在时机正好,不妨开始学习 Jetpack Compose,并规划如何在接下来的项目中使用该工具包。

5.6K10
您找到你想要的搜索结果了吗?
是的
没有找到

开源 | 如何写一个好用的 JetPack Compose 状态页组件

关于开发中常见的状态页组件,我们已经见了很多,但是在 JetPack Compose 中该如何去写呢?虽然也有大佬写了相关demo ,但是如果要应用到实际中,不免有些捉襟见肘 。...本篇要解决的就是如何定制一个符合 实际开发 的状态页工具,并分析具体原理与设计思路。...那么我们下面就开始构思一下,如何设计这个状态页组件 StateX。 基本思路 其实只要写过 compose 的代码,应该都明白,其实更简单了。...而在 compose 中,重组会执行所有调用的地方,并判断是否需要执行,我们必须要考虑如何避免重复的重组。...一切就是这么简单,在 compose如何使用状态页,已经分享大家了,至于大家要怎么改,可以参考 StateX 。

79120

开源 | 如何写一个好用的 JetPack Compose 状态页组件

关于开发中常见的状态页组件,我们已经见了很多,但是在 JetPack Compose 中该如何去写呢?虽然也有大佬写了相关demo ,但是如果要应用到实际中,不免有些捉襟见肘 。...本篇要解决的就是如何定制一个符合 实际开发 的状态页工具,并分析具体原理与设计思路。...看完基本条件,其实也都不难,在 View 中设计一个状态页组件,大家都知道怎么做,但是 Compose 呢? 那么我们下面就开始构思一下,如何设计这个状态页组件 StateX。...而在 compose 中,重组会执行所有调用的地方,并判断是否需要执行,我们必须要考虑如何避免重复的重组。...一切就是这么简单,在 compose如何使用状态页,已经分享大家了,至于大家要怎么改,可以参考 StateX 。

1K10

Jetpack Compose Alpha 版现已发布!

Jetpack 的 Hello World Jetpack Compose: Alpha 版现已发布 Jetpack Compose Alpha 版本 提供了用于构建成熟 Android 应用所需的功能...Alpha 版本发布内容如下:  Animations Constraint Layout 无障碍初步支持 输入和手势 与视图的互操作性 (可以在您现有的 app 中混合可以组合的功能) 懒加载列表 Material...要了解更多相关信息,请参阅 Compose for existing apps codelab 或查看以下两个示例: Tivi 和 Sunflower 展示了如何在现有项目中集成 Compose Crane...示例应用 展示了如何Compose 嵌入一个 MapView 观看视频: 将 Compose 加入现有的应用:https://youtu.be/PjQdFmiDgwk 强大的工具 Android...可组合元素预览 开始使用 Jetpack Compose 要开始使用 Jetpack Compose,请参阅 Compose 教程 并 进行设置。

4.1K30

记一个 Compose 版华容道,你值得拥有!

3.2 棋子的碰撞检测 获取了棋子拖拽的位移信息后,可以更新棋局状态并最终刷新UI。但是在更新状态之前需要对棋子的碰撞进行检测,棋子的拖拽是有边界的。...3.3 更新棋局状态 综上,获取手势位移信息后,检测碰撞并移动到正确位置,最后更新状态,刷新UI: val chessList: List by remember { mutableStateOf...主题切换,游戏换肤 最后,再来看一下如何为游戏实现多套皮肤,用到的是 Compose 的 Theme。...image.png 最后 本文主要介绍了如何使用 Compose 的 Gesture, Theme 等特性快速完成一个华容道小游戏,更多 API 的实现原理,可以参考以下文章: 深入理解 MaterialTheme...与 CompositionLocal 使用Jetpack Compose完成自定义手势处理 代码地址:https://github.com/vitaviva/compose-huarongdao 文末

37620

欢迎体验 | Wear OS 版 Compose 开发者预览版

作者 / 开发者关系工程师 Jeremy Walker 在今年的 Google I/O 大会 上,我们宣布将 Jetpack Compose 的优秀特性引入 Wear OS。...除此之外,您在使用 Jetpack Compose 构建移动应用的经验,也可以直接运用在 Wear OS 版本上。...这就意味着面向 Wear OS 设计时,您搭配 Jetpack Compose 使用的许多依赖项不会发生变化。例如,UI、运行时间、编译器和动画依赖项都将保持不变。...此版本添加了对开箱即用的滑动关闭手势的支持 (类似于移动设备中的返回按钮/手势)。...下面是更为复杂的一个示例: 导航 最后,我们还提供了导航可组合项 SwipeDismissableNavHost,该可组合项与移动设备中 NavHost 的工作原理很像,不过也支持开箱即用的滑动关闭手势

1.6K10

【移动开发】InfoQ 2022 年移动和物联网趋势报告

关键要点 由于 SwiftUI 和 Jetpack Compose 的日益成熟和采用,构建声明式 UI 显然已成为 iOS 和 Android 世界的一种趋势。...声明式用户界面(Jetpack Compose) 最近达到 1.0 的 Jetpack Compose 是 Google 的基于 Kotlin 的 Android 声明式 UI 框架。...关于声明式 UI 为开发带来的好处,Jetpack Compose 与 SwiftUI 的情况大致相同,如上所述。...基于手势和姿势的 UI AR 和 VR 都为与应用程序和环境交互提供了新的可能性,这导致了人机交互的新方法,特别是使用手势识别或 2D 姿势检测的可能性。...很容易预测,在 SDK 级别提供手势和身体姿势检测可能只会促进其他应用程序的开发,将这些 UI 方法扩展到更多领域。

1.1K10

Neuromation:一文告诉你如何用 CNN 检测儿童骨龄

Alexander是一位深度学习专家,专门研究与医疗影像相关的问题,包括图像分割、物体检测和广义上的卷积神经网络等领域。...数据 数据集由北美放射学会(RSNA)提供,RSNA还组织了2017年儿童骨龄挑战赛。这些照片是从斯坦福儿童医院和科罗拉多儿童医院获得的,他们在不同的时间、不同的条件下拍摄了不同的硬件。...预处理Ⅱ:关键点的图像配准 我们的图像配准方案很简单:我们只需要检测手上的几个特征点的坐标。然后我们将能够计算仿射变换参数(缩放、旋转、平移和镜像)以将图像拟合到标准位置。...为了检测这些图像并适当地调整它们,我们使用了拇指的关键点。 来看看我们的图像注册模型如何工作。正如你所看到的,手已经成功地旋转到我们的首选标准位置: 这里有整个预处理流水线的诸多案例。...结论 总结一下:在这篇文章中,我们展示了如何开发一个自动化的骨龄评估系统,该系统能够以惊人的准确性评估骨骼的成熟度,类似于或优于专业放射学家。

1.2K40

InfoQ 2022 年趋势报告:移动及物联网篇

声明式用户界面(Jetpack Compose) 最近达到 1.0 版本的 Jetpack Compose 是谷歌基于 Kotlin 开发的 Android 声明式用户界面框架。...关于声明式用户界面给开发带来的好处,可以说 Jetpack Compose 和上面提到的 SwiftUI 有很多相同之处。...然而,SwiftUI 已经来到了它的第三次主要迭代阶段,iOS 开发社区已经普遍接受了它,而 Jetpack Compose 仍处于采用的早期阶段。...基于手势和身体姿势的用户界面 AR 和 VR 为与应用和环境之间的互动提供了新的可能性,进而催生了人类与计算机交互的全新方法,特别是使用手势识别或 2D 姿势检测的方法。...我们很容易预测,在 SDK 层面上提供手势和身体姿势检测支持将会促进开发者开发更多应用,将这些用户界面方法扩展到更多领域。

44630

Jetpack Compose 1.1 现已进入稳定版!

作者 / Android 开发者关系工程师 Florina Muntenescu 我们一如既往地搭建 产品路线图,现在已经发布了 Jetpack Compose 的 1.1 版本,这是 Android...这将使得 Compose Material 与 Material Design 组件的行为保持一致,以便在混合使用 View 和 Compose 时提供一致的行为。...如果您发现此更改破坏了现有的布局逻辑,请将 LocalMinimumTouchTargetEnforcement 设置为 false 来禁用此行为,但此操作可能会降低应用的可用性,因此需要您格外注意,并谨慎使用...Jetpack Compose 现已推出稳定版本,供大家在生产环境中使用,并且会继续添加您想要的功能。...我们很高兴看到成千上万的应用已经开始在生产环境中使用 Jetpack Compose,我们迫不及待想看到您将构建的应用!

1.1K20

一款高仿 Eyepetizer | 开眼短视频的 MVVM 开源项目

“ 基于 Kotlin[1] 语言仿写「开眼 Eyepetizer[2]」的一个短视频 Android 客户端项目,采用 Jetpack[3] + 协程[30]实现的 MVVM 架构。”...个人认为代码还是比较容易阅读理解的,因此也非常适合新手入门 Kotlin 语言,同时更快地掌握 Jetpack 组件的使用。...SmartRefreshLayout[22] - 下拉刷新框架 BannerViewPager Banner[23] 轮播图 Immersionbar[24] 状态栏管理 PhotoView[25] 支持手势缩放图片...Circleimageview[26] 圆形图像 GSYVideoPlayer[27] 视频播放器 VasSonic[28] 提升H5首屏加载速度 Leakcanary[29] 内存泄漏检测 Kotlinx...Coroutines[30] 简化代码管理后台线程与回调 License 所有数据来源于开眼,仅供学习和交流使用,严禁用于任何商业用途,原作公司拥有所有权利。

1.2K51

一起看 IO | Compose for Wear OS Beta 版发布!

Beta 版本介绍 自去年的 I/O 大会以来,我们一直在努力将 Jetpack Compose 的优势带到 Wear OS,还通过 Slack 与社区互动,收集开发者对 API、组件和工具的反馈。...一些组件也因此得到了改进,如导航、可缩放惰性列表 (scaling lazy list)、输入和手势支持等等。 在现在的 Beta 1 之前我们已经发布了 21 个 Alpha 版。...进度指示器 我们添加了 CircularProgressIndicator,这是一个为手表屏幕优化的进度指示器,通过将指示器沿顺时针方向的圆形轨道绘制来显示进度: 对于如何使用 CircularProgressIndicator...即刻开始使用 许多移动端 Compose 的开发原则同样适用于 Wear OS 版本的 Compose,如果您不熟悉这套用户界面工具包,可以从 Jetpack Compose 的基础知识开始上手。...上获取 Compose for Wear OS Codelab,可供您亲自上手体验 随着 Compose for Wear OS Beta 版的到来,现在是时候开始使用 Compose 来构建自己的应用或是用它来更新既有的界面了

1.4K20

AndroidStudio 开发基础知识【翻译完成】

布局设计 二十三、使用约束集管理约束 二十四、安卓约束集教程 二十五、AndroidStudio 中应用更改的使用指南 二十六、安卓事件处理概述及示例 二十七、安卓触控和多点触控事件处理 二十八、使用安卓手势检测器类检测常见手势...二十九、在安卓上实现自定义手势识别 三十、安卓片段介绍 三十一、在 AndroidStudio 使用片段——一个例子 三十二、现代安卓应用架构和 Jetpack 二十三、Android Jetpack...视图模型教程 三十四、安卓 Jetpack 实时数据教程 三十五、安卓 Jetpack 数据绑定概述 三十六、安卓 Jetpack 数据绑定教程 三十七、安卓视图模型保存状态教程 三十八、使用安卓生命周期感知组件...布局设计 三十、使用约束集管理约束 三十一、安卓约束集教程 三十二、AndroidStudio 中应用更改的使用指南 三十三、安卓事件处理概述及示例 三十四、安卓触控和多点触控事件处理 三十五、使用安卓手势检测器类检测常见手势...三十六、在安卓上实现自定义手势识别 三十七、安卓片段介绍 三十八、在 AndroidStudio 使用片段——一个例子 三十九、现代安卓应用架构和 Jetpack 四十、Android Jetpack

3.2K30

Jetpack Compose有学的必要吗?未来前景将会怎样?

image.png 如何学习 这里给大家分享一份由谷歌大佬亲自整理的一份《Jetpack Compose 入门到精通》PDF学习手册,外网分享找到的,我自己整理尝试翻译了下,有需要的朋友,可以直接划到文末自取...第一章 初识 Jetpack Compose 1. 为什么我们需要一个新的UI 工具? 2. Jetpack Compose的着重点 3. API 设计 4. Compose API 的原则 5....插槽API 这里不是教你Jetpack Compose 的一些基本使用方法,而是为啥我们需要Jetpack Compose 的一些简洁,让大家对Jetpack Compose 有更深层次的了解......image.png image.png ---- 第三章 Jetpack Compose 项目实战演练(附Demo) 1. Jetpack Compose应用(一) 2....Jetpack Compose应用(二) 3. Jetpack Compose应用做一个倒计时器 4. 用Jetpack Compose写一个玩安卓App 5.

3.1K30

掌握 Jetpack Compose 中的 State,看这篇就够了

这篇文章会介绍所有和 Compose 的 State (状态) 相关的内容,包括:什么是状态如何创建状态如何使用状态有状态和无状态可组合项 (composable)另外,在这篇文章的最后,还附加了额外的内容...= MyState('2', 3)}Jetpack Compose如何构造状态State实例?...附加内容:在 Jetpack Compose 中,如何使用 Kotlin 的 Flow、RxJava 或者 LiveData 表示状态?...这些拓展方法会帮我们把响应式的实例转换成 Jetpack Compose 中的状态实例。如何Jetpack Compose 中使用 Kotlin 的 Flow?...:InputText 的延迟和对应的规避方式如何在 ViewModel 中表示状态如何将 Android 中其他表示类型的状态转成 Jetpack Compose 中的状态希望能对你有帮助。

7.6K111
领券