，同时每个 Fragment 的 UI 使用了 Jetpack Compose 实现。...第二个 (也是最后一个) 阶段是从 Fragment 迁出，并直接使用 Navigation Compose 组件。这一步在 这个 PR 中完成。...这一现象与 Compose 无关。"完全接入 Compose" 使用的是最新版本的 Dagger/Hilt，该版本使用了 Android Gradle Plugin 7.0 中的新 ASM API。...退一步讲，考虑到 Kotlin 编译器与 Compose 编译器插件为我们所做的事情，如位置记忆化、细粒度重组等工作，构建时间能够 减少 29%， 可以说十分惊人。...您可以查看我们发布的文章来了解更多: 深入详解 Jetpack Compose | 优化 UI 构建 深入详解 Jetpack Compose | 实现原理 注意事项 关于上面的所有结果，有些事项需要注意
前言 如需以左右或上下方式浏览内容，您可以分别使用 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, ) {
前言 Jetpack Compose光下拉刷新，官方就提供了三种不同的方式，使用的依赖也不相同，特别的混乱。 所以在网络上看到的示例可能找不到依赖就是这个原因。...可以使用第一种，要么使用第二种。...Text(text = index.toString()) } } } } PullToRefreshContainer 把libs.version.toml中的...", name = "material3-android", version.ref = "material3Android" } build.gradle.kts中 implementation(libs.androidx.material3...https://developer.android.google.cn/jetpack/androidx/releases/compose-material3?
前言 在 Compose 中，Modifier 的调用顺序是有影响的。...修饰符列表 https://android-dot-google-developers.gonglchuangl.net/jetpack/compose/modifiers-list?...hl=zh-cn 背景 Modifier.background(Color.Green)) 内外边距和背景 在 Compose 中，背景色使用 Modifier.background() 进行设置。...align 方法用于指定组件在其父容器中的对齐方式。它适用于容器类组件，如 Box、Column、Row 等，以及具有布局属性的组件，如 BoxWithConstraints。...通常情况下，父容器需要使用相应的布局修饰符，如 Box 中的 BoxScope、Column 中的 ColumnScope 或 Row 中的 RowScope。
前言 Jetpack Compose中想更新界面上的任何东西都需要重组，重组本质就是再执行一次当前函数。...触发重组方式有 State值改变 调用方法刷新 State 创建State有以下几种方式 注意 只有在Kotlin中才能生效，在Java中是不行的。...= stete.value //这种情况是不会触发重组的，这里修改的user对象内部的属性，并没有改变stete.value user.name = "new value" //还有一种更常用的写法，使用...name = "new value") state.value底层重写了getter/setter（kotlin语法），它并不是一个单纯属性，还包括了set、get函数，进行赋值时调用set函数，默认使用...集合 对于集合 MutableCollection重写过的改变内容的函数如：add、set、remove等； val list = mutableStateListOf() //会更新 list.add
Android Jetpack组件 Compose 使用 前言 正文 一、创建Compose项目 1. setContent 2....，我们需要图形界面和xml去创建布局，通过预览达到我们想要的效果，而Jetpack推出的新组件Compose就解决了这个痛点，下面让我们来了解它，使用它。...使用它，来感受声明式UI的强大之处。 正文 Jetpack Compose是一个用于构建原生Android UI的现代工具包。...Jetpack Compose 通过更少的代码、强大的工具和直观的 Kotlin API 简化并加速了 Android 上的 UI 开发。 听起来好像老牛逼了！！！...下面我们用一下吧，这里我要说明一下，Compose 需要使用新版本的Android Studio，目前最新的是大黄蜂版本，以及使用Kotlin去开发，如果你对Kotlin一无所知，这可能学起来有一点难度
前言 Jetpack Compose 中的列表组件相对于之前的View方式要简单很多。...modifier = Modifier.padding(16.dp).height(30.dp), ) { Text(text) } } 注意 竖向Grid布局中的子项...，也就是上面的GridItem中的根组件的宽度是自动使用父的，设置宽度不会生效。...modifier = Modifier.padding(16.dp).height(30.dp), ) { Text(text) } } 注意 竖向Grid布局中的子项...，也就是上面的GridItem中的根组件的高度是自动使用父的，设置高度不会生效。
https://developer.android.google.cn/jetpack/compose/designsystems/material3?...组件中判断使用的主题 // 使用主题 @Composable fun MyComposable() { // 在这里使用当前的主题进行布局 if(LocalAppTheme.current...使用主题的形状样式 MaterialTheme.shapes.medium 说明 CompositionLocalProvider CompositionLocalProvider 是 Jetpack...Compose 中的一个重要概念，用于向整个组合树（Compose tree）提供特定类型的值。...在 Compose 中，组合树是由各种组合函数（如 @Composable 标记的函数）构成的层级结构，用于描述应用程序的 UI 层次结构。
前言 大约在一年半前，我发布了Compose的第一篇文章 Jetpack Compose开篇 之 HelloWorld，连我自己也没想到，这一年半的时间中我竟再也没有看过Compose..., 如今Compose...已经发布了稳定版本，还没学会Compose让我的头发又白了许多~ 使用Navigation在Compose中导航 如果你之前不喜欢Android提倡的”单Activity“应用，那么在Compose中相信你会慢慢习惯的...接下来我们来看，如何使用navigation来进行页面导航呢？...在页面2中调用popBackStack方法将当前页面出栈便又回到了页面1，这里就不贴页面2的代码了。...总结 除此之外，Navigation 在Compose中还支持深层链接等，关于Compose的更多用法，欢迎持续关注我~
github.com/coil-kt/coil Coil官方文档：https://coil-kt.github.io/coil 基本图片 添加依赖 implementation("io.coil-kt:coil-compose...:2.6.0") 添加网络权限 使用 @Composable fun LoadWebImage...modifier = Modifier.clip(CircleShape).size(60.dp) ) } 加载GIF 添加引用 implementation("io.coil-kt:coil-compose...builder = { crossfade(true)//淡出效果 }), contentDescription = null ) 自带的加载中
前言 Android 开发中我们普遍使用今日头条的适配框架。...转换为 px 的公式 px = dp * density 来实现适配，通过在运行时动态修改 density 值的大小，使得修改后计算出的屏幕宽度就等于设计稿的宽度，从而使得在不同屏幕尺寸下我们都可以直接使用设计稿给出的...所以Jetpack Compose中我们也可以参考这种方式做适配。 只适配单方向 假如屏幕 长是817dp，应用只显示为横屏。...在主题中设置 我们也可以抽取到 MaterialTheme 中，使其默认生效，进一步减少代码量。
为了让 Jetpack Compose 的使用体验更上一层楼，以及了解大家对 Compose 开发、学习方面的内容需求，这里诚邀您参与 Jetpack Compose 使用情况调研, 点击这里 即刻参与调研...在分析了各种选择后，我们做出了 (在当时) 一个大胆的决定——使用当时还处于 Alpha 预览阶段的 Jetpack Compose。...开发者的工作效率 一年多来 ，我们一直在使用 Jetpack Compose 编写用户界面代码，也得益于 Jetpack Compose 让界面开发变得更加简单。...当在 Play 商店中创建在滚动情况下频繁使用的大量重复使用界面组件时，我们发现不必要的重组会增加丢失的帧时间，从而导致卡顿。...我们与 Jetpack Compose 团队合作，推出 LazyList 项目类型缓存 等功能，并快速进行轻量级修复，如 额外的对象分配。
前言 Jetpack Compose中的页面跳转和传值和之前没什么不同。 要注意的是 组件内尽量不要进行页面的跳转，组件可以设置回调方法，在Activity中进行页面跳转操作。...val intent = Intent(baseContext, AppDetailActivity::class.java) startActivity(intent) 这里要注意的是，获取上下文使用的是...JSON字符串 intent.putExtra(String name, String value); 获取 String str = intent.getStringExtra(String name) 使用...在 Android 中，可以通过 Intent 来传递自定义对象，前提是该对象必须实现 Serializable接口。...intent.getSerializableExtra(String name); 获取 intent.getSerializableExtra("appModel",Student::class.java) 使用单例
前言 本文使用OkDownloader进行文件下载 https://github.com/ydxlt/okdownloader https://ydxlt.github.io/okdownloader/...DownloadItem) fun onFailure(downItem: DownloadItem) fun onLoading(downItem: DownloadItem) } 使用
现在，我们发布了 Jetpack Glance 的第一个 Alpha 版，让 Widgets 的构建过程变得更加轻松，该版本是建立在 Jetpack Compose 运行时 (Runtime) 之上的新框架...Glance 提供了新式声明性 Kotlin API，其类似于您在 Jetpack Compose 中使用的 API，能够帮助您用更少的代码构建更美观的自适应 App Widgets。...Glance 利用 Jetpack Compose 运行时 (Runtime)，可以将 可组合项 转化为实际的 RemoteViews，并在 App Widgets 中显示。...可以查看 在 Android 12 中构建新式 Android App Widgets 视频了解更多详细信息。 Glance 使用入门 您可以在 GitHub 上查看 示例，以便快速入门。...也可以在最新的 稳定版 Android Studio 中使用 Glance，但首先需要按照 Jetpack Compose 文档 中的步骤进行设置，因为 Glance 依赖于 Compose 运行时 (
概述 Compose已经内置了许多组件，诸如Column，Row，Box等。开发者可以通过这些组合这些已有的组件来定制自己的专属组件。...使用Layout Modifier 使用 Modifier.layout() 手动控制元素的测量和布局。通常layout修饰符的使用方法像下面这样。...Layout Modifier使用示例 有时你想在屏幕上展示一段文本信息，通常你会使用到Compose内置的Text组件。...这类似于传统View系统中定制View与ViewGroup测量布局流程的区别。对于定制“ViewGroup”的场景，我们应该使用Layout Composable了。...在我们的示例中仍然不对子元素进行额外限制，最终将每次测量的结果保存到placeables这个List中。
Jetpack Compose for Desktop 使用过程中遇到的几个大坑 最近在用 Jetpack Compose for Desktop 写一些好玩的，用的时候遇到了很多大坑，在这里总结如下：...Binary distribution 无法访问 ClassLoader Resources 我们有时候一定会希望从 jar 内部读取资源，这个时候我们一般会使用 this::class.java.getResource...@See https://github.com/JetBrains/compose-jb/issues/2011 错误的使用二进制流方式从 ClassLoader Resources 中加载字体导致界面整体卡顿...FontStyle.Normal ): Font = LoadedFont(identity, data, weight, style) 然而当你试图从 ClassLoader Resources 中传入字体的二进制流时...改用其他类型图片，如 PNG @see https://github.com/JetBrains/compose-jb/issues/1217 SVG 图片宽高比被错误计算导致 SVG 图片缩放不符合预期
通过修改状态更新可组合项目随着我们越多地使用 Compose 自带的可组合项(如Scaffolds、BottomSheet、Drawer等)，我们会意识到在 Jetpack Compose 中状态是无处不在的...附加内容：在 Jetpack Compose 中，如何使用 Kotlin 的 Flow、RxJava 或者 LiveData 表示状态？...Jetpack Compose 允许我们使用 LiveData、RxJava 的观察者、Kotlin 的 Flow 来表示 Jetpack Compose 中的状态。...这些拓展方法会帮我们把响应式的实例转换成 Jetpack Compose 中的状态实例。如何在 Jetpack Compose 中使用 Kotlin 的 Flow？...：InputText 的延迟和对应的规避方式如何在 ViewModel 中表示状态如何将 Android 中其他表示类型的状态转成 Jetpack Compose 中的状态希望能对你有帮助。
在这篇文章里，我分享一个用 Jetpack Compose、Material3和 Kotlin 语言实现使用Jetpack Compose和Kotlin开发NimWebViewApp的加载和操作的案例。...一、项目背景 本文展示如何使用 Jetpack Compose 中的 AndroidView 加载 WebView，处理页面的加载状态和返回导航操作。...（3）WebView：通过 AndroidView WebView 集成到 Jetpack Compose 中，启用了 JS 功能，大多数现代网站可以正常加载。...Compose 和 WebView 的结合 用 Jetpack Compose 的 AndroidView 可以轻松实现了传统的 Android 视图控件（如 WebView）嵌入到 Compose...六、总结 本文展示了如何在 Jetpack Compose 中集成 WebView，处理加载状态和返回导航。
一、项目背景 在现代应用中，导航是关键元素，特别是使用侧边栏（Drawer Menu）切换不同页面的场景。...通过 Jetpack Compose，安卓开发已经从传统的 XML 布局转向了声明式 UI 方式，简化了很多工作。...这个Demo演示利用 Jetpack Compose 和 Material 3 实现一个带有 Drawer 菜单的应用，帮助用户理解工作机制，通过此应用进行页面切换。...在 Jetpack Compose 中，使用 ModalNavigationDrawer 组件构建 Drawer 菜单，根据用户操作动态显示或隐藏菜单。...五、总结 通过这个DrawerMenuAppDemo，展示了如何在Jetpack Compose M3中实现一个带有抽屉菜单的安卓应用，添加更多的菜单项以及对应的页面功能。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
腾讯会议
云直播
对象存储
