Silverlight实用窍门系列:29.Silverlight碰撞测试、检测自定义控件碰撞,雷达扫描图之扫描雷达点状态【附带源码实例】

简介:

雷达扫描图中当雷达指针转动扫描到某一个点上的时候,判断这个点的CPU值是否已经超过60的警戒位置如果超过将此点设置为红色。

        在Silverlight中我们的雷达指针是一直在做圆运动的,我们要随时检测雷达指针的位置,以及雷达是否碰撞到一个Device设备了。如果碰撞到了,就检测设备CPU值为多少?在这里我们需要解决两个问题。第一、如何随时观测雷达指针的当前位置?第二、如何检测雷达指针是否碰撞接触到了设备点?

        针对第一个问题,需要做以下处理:

             •在本例中使用Timer控件,每隔50毫秒检测一次当前的雷达指针控件位置

             •雷达指针的位置根据检测当前雷达指针旋转角度的正余弦函数得到左上角点的X、Y位置,分别加上宽和高得到右下角点的位置。

             •在本实例中的碰撞检测函数是根据国外友人Andy的两个函数改编而来的,UserControlBounds函数里面获取Point的方式有所不同。

        针对第二个问题,我们需要做以下处理:

             •根据雷达指针的左上角和右下角的两个点的位置构造一个Rect结构A(注意Rect结构描述矩形的宽高和原点),然后同理根据Device自定义控件构造一个Rect结构。

             •检测者A、B两个Rect是否重合,如果重合则进行像素级别的对比是否碰撞接触在一起。

             •因为有很多个设备点,所以需要循环检测每一个设备点在某一个时间点是否和雷达指针碰撞。

        本篇实例源码基于上一节所述,本节中将雷达指针单独制作成为一个自定义控件,另外为设备自定义控件增加了一个属性IsOutStrip(设置如果超过警戒值则为红色),现在我们来看看本篇关键源码:

复制代码
 
 
public MainPage()
{
InitializeComponent();

AddCanvasTransform();
}
RandarPointer rpointer
= new RandarPointer();
public void AddCanvasTransform()
{


AddDevice();
// 设置一个50毫秒启动一次的定时器
time = new Timer(CheckIsContent, rpointer, 0 , 50 );


}
private void AddDevice()
{
#region 添加闪动的设备
LayoutRoot.Children.Clear();
// 添加雷达指针
LayoutRoot.Children.Add(rpointer);
for ( int i = 0 ; i < 15 ; i ++ )
{
Device dev
= new Device();
// 设置X、Y坐标和Z层次
dev.SetValue(Canvas.TopProperty, dev.Y);
dev.SetValue(Canvas.LeftProperty, dev.X);

// 设置 dev.Tag为控件的左上角的点坐标和右下角的点坐标
double DevRight = dev.X + 16 ;
double DevButtom = dev.Y + 16 ;
dev.SetValue(Canvas.ZIndexProperty,
600 );
dev.Tag
= dev.X + " | " + dev.Y + " | " + DevRight + " | " + DevButtom;
LayoutRoot.Children.Add(dev);
}
#endregion
}
// 添加一个Timer定时器检测当前的指针的位置。
Timer time;
public void CheckIsContent( object state)
{
this .rpointer.Dispatcher.BeginInvoke( new labelDelegete(UpdateLab));


}
public delegate void labelDelegete();
public void UpdateLab()
{
Rectangle rectangle
= rpointer.FindName( " rectangle " ) as Rectangle;
// 获取到当前雷达指针的左上角点的位置和右下角点的位置,赋值给Tag
double top = - Math.Sin(rpointer.rTransform.Angle) * 253 + 300 ;
double left = - Math.Cos(rpointer.rTransform.Angle) * 253 + 300 ;
double right = 300 ;
double buttom = 300 ;
rpointer.Tag
= left + " | " + top + " | " + right + " | " + buttom;

// 循环获取所有的Device控件的位置和当前时间雷达指针是否碰撞
foreach (UIElement ui in LayoutRoot.Children)
{
Device device
= ui as Device;
if (device != null )
{
Rectangle rectangleblue
= device.Rectangleblue;
// 检测雷达指针是否碰撞到设备,
if (CheckCollision(device, rectangleblue, rpointer, rectangle))
{
// 检测设备CPU占用值是否大于60%,如果大于则报警
if (device.Value > 60 )
{
// 让其显示为红色
device.IsOutStrip = true ;
}
}
}
}
}
/// <summary>
/// 检查控件的位置是否碰撞在一起
/// </summary>
/// <param name="control1"> 第一用户控件 </param>
/// <param name="controlElem1"> 第一用户控件内部需要检测是否碰撞的控件 </param>
/// <param name="control2"> 第二用户控件 </param>
/// <param name="controlElem2"> 第二用户控件内部需要检测是否碰撞的控件 </param>
/// <returns></returns>
private bool CheckCollision(FrameworkElement control1, FrameworkElement controlElem1, FrameworkElement control2, FrameworkElement controlElem2)
{
// 创建两个Rect结构
Rect rect1 = UserControlBounds(control1);
Rect rect2
= UserControlBounds(control2);

// 检测这两个Rect结构是否重合
rect1.Intersect(rect2);
if (rect1 == Rect.Empty)
{
// no collision - GET OUT!
return false ;
}
else
{
bool bCollision = false ;
Point ptCheck
= new Point();

// 更精准的像素级别的碰撞对比
for ( int x = Convert.ToInt32(rect1.X); x < Convert.ToInt32(rect1.X + rect1.Width); x ++ )
{
for ( int y = Convert.ToInt32(rect1.Y); y < Convert.ToInt32(rect1.Y + rect1.Height); y ++ )
{
ptCheck.X
= x;
ptCheck.Y
= y;

List
< UIElement > hits = System.Windows.Media.VisualTreeHelper.FindElementsInHostCoordinates(ptCheck, control1) as List < UIElement > ;
if (hits.Contains(controlElem1))
{
// we have a hit on the first control elem, now see if the second elem has a similar hit
List < UIElement > hits2 = System.Windows.Media.VisualTreeHelper.FindElementsInHostCoordinates(ptCheck, control2) as List < UIElement > ;
if (hits2.Contains(controlElem2))
{
bCollision
= true ;
break ;
}
}
}
if (bCollision) break ;
}
return bCollision;
}
}
/// <summary>
/// 根据需要检测的控件的坐标位置,绘制出需要检测控件的副本Rect控件
/// </summary>
/// <param name="control"></param>
/// <returns></returns>
public Rect UserControlBounds(FrameworkElement control)
{
// 重新创建一个Rect结构。
string [] PointDirect = control.Tag.ToString().Split( ' | ' );
Point ptTopLeft
= new Point(Convert.ToDouble(PointDirect[ 0 ]), Convert.ToDouble(PointDirect[ 1 ]));
Point ptBottomRight
= new Point(Convert.ToDouble(PointDirect[ 2 ]), Convert.ToDouble(PointDirect[ 3 ]));

return new Rect(ptTopLeft, ptBottomRight);
}
复制代码

        本实例采用VS2010+Silverlight编写,如需源码点击 SLRandarHitTest.rar  下载,点击下图可查看Silverlight运行效果:

相关文章
|
2月前
|
存储 弹性计算 运维
阿里云服务器ECS经济型e实例详细介绍_性能测试和租用价格
阿里云服务器ECS经济型e实例详细介绍_性能测试和租用价格,阿里云服务器ECS推出经济型e系列,经济型e实例是阿里云面向个人开发者、学生、小微企业,在中小型网站建设、开发测试、轻量级应用等场景推出的全新入门级云服务器,CPU采用Intel Xeon Platinum架构处理器,支持1:1、1:2、1:4多种处理器内存配比,e系列性价比优选
|
29天前
|
Java 计算机视觉
java实现人脸识别源码【含测试效果图】——前台页面层(login.jsp)
java实现人脸识别源码【含测试效果图】——前台页面层(login.jsp)
12 0
|
29天前
|
Java
使用java底层实现邮件的发送(含测试,源码)
使用java底层实现邮件的发送(含测试,源码)
9 0
|
27天前
|
Java
java面向对象高级分层实例_测试类(main方法所在的类)
java面向对象高级分层实例_测试类(main方法所在的类)
9 1
|
29天前
|
Java 数据库连接 mybatis
mybatis简单案例源码详细【注释全面】——测试层(UserMapperTest.java)
mybatis简单案例源码详细【注释全面】——测试层(UserMapperTest.java)
9 0
|
29天前
|
Java 计算机视觉
java实现人脸识别源码【含测试效果图】——前台显示层(index.jsp)
java实现人脸识别源码【含测试效果图】——前台显示层(index.jsp)
15 1
|
29天前
|
Java 计算机视觉
java实现人脸识别源码【含测试效果图】——Servlet层(FaceServlet)
java实现人脸识别源码【含测试效果图】——Servlet层(FaceServlet)
10 1
|
29天前
|
Java 计算机视觉
java实现人脸识别源码【含测试效果图】——ServiceImpl层(UserServiceImpl)
java实现人脸识别源码【含测试效果图】——ServiceImpl层(UserServiceImpl)
19 1
|
29天前
|
Java 计算机视觉
java实现人脸识别源码【含测试效果图】——Service层(IUserService)
java实现人脸识别源码【含测试效果图】——Service层(IUserService)
13 1
|
29天前
|
Java 计算机视觉
java实现人脸识别源码【含测试效果图】——DaoImpl层(UserDaoImpl)
java实现人脸识别源码【含测试效果图】——DaoImpl层(UserDaoImpl)
9 1