标题:Qt编写自定义控件62-探探雷达
作者:liudianwu
日期:2019-10-07 22:07
内容:
一、前言
随着移动互联网的盛行，现在手机APP大行其道，每个人的手机没有十几个APP都不好意思说自己是现代人，各种聊天、购物、直播、小视频等APP，有个陌生人社交的APP叫探探，本人用过几次，当然不是去为了找对象，而是纯粹为了好玩研究下他的U设计和软件逻辑流程等，其中有个雷达控件，单击以后可以搜索附近的异性进行配对，这个雷达控件的效果蛮好的，于是手痒琢磨着用Qt来实现一个，毕竟自己写了150多个控件了，已经上瘾了，对各种效果都如鱼得水，看到各种效果都不自然的想到编码思路等。
这个控件的核心其实就是外围的那个扫描圈和发散的扫描线，中间变大变小恢复正常的圆形头像，外围的扫描圈采用锥形渐变颜色，通过透明度控制形成扫描效果，核心方法就是drawPie，至于扩散圈，需要识别到单击以后将扩散圈存入队列，因为可能会单击多次，产生多个扩散圈，至于中间头像的动态效果，采用三个QPropertyAnimation来实现，一个负责变大，一个负责变小，一个负责恢复正常，然后三个动画加入到QSequentialAnimationGroup动画序列中，按照顺序执行。
二、实现的功能
* 1:可设置中间图像
* 2:可设置图像的边框宽度+边框颜色,产生圆形图像效果
* 3:可设置扫描线的最大半径
* 4:可设置扫描线的边框宽度
* 5:可设置扩散圈的线条宽度
* 6:可设置扫描线的每次移动的步长
* 7:可设置扩散圈的每次移动的步长
* 8:可设置扫描线的颜色
* 9:可设置扩散圈的颜色
三、效果图
四、头文件代码
#ifndef SCANTANTAN_H
#define SCANTANTAN_H
/**
* 探探雷达控件 作者:东门吹雪(QQ:709102202) 整理:feiyangqingyun(QQ:517216493) 2019-10-01
* 1:可设置中间图像
* 2:可设置图像的边框宽度+边框颜色,产生圆形图像效果
* 3:可设置扫描线的最大半径
* 4:可设置扫描线的边框宽度
* 5:可设置扩散圈的线条宽度
* 6:可设置扫描线的每次移动的步长
* 7:可设置扩散圈的每次移动的步长
* 8:可设置扫描线的颜色
* 9:可设置扩散圈的颜色
*/
#include
class QSequentialAnimationGroup;
#ifdef quc
#if (QT_VERSION < QT_VERSION_CHECK(5,7,0))
#include
#else
#include
#1 [zqxwce007 10-08 08:15]
大佬，效果图呢
#2 [mengkun 10-08 08:43]
码云上的图片要登录才能看到……
我来补充一下效果图吧
#3 回 zqxwce007 的帖子 [liudianwu 10-08 15:37]
zqxwce007:大佬，效果图呢 (2019-10-08 08:15)
现在呢，再看下有没有。