HarmonyOS实战

您所在的位置:网站首页 抖音里怎样取消点赞和评论呢 HarmonyOS实战

HarmonyOS实战

2024-07-09 11:28| 来源: 网络整理| 查看: 265

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

兮动人 2021-08-05 09:36:34 博主文章分类:HarmonyOS ©著作权

文章标签 ide 双击事件 单击事件 ico xml 文章分类 代码人生

©著作权归作者所有:来自51CTO博客作者兮动人的原创作品,请联系作者获取转载授权,否则将追究法律责任

 

文章目录 1. 双击点赞 和 双击取消点赞 2. 能否按照抖音的业务去实现呢?

 

1. 双击点赞 和 双击取消点赞 如:在抖音中双击屏幕之后就可以点赞,小红心就会变亮HarmonyOS实战—实现抖音点赞和取消点赞效果_xml 把白色和红色的心形图片复制到 media 下HarmonyOS实战—实现抖音点赞和取消点赞效果_ide_02HarmonyOS实战—实现抖音点赞和取消点赞效果_ide_03 需要图片的可以自取,下面白色图片由于没有背景,所以显示的是白色的,下载后鼠标点击就能看见了HarmonyOS实战—实现抖音点赞和取消点赞效果_单击事件_04HarmonyOS实战—实现抖音点赞和取消点赞效果_ide_05 因为要双击屏幕才能点赞,所以还要给布局组件id 代码实现:

ability_main

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; } } } 运行:HarmonyOS实战—实现抖音点赞和取消点赞效果_双击事件_06 双击屏幕点赞:HarmonyOS实战—实现抖音点赞和取消点赞效果_ico_07 双击屏幕后取消点赞:HarmonyOS实战—实现抖音点赞和取消点赞效果_单击事件_08 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; } } }

运行:HarmonyOS实战—实现抖音点赞和取消点赞效果_ico_09

单击红心后:HarmonyOS实战—实现抖音点赞和取消点赞效果_ide_10

再次单击红心:HarmonyOS实战—实现抖音点赞和取消点赞效果_ide_11

双击屏幕后效果如下,再次双击屏幕就不会取消点赞了,只有点击小红心才能取消点赞HarmonyOS实战—实现抖音点赞和取消点赞效果_单击事件_12

 

收藏 评论 分享 举报

上一篇:HarmonyOS实战—组件的外边距和内边距

下一篇:HarmonyOS实战—Text组件宽高三种值的写法和颜色属性



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3