鸿蒙开发之ArkUI 界面篇 二十五 点赞综合案例

news2024/11/26 13:26:13

要实现如下图效果,红框处是点赞数,点击会变色和数字增加1:

我们首先分析布局结构,整体式垂直方向的布局,外层容器自然是Colum,上层是图片组件Image,接下来是Text组件,接下来是Row组件,Row+Text+ImageSpan+Span+Image+Text,点击要变化的包括两部分,数字和图标和文字的颜色,这两个属性都需要用@State装饰器修饰,

总结:鸿蒙中界面的更新(包括文字、颜色等)只需要用@State修饰,并且改变对应的变量后不需要做任何改变就能自动渲染UI,点击编辑器右上角的TT按钮,点击模拟器上的按钮左边的代码也会相应的显示,如图:

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Unity实战案例全解析 类宝可梦回合制的初级案例 源码分析(加了注释和流程图)

这是一个老教程了,但是对于没有写过回合制的初级程序同学来讲是比较适合的,也可以直接看源码,半小时内可以解决战斗 当然,我也没写过回合制系统所以就到处找,思路明白了就能自己修改了 视频教程 - 油管链接 Turn-Bas…

ComfyUI | 5分钟部署最新Flux大模型

Midjourney 和 Stable Diffusion 都是目前流行的 AI 图像生成工具,它们能够根据文本描述生成高质量的图像。都是基于深度学习技术的文本到图像生成模型,但它们各自基于不同的大模型。 但最近推出了一款比前两者更强大,生成图像更加逼真&…

UE4 材质学习笔记04(着色器性能优化)

一.着色器性能优化 1.衡量着色器的性能 衡量着色器性能的主要方法有三个 第一个:可以使用场景的视图模式的优化视图模式的着色器复杂度 下面的滑条代表了着色器指令的复杂度 如果场景大部分是绿色的,说明着色器耗能低,反之白色则是很糟糕…

VS Code安装以及配置

安装 1. 下载安装 VScode官网 注意,这一步最好全部打勾 2. 设置默认terminal为cmd 3. 修改Run Code的配置 参考: https://blog.csdn.net/weixin_46474921/article/details/132841711

2024年诺贝尔物理学奖 机器学习与神经网络领域前景面面观 如何抉择

近日,2024年诺贝尔物理学奖颁发给了机器学习与神经网络领域的研究者,这是历史上首次出现这样的情况。这项奖项原本只授予对自然现象和物质的物理学研究作出重大贡献的科学家,如今却将全球范围内对机器学习和神经网络的研究和开发作为了一种能…

【element-tiptap】如何增加一个扩展项,为文字渲染颜色?

源码地址: https://github.com/Leecason/element-tiptap 可以看到,当前这个页面的文字,都是黑色的(除了链接) 酱紫有些单调,我喜欢五颜六色的。那么这篇文章就来看下菜单项里面如何增加一个颜色的扩展&…

Anaconda保姆安装教程

步骤1:下载Anaconda安装包 访问官网: 进入Anaconda官网下载页面,官网会根据电脑的操作系统自动选择适合的操作系统安装程序。 尝试进入清华大学开源软件镜像站,选择想要的版本进行下载,通常下载速度较快。 本文以从…

OpenAI重磅发布交互界面canvas,让ChatGPT成为写作和编程利器

OpenAI 宣布推出类似 Anthropic 的 Artifacts 的应用 canvas,并称「这是一种使用 ChatGPT 写作和编程的新方式」。 在 Claude 中试过 Artifacts 的朋友都知道,这能极大提升 LLM 输出结果的表现力,其支持输出文本文件、代码、网页、SVG 等等。…

Windows11 24H2 64位专业精简版:告别卡顿,流畅运行!

今日,系统之家小编给您分享2024年最新发布的Windows11 24H2精简版系统下载,该版本系统采用微软官方Windows11 24H2 26100.2033 专业版离线制作,安全无毒,不符合硬件要求的电脑也能升级。本次更新修复了系统蓝屏、绿屏的安全问题&a…

【赵渝强老师】K8s中的有状态控制器StatefulSet

在K8s中,StatefulSets将Pod部署成有状态的应用程序。通过使用StatefulSets控制器,可以为Pod提供持久存储和持久的唯一性标识符。StatefulSets控制器与Deployment控制器不同的是,StatefulSets控制器为管理的Pod维护了一个有粘性的标识符。无论…

数据科学初学者都应该知道的 15 个基本统计概念

一、介绍 数据科学的核心是统计学,它已经存在了几个世纪,但在当今的数字时代仍然至关重要。为什么?因为基本的统计概念是数据分析的支柱,使我们能够理解每天生成的大量数据。这就像与数据对话,统计学可以帮助我们提出正…

【读书笔记·VLSI电路设计方法解密】问题7:什么是基于标准单元的专用集成电路 (ASIC) 设计方法论

标准单元方法论是一种基于预组装库单元的芯片设计方法。该库中包含的标准单元和宏单元(例如存储器、I/O、特殊功能单元、锁相环(PLLs)等)已经在预定的工艺节点中设计、布局并经过验证。这些单元经过完全表征,并在逻辑、时序、物理和电气模型方面进行了定义,并正确地打包在…

npm install报错一堆sass gyp ERR!

执行npm install ,出现一堆gyp含有sass错误的情况下。 解决办法: 首页可能是node版本问题,太高或者太低,也会导致npm install安装错误(不会自动生成node_modules文件),本次试验,刚开…

刷题 - 分治

面试经典 150 题 - 分治 148. 排序链表⭐️⭐️⭐️ - 快慢指针找中间节点 - 归并排序 伪代码: 将链表拆分成两半,返回右半边头节点(左半边头节点就是原始链表头节点)对左边进行排序并返回左边头节点对右边进行排序返回右边头节…

图片压缩怎么弄?压缩图片大小的多种方法介绍

图片压缩怎么弄?图片压缩技术正是为了解决这些问题而生。通过有效减少文件大小,我们可以在保持视觉质量的前提下,更加高效地管理和分享图片。这项技术不仅能帮助个人用户优化手机或电脑的存储,还对企业在处理大量图像资产时显得尤…

小米路由器R3Gv2安装openwrt记录

前言 小米路由器R3Gv2的硬件配置与小米路由器4A千兆版一致,但bootloader有所不同,因此openwrt的固件不要互刷。另外,R3Gv2和R3G、4A百兆版是不同的设备,切勿混淆。 硬件信息 OpenWrt参数页-Xiaomi MiWiFi 3G v2 CPU&#xff1a…

Springboot网上书城小程序—计算机毕业设计源码38707

目 录 摘要 1 绪论 1.1 研究背景及意义 1.2国内外研究现状 1.3系统开发的内容 1.4论文结构与章节安排 1.5小程序框架以及目录结构介绍 2 网上书城小程序系统分析 2.1 可行性分析 2.1.1 技术可行性分析 2.1.2 经济可行性分析 2.1.3 操作可行性分析 2.2 系统功能分析…

Unity实现自定义图集(三)

以下内容是根据Unity 2020.1.0f1版本进行编写的   1、实现编辑器模式下进游戏前Pack全部自定义图集 同Unity的图集一样,Unity的编辑器模式会在进游戏前把全部的SpriteAtlas都打一次图集,如图: 我们也实现这样的效果。 首先需要获取全部的图集路径。因为目前使用的是以.…

chaos官方给的V-Ray材质优化器怎么样?

V-Ray材质优化器是一个为3ds Max设计的MAX脚本,它通过以下方式优化场景,提高渲染速度! V-Ray材质优化器安装包可找【成都渲染101云渲染,云渲码6666】提供! ​ 通过创建一个新的UV通道并使用平面映射算法展开场景对象。…

【学术会议征稿】第五届应用力学与机械工程国际学术会议(ICAMME 2024)

第五届应用力学与机械工程国际学术会议(ICAMME 2024) 2024 5th International Conference on Applied Mechanics and Mechanical Engineering 在全球技术快速发展的背景下,应用力学和机械工程作为推动现代工业创新的根基,持续展…