【开源】圆形屏雷达DEMO

二哲科技

1.介绍
第一次使用迪文屏的圆形屏幕，其实在想做一些什么Demo呢，后面突然想到，可以做一个雷达扫描装置，这个雷达扫描装置，可以用在定位，信号检测，让无线信号可视化，由于是圆形屏幕，整体感官会比方形屏幕更好。那我们就开始设计吧！
2.设计
首先就是找素材和设计素材，下面是我自己设计的关于雷达扫描的素材。

图1

其中雷达信号是一个动态的闪烁光点，这里设计了动图。

同时在代码中设计了动画函数，直接调用即可。

1. //点动画
   
2. void point_animat(u8 point_value)
   
3. {
   
4.     if(point_list[point_value].increase_flag == 0)
   
5.     {
   
6.         point_list[point_value].animat_cnt++;
   
7.         if(point_list[point_value].animat_cnt >= 4)
   
8.         {
   
9.             point_list[point_value].increase_flag = 1;
   
10.         }
    
11.     }
    
12.     else
    
13.     {
    
14.         point_list[point_value].animat_cnt--;
    
15.         if(point_list[point_value].animat_cnt <= 0)
    
16.         {
    
17.             point_list[point_value].increase_flag = 0;
    
18.         }
    
19.     }
    
20.    
    
21.     write_dgus_vp(0x2000, (u8 *)&point_list[point_value].animat_cnt, 2);
    
22. }

复制代码

之后就是扫描的动画，定义好圆心，然后让图片进行旋转。

1. //雷达扫描旋转
   
2. void radar_scan()
   
3. {
   
4.     static u16 angle = 0;
   
5.     static u16 timer_cnt = 0;
   
6. 
   
7.     if(display_status == 0)     //扫描状态才进行扫描
   
8.     {
   
9.         timer_cnt++;
   
10.         if(timer_cnt >= 2000)
    
11.         {
    
12.             timer_cnt = 0;
    
13.             angle++;
    
14.             if(angle >= 360)
    
15.             {
    
16.                 angle = 0;
    
17.             }
    
18.             write_dgus_vp(0x1000, (u8 *)&angle, 2);
    
19.         }
    
20.     }
    
21. }

复制代码

之后就是串口数据的定义了，这里代码太长，我就不贴了，后面可以自己去源码里面看，都写着注释呢，协议内容如下。

1. /*协议
   
2. byte0 0添加 1删除
   
3. byte1 rssi
   
4. byte2~14 addr
   
5. byte15 名字长度
   
6. byte16~+ 名字
   
7. */

复制代码

最后的逻辑就是，接收到添加信号点的协议，就显示一个信号点，每个信号点都有自己相应的向心轴线，然后通过RSSI调整和中心点的位置，使得每个信号点不会进行太多的叠加。

根据三角函数，然后设置对应的位置，代码如下：

1.         #define POINT_CENTRE  210
   
2.         #define PI 3.14159265
   
3.         #define TRIGONOMETRIC 3.14159265 / 180
   
4. 
   
5.         void point_pos_set(u8 point_value, u8 rssi_value)
   
6.         {
   
7.             u8 set_pos[] = {0x00, 0x00, 0x00, 0x00};
   
8. 
   
9.             point_list[point_value].pos_x = sin((float)(point_value * 45) * TRIGONOMETRIC) * (210 * (float)(rssi_value / 100.0f)) + POINT_CENTRE;
   
10.             point_list[point_value].pos_y = cos((float)(point_value * 45) * TRIGONOMETRIC) * (210 * (float)(rssi_value / 100.0f)) + POINT_CENTRE;
    
11. 
    
12.             set_pos[0] = point_list[point_value].pos_x / 256;
    
13.             set_pos[1] = point_list[point_value].pos_x % 256;
    
14.             set_pos[2] = point_list[point_value].pos_y / 256;
    
15.             set_pos[3] = point_list[point_value].pos_y % 256;
    
16. 
    
17.             write_dgus_vp(point_value * 0x100 + 0x2100 + 1, set_pos, 2);
    
18.             UART2_Sendbyte(set_pos[0]);
    
19.             UART2_Sendbyte(set_pos[1]);
    
20.             UART2_Sendbyte(set_pos[2]);
    
21.             UART2_Sendbyte(set_pos[3]);
    
22.         }

复制代码

上面都是逻辑的设计，接下来就是界面的设计了，首先设计一个开机界面，为了给开机界面加上一定的动画，我拿基本控件给盖住背景，让其有一定的动画效果。

这里有一个小窍门，就是我本来一开始不准备设计开机动画的，之后设计开机动画，但是已经有个0号界面了，用开机动画替换0号界面有点问题，后面我就在开机的时候，直接切换界面，这样开机的时候默认就是切换后的那个界面了。

图2

之后就是设计蓝牙扫描界面，和显示详细信息弹窗了，这一部分调试主要调试显示信号点位置和弹窗显示，具体设计界面如下图3所示。

图3

设计完成之后，结合C51的程序，就可以让屏幕动起来了，具体效果，大家可以看下面的视频。

3.总结

第一次接触迪文的圆形屏幕，一开始使用还有点不熟悉，后面多踩几次坑就熟悉了，对于圆形屏的Demo这只是刚刚开始，后面还会有更多有趣的Demo分享给大家的~

演示视频：https://www.bilibili.com/video/BV1No4y1h78a

项目源码和工程：

dingyu000111

做的很不错，厉害
动态图形可以用矩形来实现， 区域触摸控制，做的很有想法

二哲科技

dingyu000111 发表于 2023-4-21 16:54
做的很不错，厉害
动态图形可以用矩形来实现， 区域触摸控制，做的很有想法 ...

还有更多有意思的设计在后面呢~

1715605760

不错不错，不愧是练习两年半