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

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

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

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


http://www.kler.cn/a/597177.html

相关文章:

  • 【第12节】windows sdk编程:动态链接库与静态库
  • AI代码编辑器:Cursor和Trae
  • git tag以及git
  • 有序数组双指针问题
  • OpenCV-Contrib常用扩展模块
  • 【保姆级】Ubuntu 24.04安装Docker
  • 计数组合型dp(四种小球盒子问题总结)
  • 深入理解Linux网络随笔(五):深度理解本机网络I/O
  • 希尔排序
  • vim的一般操作(分屏操作) 和 Makefile 和 gdb
  • 实验10决策树
  • 【Uniapp】关于核心页面生命周期流程详解
  • 面试题(3)
  • Unity代码中修改动画速度
  • C#里使用libxl的数字格式
  • 1.Go - Hello World
  • NR SRS Configuration
  • 天津大学:《2025深度解读DeepSeek:原理与效应》|44页|附PPT下载方法
  • 基于AWS Endpoint Security(EPS)的自动化安全基线部署
  • 破局 MySQL 死锁:深入理解锁机制与高效解决方案