PPAPI+Skia实现的涂鸦板

最后更新于:2022-04-01 16:03:10

[**在PPAPI插件中使用Skia绘图**](http://blog.csdn.net/foruok/article/details/50526110)介绍了如何在PPAPI中使用Skia,文末说回头要提供一个简单的涂鸦板插件,这次我来兑现承诺了。 > foruok原创,关注微信订阅号“程序视界”可联系foruok。 示例很简单,先看看效果: ![doodle](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2016-02-22_56caac34811fe.jpg "") # 涂鸦插件功能说明 功能列表: - 使用鼠标左键绘制线条 - 撤销、清除功能 - 支持CTRL+Z组合键撤销,支持ESC清除 # 项目说明 项目与[**在PPAPI插件中使用Skia绘图**](http://blog.csdn.net/foruok/article/details/50526110)这个文章里的差不多,只不过多了几个文件。VS2013中的项目视图如下: ![vcproj](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2016-02-22_56caac349a4c8.jpg "") 做一点点说明吧。 ### ppapi_doodle.cpp 这个文件实现了PPAPI插件的入口,它获取浏览器侧接口并保存在一个类型为GlobalPPBInterface(PPBInterface.h)的全局变量中,它完成与浏览器的交互,并且将事件派发到某个实例。 与之前相比,更干净了,我把其它功能都移走了。 ### PluginInstance.h(.cpp) 这是我抽象出来的代表插件实例的类。 PluginInstance这个类主要做了下面几件事: - 定义了与PPAPI交互的接口 - 抽象了鼠标和键盘事件,定义了可供派生类重写的接口 - 融合了Skia,简单分离了绘图操作,提供给派生类自我绘制的接口 PluginInstance可以实例化,但就是画个白色背景,其它什么事儿也不干。所以,我另外实现了DoodleInstance类来实现涂鸦功能。 ### DoodleInstance.h(.cpp) DoodleInstance继承了PluginInstance,重写了下列方法: - void paint(const PP_Rect *rect); - PP_Bool mouseEvent(const MouseEvent &evMouse); - PP_Bool keyboardEvent(const KeyboardEvent &evKeyboard); 如果要实现其它的插件,重写上面几个函数也是必须的。 另外我还利用Skia里的SkPath来保存“从鼠标左键按下到释放”这“一笔”画出的所有东西,配套一个SkPaint,可以定制线条颜色、粗细、线型(没实现哈哈),这两者被我放在了一个ElementGroup类里,DoodleInstance的m_paths是一个集合,其中的每个元素都代表了一个“一笔画”,paint函数里会把这些“一笔画”给绘制出来。 ### Button.h(.cpp) 观看文前那张Gif动画,里面有两个按钮,它们对应的实现就在这两个文件里了,类名是ImageButton。具体看代码了,比较直接。 ### 从资源文件里加载图片 我给ppapi_doodle项目添加了两个png格式的图片,给前面提到的按钮用。 DLL中图片资源如何转化为SkBitmap,在utils.cpp中实现,[**加载DLL中的图片资源生成Skia中的SkBitmap对象**](http://blog.csdn.net/foruok/article/details/50543762)这篇文章里说过了。 # 项目源码 源码还不太完善,比如有些资源没释放,边界没考虑……没时间细整了……到这里下载吧:[**ppapi_doodle源码**](http://download.csdn.net/detail/foruok/9411313)。 其他参考文章: - [**CEF Windows开发环境搭建**](http://blog.csdn.net/foruok/article/details/50468642) - [**CEF加载PPAPI插件**](http://blog.csdn.net/foruok/article/details/50485448) - [**VS2013编译最简单的PPAPI插件**](http://blog.csdn.net/foruok/article/details/50485461) - [**理解PPAPI的设计**](http://blog.csdn.net/foruok/article/details/50486788) - [**PPAPI插件与浏览器的交互过程**](http://blog.csdn.net/foruok/article/details/50494061) - [**Windows下从源码编译CEF**](http://blog.csdn.net/foruok/article/details/50498740) - [**编译PPAPI的media_stream_video示例**](http://blog.csdn.net/foruok/article/details/50498873) - [**PPAPI插件的绘图与输入事件处理**](http://blog.csdn.net/foruok/article/details/50499813) - [**在PPAPI插件中创建本地窗口**](http://blog.csdn.net/foruok/article/details/50513228) - [**PPAPI插件与浏览器的通信**](http://blog.csdn.net/foruok/article/details/50513315) - [**Windows下从源码编译Skia**](http://blog.csdn.net/foruok/article/details/50524726) - [**在PPAPI插件中使用Skia绘图**](http://blog.csdn.net/foruok/article/details/50526110) - [**加载DLL中的图片资源生成Skia中的SkBitmap对象**](http://blog.csdn.net/foruok/article/details/50543762)
';