首页 文章 精选 留言 我的

精选列表

搜索[harmonyos开发]，共10000篇文章
优秀的个人博客,低调大师

HarmonyOS实战—实现抖音点赞和取消点赞效果

1. 双击点赞 和 双击取消点赞 如：在抖音中双击屏幕之后就可以点赞，小红心就会变亮 把白色和红色的心形图片复制到 media 下 需要图片的可以自取，下面白色图片由于没有背景，所以显示的是白色的，下载后鼠标点击就能看见了 因为要双击屏幕才能点赞，所以还要给布局组件id 代码实现： ability_main <?xml version="1.0" encoding="utf-8"?> <DirectionalLayout ohos:id="$+id:dl" xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:height="match_parent" ohos:width="match_parent" ohos:alignment="center" ohos:orientation="vertical"> <Image ohos:id="$+id:img" ohos:height="match_content" ohos:width="match_content" ohos:image_src="$media:white" ohos:background_element="cyan" > </Image> </DirectionalLayout> MainAbilitySlice package com.xdr630.listenerapplication6.slice; import com.xdr630.listenerapplication6.ResourceTable; import ohos.aafwk.ability.AbilitySlice; import ohos.aafwk.content.Intent; import ohos.agp.components.Component; import ohos.agp.components.DirectionalLayout; import ohos.agp.components.Image; public class MainAbilitySlice extends AbilitySlice implements Component.DoubleClickedListener { Image image; @Override public void onStart(Intent intent) { super.onStart(intent); super.setUIContent(ResourceTable.Layout_ability_main); //1.找到图片组件 image = (Image) findComponentById(ResourceTable.Id_img); //找到铺满屏幕布局的对象 DirectionalLayout dl = (DirectionalLayout) findComponentById(ResourceTable.Id_dl); //2.给布局添加双击事件 dl.setDoubleClickedListener(this); } @Override public void onActive() { super.onActive(); } @Override public void onForeground(Intent intent) { super.onForeground(intent); } //如果标记为false，表示没有点赞，此时把白色变为红色 //如果标记为true，表示已经点赞，再次双击后，会把红色变回白色 boolean flag = false; @Override public void onDoubleClick(Component component) { //修改图片的红星就可以了，只需要用到image就行了，所以把image定为成员变量 if (flag){ image.setImageAndDecodeBounds(ResourceTable.Media_white); //取消点赞变成白色，也要把flag设置为false flag = false; }else{ image.setImageAndDecodeBounds(ResourceTable.Media_red); //当启动项目的时候，flag初始值是false，就会走下面的else的代码，变成红色后就要把flag变成true了 flag = true; } } } 运行： 双击屏幕点赞： 双击屏幕后取消点赞： 2. 能否按照抖音的业务去实现呢? 业务分析： 双击屏幕之后点赞。（上面已实现），再次双击屏幕之后，不会取消点赞，只有点击后红心之后才能取消点赞。 单击红心也可以点赞，再次单击红心就会取消点赞 实现思路： 给最外层的布局添加双击事件，双击之后点赞，变成红色心。 如果已经被点赞，那么还是修改为红色心，相当于不做任何处理。 给图片添加单击事件。 如果没有点赞，单击之后，白色心变成红色心。 如果已经点赞了，单击之后，红色心变成白色心。 代码实现： 上面布局文件不变，MainAbilitySlice 如下： 给布局添加双击事件，因为再次双击不会取消点赞，所以把else代码里设置为红色后就把 flag 取反去掉，就不会出现再次双击取消点赞了。 给图片添加单击事件，因为涉及到点赞后为红色，再取消就变为白色，所以要把 flag 变为相反的操作 package com.xdr630.listenerapplication6.slice; import com.xdr630.listenerapplication6.ResourceTable; import ohos.aafwk.ability.AbilitySlice; import ohos.aafwk.content.Intent; import ohos.agp.components.Component; import ohos.agp.components.DirectionalLayout; import ohos.agp.components.Image; public class MainAbilitySlice extends AbilitySlice implements Component.DoubleClickedListener, Component.ClickedListener { Image image; @Override public void onStart(Intent intent) { super.onStart(intent); super.setUIContent(ResourceTable.Layout_ability_main); //1.找到图片组件 image = (Image) findComponentById(ResourceTable.Id_img); //找到铺满屏幕布局的对象 DirectionalLayout dl = (DirectionalLayout) findComponentById(ResourceTable.Id_dl); //2.给布局添加双击事件 dl.setDoubleClickedListener(this); //3.给图片添加单击事件 image.setClickedListener(this); } @Override public void onActive() { super.onActive(); } @Override public void onForeground(Intent intent) { super.onForeground(intent); } //如果标记为false，表示没有点赞，此时把白色变为红色 //如果标记为true，表示已经点赞，再次双击后，会把红色变回白色 boolean flag = false; @Override public void onDoubleClick(Component component) { //修改图片的红星就可以了，只需要用到image就行了，所以把image定为成员变量 if (flag){ image.setImageAndDecodeBounds(ResourceTable.Media_white); //取消点赞变成白色，也要把flag设置为false flag = false; }else{ image.setImageAndDecodeBounds(ResourceTable.Media_red); //当启动项目的时候，flag初始值是false，就会走下面的else的代码，此时设置为红色，把flag去掉，再次双击后就还是红色了 } } @Override public void onClick(Component component) { if (flag){ image.setImageAndDecodeBounds(ResourceTable.Media_white); flag = false; }else{ image.setImageAndDecodeBounds(ResourceTable.Media_red); flag = true; } } } 运行： 单击红心后： 再次单击红心： 双击屏幕后效果如下，再次双击屏幕就不会取消点赞了，只有点击小红心才能取消点赞
2021-08-02

资源下载

更多资源
腾讯云软件源

腾讯云软件源

为解决软件依赖安装时官方源访问速度慢的问题，腾讯云为一些软件搭建了缓存服务。您可以通过使用腾讯云软件源站来提升依赖包的安装速度。为了方便用户自由搭建服务架构，目前腾讯云软件源站支持公网访问和内网访问。

时间: 2026-08-21 大小: 1MB 下载: 10次
Nacos

Nacos

Nacos /nɑ:kəʊs/ 是 Dynamic Naming and Configuration Service 的首字母简称，一个易于构建 AI Agent 应用的动态服务发现、配置管理和AI智能体管理平台。Nacos 致力于帮助您发现、配置和管理微服务及AI智能体应用。Nacos 提供了一组简单易用的特性集，帮助您快速实现动态服务发现、服务配置、服务元数据、流量管理。Nacos 帮助您更敏捷和容易地构建、交付和管理微服务平台。

时间: 2026-09-24 大小: 189MB 下载: 9次
Rocky Linux

Rocky Linux

Rocky Linux（中文名：洛基）是由Gregory Kurtzer于2020年12月发起的企业级Linux发行版，作为CentOS稳定版停止维护后与RHEL（Red Hat Enterprise Linux）完全兼容的开源替代方案，由社区拥有并管理，支持x86_64、aarch64等架构。其通过重新编译RHEL源代码提供长期稳定性，采用模块化包装和SELinux安全架构，默认包含GNOME桌面环境及XFS文件系统，支持十年生命周期更新。

时间: 2026-08-21 大小: 1.42GB 下载: 6次
WebStorm

WebStorm

WebStorm 是jetbrains公司旗下一款JavaScript 开发工具。目前已经被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等。与IntelliJ IDEA同源，继承了IntelliJ IDEA强大的JS部分的功能。

时间: 2025-12-13 大小: 249.54MB 下载: 22次
热门标签
DeepSeek Jdk25 OpenAi HarmonyOS6 Nacos3 SpringBoot4 SpringCloud Docker Kubernetes Service Mesh Redis Gemini3 Rocky

欢迎您来访！

登录后，您将获得更多功能！
热门文章
联系我们

有任何问题或合作意向欢迎联系我们

Email: 99873273@qq.com

QQ: 99873273

用户登录
用户注册