当前位置: 首页 > news >正文

uniapp可拖拽消息数徽标draggable-badge,仿手机qq聊天列表未读数徽标动效

组件下载地址:https://ext.dcloud.net.cn/plugin?id=22679
兼容性:
测试了h5和微信小程序,理论支持全平台,暂不支持pc端,不过可以自己修改事件兼容pc

使用uniapp仿写了一个手机qq聊天列表右侧未读数的徽标组件,效果不敢说一模一样,几乎达到了9成
效果:拖拽时有跟随徽标的连接杆及固定点,连接杆及固定点会随着拖拽距离的远近进行缩放,达到最远距离时松开徽标会爆炸,未达到最远距离松开后徽标会返回原点并有抖动效果
效果示例:
在这里插入图片描述在这里插入图片描述

相关文章:

  • WDG看门狗
  • 【大语言模型_7】利用ragas框架评测rag系统指标
  • [杂学笔记]继承的应用场景、如何避免内存泄漏、函数模板的理解、多线程的应用场景、DNS解析的过程
  • 深入解析 DAI 与 SAI:Linux 音频驱动中的核心概念
  • armsom产品qt交叉编译
  • K8S学习之基础三十六:node-exporter部署
  • Linux中vscode编程,小白入门喂饭级教程
  • tailwindCss中中括号([])的作用
  • 【Nodejs】2024 汇总现状
  • 平板作为笔记本副屏使用spacedesk
  • AI大模型在物联网行业的应用场景深度解析
  • UE5材质法线强度控制节点FlattenNormal
  • 计算机二级web易错点(4)-选择题
  • Oracle OCP认证没落了吗?
  • 使用 5W2H 分析法学习 C 语言理论知识
  • golang单机锁实现
  • 两个docker app调用
  • 网络安全漏洞与修复 网络安全软件漏洞
  • Linux——进程(5)进程地址空间
  • HTTP/HTTPS 中 GET 请求和 POST 请求的区别与联系
  • 外交部:美方应在平等、尊重和互惠的基础上同中方开展对话
  • 铁路五一假期运输今日启动,预计发送旅客1.44亿人次
  • 北汽蓝谷一季度净亏损9.5亿元,拟定增募资不超60亿元
  • 伊朗最大港口爆炸:26公里外都能听到,超七百人受伤,原因指向化学品储存
  • 洛阳原副市长收礼品消费卡,河南通报6起违反八项规定典型问题
  • 从世界工厂走向全球创新中心,上海车展为何成为全球汽车行业风向标?