003-Kotlin界面开发之声明式编程范式

在这里插入图片描述

概念本源

在界面程序开发中,有两个非常典型的编程范式:命令式编程和声明式编程。命令式编程是指通过编写一系列命令来描述程序的运行逻辑,而声明式编程则是通过编写一系列声明来描述程序的状态。在命令式编程中,程序员需要关心程序的执行过程,而在声明式编程中,程序员只需要关心程序的状态。在界面开发中,声明式编程的优势尤为明显,因为界面开发的本质就是描述界面的状态。

命令式编程范式

举个简单的例子,图形界面通常需要考虑的问题是把一堆界面元素组成合理的树状结构,在命令式编程中,我们的做法看起来是下面这样的伪代码:

val root = Container()
val label = Label()
val button = Button()
val panel = Panel()panel.add(label)
panel.add(button)
root.add(panel)root.show()

这很合理,这个命令式编程的代码描述了我们创建一系列对象,包括容器、面板、界面元素,然后通过结构调整他们的相互关系,构成界面。在完成构造之后,我们调用 root.show() 来显示这个界面。这个过程中,我们需要关心的是对象的创建、对象的关系、对象的显示,这是一个过程性的描述。

声明式编程范式

其实最常见的声明式编程范式就是 HTML,HTML 是一种标记语言,它的本质是一种声明式的描述,我们通过 HTML 来描述界面的结构,而不是描述界面的构造过程。下面是一个简单的 HTML 代码片段:

<!DOCTYPE html><html>
<head><title>My First HTML Page</title>
</head>
<body><h1>Hello, World!</h1>
</body>
</html>

好多图形界面开发的程序,Qt或者WPF都采用XML来描述界面,这样的方式也是声明式的。在这种方式中,我们只需要关心界面的结构,而不需要关心界面的构造过程。这种方式的优势在于,我们可以更加专注于界面的结构,而不需要关心界面的构造过程。

Jetpack Compose的声明式界面开发

在Jetpack Compose中,提出了一个概念就是可组合的声明式界面开发。

比如,描述一列标签构成的界面,我们可以这样写:

@Composable
fun Greeting(name: String) {Text(text = "Hello $name!")
}@Composable
fun MyScreenContent(names: List<String> = listOf("Android", "there")) {Column {for (name in names) {Greeting(name = name)Divider(color = Color.Black)}}
}

这里,通过@Composable注解,我们定义了一个可组合的函数Greeting,这个函数接受一个字符串参数,然后返回一个Text组件。然后我们定义了一个MyScreenContent函数,这个函数接受一个字符串列表参数,然后返回一个Column组件,这个Column组件包含了一系列的Greeting组件和Divider组件。这样,我们就完成了一个简单的界面的描述。

深入一下

这样的方式就好像是XML这样的结构化文档,但是有是能够运行的代码。非常有意思,最好玩的是还能通过循环、判断来动态生成界面,这样的方式非常灵活,而且非常容易理解。

那么,这个玩意是如何实现的呢?

在前面Kotlin旋风之旅中,我们提到了Kotlin的DSL,这个DSL就是Jetpack Compose的核心。

Jetpack Compose的核心思想就是通过实现一种专门用于描述界面的DSL,开发人员通过这套DSL来描述和生成界面。

下面我们也试着用Kotlin的DSL来实现一个简单的DSL,通过这个DSL实现过程,对Jetpack Compose的实现原理有一个祛魅的过程,神秘感不那么强,调试的过程也会更加容易。

简化家族树DSL

我们要实现的是一种单体繁殖、类人、外星生物(也称为Person)的家族树DSL,这个DSL的结构如下:

fun main() {Person("Alice", 80) {Children {name = "Tom"age = 50Children {name = "Jerry"age = 25Children("Tom", 2)}Children {name = "Yan"age = 15}// 年龄写错了,改一下age = 53}Children(name = "Tim", age = 40) {Children(name = "Jerry", age = 5)Children(name = "Alex", age = 15)}// 调用输出函数,打印家族树print()}
}

这个描述的家族树大概是:

    |___Name: Bob, Age: 60|___Name: Tom, Age: 50|___Name: Jerry, Age: 25|___Name: Tom, Age: 2|___Name: Yan, Age: 15|___Name: Tim, Age: 40|___Name: Jerry, Age: 5|___Name: Alex, Age: 15

可以看到这个代码有几个特点:

  1. 通过Person函数来描述一个人,这个函数接受一个名字和年龄,然后通过Children函数来描述这个人的孩子。
  2. 名字和年龄可以省略,也可以通过nameage参数来指定。
  3. 描述的过程中,如果需要修改,也能通过nameage参数来修改。
  4. 能够调用print函数来打印自己的家族树。

这个DSL看起来非常简单,其实非常强大。这样就能够把一个家族树描述成跟其天然结构非常接近的、合法的Kotlin代码。

实现DSL

这个东西是怎么实现的呢?现给出完整代码:

class PersonImpl(n: String = "", a: Int = 0) {var name: String = nvar age: Int = aprivate fun nBlank(indent: Int) = " ".repeat(indent)fun print(indent: Int = 0) {print("${nBlank(indent)}|___")print("Name: $name, ")println("Age: $age")for (child in children) {child.print(indent + 2)}}private val children = mutableListOf<PersonImpl>()fun addChildren(name: String, age: Int, block: PersonImpl.() -> Unit = {}) {val child = PersonImpl()child.name = namechild.age = agechild.block()children.add(child)}operator fun invoke(block: PersonImpl.() -> Unit = {}): PersonImpl {block()return this}}fun Person(name: String = "", age: Int = 0, block: PersonImpl.() -> Unit = {}) = PersonImpl(name, age)(block)fun PersonImpl.Children(name: String = "", age: Int = 0, block: PersonImpl.() -> Unit = {}) =addChildren(name, age, block)

代码解析

上面的调用Person的方式要能实现,就需要定义一个函数,它包括三个参数,并且最后一个参数必须是一个能够接受某个类型的函数。

所以fun Person(name: String = "", age: Int = 0, block: PersonImpl.() -> Unit = {}) = PersonImpl(name, age)(block)符合这个要求,这也是一个Kotlin的语法糖,单行函数的函数定义。

同时,这个函数申明还省略了返回值类型,这是因为Kotlin的类型推导能力很强,编译器能够根据函数体的返回值类型推导出函数的返回值类型。

写成完整的函数形式,并且把构造对象和调用函数分开来写,是这样的。

fun Person(name: String = "", age: Int = 0, block: PersonImp.() -> Unit={}) {val p = PersonImp(name, age)p(block)
}

这个函数提供了调用Person(){}的方式,在大括号里面的代码,针对一个PersonImpl实例进行操作,这种方式称为接受者函数字面值。这个功能的实现,我猜要依赖于扩展函数的特性,相当于零时定义一个对象的扩展函数,并且在函数体内部可以直接访问这个对象的属性和方法。

当然,要能够想函数一样调用这个新建的对象,就需要在PersonImpl类中定义一个invoke操作符函数,这个函数的返回值是PersonImpl,这样就能够实现Person(){}的调用方式。

接下来就是Children函数,这个函数的作用是为一个PersonImpl对象添加一个孩子,这个函数的实现也是类似的,通过addChildren函数来实现。

fun PersonImpl.Children(name: String = "", age: Int = 0, block: PersonImpl.() -> Unit = {}) =addChildren(name, age, block)

这个实现了一个扩展函数,这个函数因此只能在PersonImpl对象上调用,当然,前面那个接受者函数的代码block里面,所有的调用都是针对PersonImpl对象的。

其他普通的构造函数、默认参数、属性、方法等等,都是普通的Kotlin代码,没有什么特别的。

总结

在深入进行Jetpack Compose的学习之前,我们先通过一个简单的DSL实现,了解了Jetpack Compose的核心思想:通过声明式的DSL来描述界面。这样的方式非常灵活,而且非常容易理解,也非常容易调试。通过这样的方式,我们可以更加专注于界面的结构,而不需要关心界面的构造过程。

这个实现的过程中,两个语法糖要自己在大脑里反复转换,最后一个参数是匿名函数,则可以移到括号外面;接受者匿名函数相当是临时定义一个扩展函数。

有一点点绕,但是多改改代码,也能够理解。

接下来,就要开始真正的Jetpack Compose的学习之旅了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/463107.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

OPENAI官方prompt文档解析

官方文档地址:https://platform.openai.com/docs/guides/gpt-best-practices 文档中文版来源:OpenAI 官方提示工程指南 [译] | 宝玉的分享 (baoyu.io) 1.写清楚说明 如果prompt给的范围十分模糊或是过于宽泛,那么GPT就会开始猜测您想要的内容,从而导致生成的结果偏离预期. …

代理IP地址和端口是什么?怎么进行设置?

保护个人隐私、突破地域限制、提升网络安全性是我们不断追求的目标。而代理IP地址和端口就是一种实现这些目标的重要工具。但是&#xff0c;你可能对它是什么&#xff0c;以及如何设置感到困惑。别担心&#xff0c;本文将为你揭开这些神秘的面纱&#xff0c;让你轻松掌握这项技…

【uniapp3】分享一个自己写的h5日历组件

简言 分享一下自己基于uniapp写的日历组件。如果不太满足你的需求&#xff0c;可以自己改造。 日历 实现分析&#xff1a; 页面显示 - 分为顶部显示和日历显示&#xff0c;我这里做了多行和单行显示两种情况&#xff0c;主要是当时看着手机的日历做的&#xff0c;手机上的…

rhce作业4

问题&#xff1a; 1.搭建dns服务器能够对自定义的正向或者反向域完成数据解析查询。 2.配置从DNS服务器&#xff0c;对主dns服务器进行数据备份。 配置&#xff1a; 主服务器配置 安装 关闭防火墙 主配置文件定义正反向解析域 正向解析资源记录文件 反向解析记录文件 重启…

MybatisPlus入门(八)MybatisPlus-DQL编程控制

一、字段映射与表名映射 数据库表和实体类名称一样自动关联&#xff0c;数据库表和实体类有部分情况不一样。 问题一&#xff1a;表名与编码开发设计不同步&#xff0c;表名和实体类名称不一致。 解决办法&#xff1a; 在模型类上方&#xff0c;使用TableName注解&#xf…

摩尔斯电码

偏方记忆法 F .._. 滴滴打滴 很费钱 F 费 R ._. 滴打滴 洗发水广告 滴答滴&#xff0c;滴答滴 大家好才是正的好 G 和Q 可以一起记忆有相通点 把G 也看成一个圈&#xff0c;相交的地方一个点&#xff0c;因为圈没满缺一个_ K 和 Y 可以一起记忆 把K躺着看…

Vue Router进阶详解

导航守卫 若依框架登录鉴权详解&#xff08;动态路由&#xff09;_若依鉴权-CSDN博客 完整的导航解析流程 导航被触发&#xff1a; 当用户点击页面中的链接、使用编程式导航&#xff08;如router.push或router.replace&#xff09;或手动输入URL时&#xff0c;导航流程被触发。…

如何在Linux命令行中使用GhatGPT

2、验明正身&#xff0c;证明我的所在地是国内 3、第一次提问 4、第二次提问 5、问他一首古诗 6、话不多说&#xff0c;现在来展示他的安装过程 7、输入GitHub的网址 https://github.com/aandrew-me/tgpt 8、详情页向下翻 9、到终端输入 下列命令&#xff0c;等待安装&#x…

iOS灵动岛动画小组件怎么播放动画

这个灵动岛相关的展示位置分几个地方&#xff1a; 紧凑型&#xff0c;最小化&#xff0c;扩展型&#xff0c;还有锁屏位置 我们先来看一下我这边实现的动画效果 demo下载&#xff1a; iOS灵动岛GIF动画 灵动岛样式 灵动岛有三种渲染模式&#xff1a; 第一种是 紧凑型&…

【electron+vue3】使用JustAuth实现第三方登录(前后端完整版)

实现过程 去第三方平台拿到client-id和client-secret&#xff0c;并配置一个能够外网访问回调地址redirect-uri供第三方服务回调搭建后端服务&#xff0c;引入justauth-spring-boot-starter直接在配置文件中定义好第一步的三个参数&#xff0c;并提供获取登录页面的接口和回调…

vscode makfile编译c程序

编译工具安装 为了在 Windows 上安装 GCC&#xff0c;您需要安装 MinGW-w64。 MinGW-w64 是一个开源项目&#xff0c;它为 Windows 系统提供了一个完整的 GCC 工具链&#xff0c;支持编译生成 32 位和 64 位的 Windows 应用程序。 1. 下载MinGW-w64源代码&#xff0c;如图点…

这个操作惊呆我了!海康存储 R1竟然可以这样部署Portainer

这个操作惊呆我了&#xff01;海康存储 R1竟然可以这样部署Portainer 哈喽小伙伴们好&#xff0c;我是Stark-C~ 最近到手了海康存储&#xff08;HIKVISION&#xff09;私有云R1 &#xff0c;该机的卖点还是很多的&#xff0c;比如优秀的做工&#xff0c;强大的配置&#xff0…

雷电模拟器ls内部操作adb官方方法

正常情况下&#xff0c;我们通过adb操作模拟器&#xff0c;如安装软件、运行shell命令等&#xff0c;但是用windows系统&#xff0c;adb就经常掉线&#xff0c;端口被占用&#xff0c;或者发现不到设备&#xff0c;对于调试或者自动化非常痛苦。就在雷电安装目录下&#xff0c;…

TS学习笔记

一、TS运行环境搭建 1、安装 安装命令 npm i -g typescript 第一步&#xff1a;新建index.html和demo.ts 第二步&#xff1a;在index.html引入demo.ts文件 第三步&#xff1a;运行TS的命令 tsc demo.ts 注意&#xff1a;运行命令后&#xff0c;会将ts文件转换成js文件 …

使用Jest进行JavaScript单元测试

&#x1f493; 博客主页&#xff1a;瑕疵的CSDN主页 &#x1f4dd; Gitee主页&#xff1a;瑕疵的gitee主页 ⏩ 文章专栏&#xff1a;《热点资讯》 使用Jest进行JavaScript单元测试 引言 Jest 简介 安装 Jest 创建基本配置 编写测试用例 运行测试 快照测试 模拟函数 代码覆盖率…

机器学习算法之回归算法

一、回归算法思维导图 二、算法概念、原理、应用场景和实例代码 1、线性回归 1.1、概念 ‌‌线性回归算法是一种统计分析方法&#xff0c;用于确定两种或两种以上变量之间的定量关系。‌ 线性回归算法通过建立线性方程来预测因变量&#xff08;y&#xff09;和一个或多个自变量…

Android中同步屏障(Sync Barrier)介绍

在 Android 中&#xff0c;“同步屏障”&#xff08;Sync Barrier&#xff09;是 MessageQueue 中的一种机制&#xff0c;允许系统临时忽略同步消息&#xff0c;以便优先处理异步消息。这在需要快速响应的任务&#xff08;如触摸事件和动画更新&#xff09;中尤为重要。 在 An…

突破职场瓶颈,实现个人成长

在职场生涯中&#xff0c;我们总会遇到各种各样的瓶颈。这些瓶颈如同成长道路上的荆棘&#xff0c;让我们感到困惑、焦虑甚至恐惧。然而&#xff0c;瓶颈并非无法逾越&#xff0c;只要我们掌握正确的方法&#xff0c;勇敢面对&#xff0c;就能顺利突破&#xff0c;实现个人成长…

ubuntu 24.04中安装 Easyconnect,并解决版本与服务器不匹配问题

下载安装包 下载地址 https://software.openkylin.top/openkylin/yangtze/pool/all/ 页面搜索 easyconnect 选择 easyconnect_7.6.7.3.0_amd64.deb安装 sudo dpkg --install easyconnect_7.6.7.3.0_amd64.deb卸载 sudo dpkg --remove easyconnect出现的问题 安装以后第…

判断是否是变位词

题目&#xff1a;给定两个单词&#xff0c;判断这两个单词是否是变位词。如果两个单词的字母完全相同&#xff0c;只是位置有所不同&#xff0c;则称这两个单词为变位词。例如eat和tea是变位词。 答&#xff1a;问题分析&#xff1a;判断是否为变位词&#xff0c;只需要分别统计…