感谢各位大佬和粉丝的厚爱和关心( 催更),我会再接再厉的,其实这也是督促自己的一种方式,非常感谢。

刚写了一篇万字长文,自己也休养生息(低调发育)了一段时间,接下来来几个小案例。

拖曳小球

WPF的拖曳效果,基本配置一下,就可以了,但是自绘的话,就得自己控制,按键点击,按键移动和按键松开的事件,与其配合达到目的。

这个效果实现了,其实也变相的实现了WPF里的拖动效果,这个效果用着还是很方便的。

但是代码,确十分的简单。

Wpf 和 SkiaSharp

新建一个WPF项目,然后,Nuget包即可 要添加Nuget包

Install-Package SkiaSharp.Views.WPF -Version 2.88.0

其中核心逻辑是这部分,会以我设置的60FPS来刷新当前的画板。

skContainer.PaintSurface += SkContainer_PaintSurface;
_ = Task.Run(() =>
{while (true){try{Dispatcher.Invoke(() =>{skContainer.InvalidateVisual();});_ = SpinWait.SpinUntil(() => false, 1000 / 60);//每秒60帧}catch{break;}}
});

实现代码的 鼠标按下,移动,鼠标松开

先对SkiaSharp对象,增加相关事件

skContainer.MouseDown += SkContainer_MouseDown;skContainer.MouseUp += SkContainer_MouseUp;skContainer.MouseMove += SkContainer_MouseMove;

然后增加相关事件处理代码,我这边都统一处理了.

private void SkContainer_MouseDown(object sender, MouseButtonEventArgs e)
{var cur = e.GetPosition(sender as IInputElement);drawClock.MouseDown(new SKPoint((float)cur.X, (float)cur.Y), true);
}
private void SkContainer_MouseUp(object sender, MouseEventArgs e)
{var cur = e.GetPosition(sender as IInputElement);drawClock.MouseDown(new SKPoint((float)cur.X, (float)cur.Y), false);
}
private void SkContainer_MouseMove(object sender, MouseEventArgs e)
{var cur = e.GetPosition(sender as IInputElement);drawClock.MouseMove(new SKPoint((float)cur.X, (float)cur.Y));
}

拖曳核心类

/// <summary>
/// 拖曳
/// </summary>
public class Drag
{public SKPoint centerPoint;public int Radius = 0;private bool Pressed = false;private bool CirclePressend = false;private SKPoint sKPoint = SKPoint.Empty;private SKPoint CirclePoint = SKPoint.Empty;private SKCanvas canvas;private float dx = 0;private float dy = 0;/// <summary>/// 渲染/// </summary>public void Render(SKCanvas canvas, SKTypeface Font, int Width, int Height){this.canvas = canvas;centerPoint = new SKPoint(Width / 2, Height / 2);this.Radius = 40;canvas.Clear(SKColors.White);if (CirclePoint.IsEmpty){CirclePoint = new SKPoint(centerPoint.X, centerPoint.Y);}if (CirclePressend){CirclePoint = new SKPoint(sKPoint.X - dx, sKPoint.Y - dy);DrawCircle(this.canvas, CirclePoint);}else{DrawCircle(this.canvas, CirclePoint);}using var paint = new SKPaint{Color = SKColors.Black,IsAntialias = true,Typeface = Font,TextSize = 24};var msg = $"X:{ sKPoint.X}  Y:{sKPoint.Y}  Pressed:{Pressed} CirclePressend:{CirclePressend}";canvas.DrawText(msg, 0, 30, paint);}public void MouseMove(SKPoint sKPoint){this.sKPoint = sKPoint;if (CirclePressend)//按下,就开始拖动{CirclePoint = sKPoint;}}public void MouseDown(SKPoint sKPoint, bool Pressed){this.sKPoint = sKPoint;this.Pressed = Pressed;if (this.Pressed){this.CirclePressend = CheckPoint(sKPoint, CirclePoint);if (this.CirclePressend){dx = sKPoint.X - CirclePoint.X;dy = sKPoint.Y - CirclePoint.Y;}}else{this.CirclePressend = false;}}public bool CheckPoint(SKPoint sKPoint, SKPoint CirclePoint){var d = Math.Sqrt(Math.Pow(sKPoint.X - CirclePoint.X, 2) + Math.Pow(sKPoint.Y - CirclePoint.Y, 2));return this.Radius >= d;}/// <summary>/// 画一个圆/// </summary>public void DrawCircle(SKCanvas canvas, SKPoint sKPoint){using var paint = new SKPaint{Color = SKColors.Blue,Style = SKPaintStyle.Fill,IsAntialias = true,StrokeWidth = 2};canvas.DrawCircle(sKPoint.X, sKPoint.Y, Radius, paint);}
}

效果如下:

我可以点的球的边边哦,这也是一个小技巧,点到球哪里,停止的时候,鼠标还在那个位置,是不是有点像拖动窗体的感觉了。

总结

以前对拖曳总是很好奇,一直想是如何实现的,现在自己也自己从头到尾的实现了,那么,它就是已知的,这就是可以写出来的进步,每天都应该有一点这样的进步。

代码地址

https://github.com/kesshei/WPFSkiaDragDemo.git

https://gitee.com/kesshei/WPFSkiaDragDemo.git

一键三连呦!,感谢大佬的支持,您的支持就是我的动力!

版权

蓝创精英团队(公众号同名,CSDN同名)

SkiaSharp 之 WPF 自绘 拖曳小球(案例版)相关推荐

  1. SkiaSharp 之 WPF 自绘时钟(案例版)

    SkiaSharp是一个跨平台2D图形API,用于.NET平台,基于Google's Skia Graphics库(skia.org网站). 它提供了一个全面的2D API,可以跨移动.服务器和桌面模 ...

  2. SkiaSharp 之 WPF 自绘 粒子花园(案例版)

    此案例包含了简单的碰撞检测,圆形碰撞检测方法,也可以说是五环弹球的升级版,具体可以根据例子参考. 粒子花园 这名字是案例的名字,效果更加具有科技感,很是不错,搞搞做成背景特效也是不错的选择. Wpf ...

  3. SkiaSharp 之 WPF 自绘 投篮小游戏(案例版)

    此案例主要是针对光线投影法碰撞检测功能的示例,顺便做成了一个小游戏,很简单,但是,效果却很不错. 投篮小游戏 规则,点击投篮目标点,就会有一个球沿着相关抛物线,然后,判断是否进入篮子里,其实就是一个矩 ...

  4. 使用WPF+MVVM模式的小案例

    WPF+MVVM模式的小案例案例主要的目录结构 下面一步一步建立整个小程序的目录和相应的代码程序. 1.打开VS, 新建项目WPFDemo.Client.CustType(自己可以写自己的程序名称,这 ...

  5. 《Axure RP7网站和APP原型制作从入门到精通(60小时案例版)》一1.3 部件概述...

    本节书摘来自异步社区<Axure RP7网站和APP原型制作从入门到精通(60小时案例版)>一书中的第1章,第1.3节,作者 金乌,更多章节内容可以访问云栖社区"异步社区&quo ...

  6. 图书推荐:《ASP.NET.基础教程——C#案例版》

    本书结合用C#语言编写的可实际运行的示例代码,讨论了ASP.NET的构架.Web窗体.配置.HTTP管道.故障诊断和错误处理.验证.数据绑定.自定义控件.缓存.状态管理和安全性,阐述用C#构建基于We ...

  7. 《数位板这样玩——Photoshop+Painter数码手绘必修课(第2版)》目录—导读

    版权声明 数位板这样玩--Photoshop+Painter数码手绘必修课(第2版) The Photoshop and Painter Artist Tablet Book, Second Edit ...

  8. C与C++游戏项目练习1:弹跳的小球简易版

    C与C++游戏项目练习1:弹跳的小球简易版 最近在研究知乎上看见的游戏专栏,被童晶老师的<C语言课程设计与游戏开发实践教程>种草了,我本来就喜欢并且专业方向也选的游戏,于是就买了一本,有空 ...

  9. matlab模糊集合及其运算,模糊数学-Matlab案例版.pdf

    模糊数学-Matlab案例版 1 基本编程思想 例题 设有矩阵 a 83 64 50 30 89 54     1     a 42 30 80 75 36 28 2     ...

最新文章

  1. 10 python中的常量
  2. angularJS1笔记-(18)-$http及用angular实现JSONP跨域访问过程
  3. 算法62---最长回文子序列长度(子串)、回文子序列总共个数(子串)【动态规划】...
  4. ios序列化与反序列化,本地化
  5. Sentinel+Nacos实现Sentinel的持久化规则,就很nice!
  6. android 点击item跳转页面,Android RecyclerView Item 点击事件,简单
  7. WPF的转换器中使用Brush应注意问题
  8. linux下关闭网络服务,Linux 关闭网络管理服务
  9. 国企营业收入逾17万亿 同比增长24.2%
  10. Tosca 添加 modules,添加Library,引用重复步骤
  11. 概率论与数理统计图解.tex
  12. 经典人生感悟 看看你少了那一条
  13. 线程池原理_Java线程池实现原理
  14. JAVA构造方法与构造方法的执行原理简单理解(栈与堆)
  15. ODIN SNN处理器
  16. 【无人驾驶系列一】激光雷达(LiDAR)在无人驾驶技术中的应用
  17. centos下smartctl安装配置(硬盘S.M.A.R.T信息及坏块检测命令)
  18. python表示倍数_python 求倍数
  19. ai 分形艺术_作为艺术家的AI?
  20. 信噪比db换算_DB和dBm有哪些区别 DB和dBm区别介绍【图文】

热门文章

  1. STM32单片机与蓝牙模块HC-05通信数据帧处理
  2. NMEA GPRMC 格式图解,NMEA 工具的比较
  3. Java虚拟机学习笔记(一)--运行时数据区域
  4. html 微信语音聊天,layaBOX实时语音聊天与微信登陆接口分享
  5. 数据结构1800关于图的代码精选(三)
  6. 趣文:三分钟了解敏捷开发
  7. android照片如何查看时间,【技巧】如何查看图片的拍摄地点和日期时间等信息...
  8. php输出3d彩票号码,3D彩票开出罕见“豹子号“!彩票中心要“赔钱”
  9. 【线段树】【cogs775】山海经
  10. 绝妙的 channel