PPAPI插件的動態創建、改動、刪除
一旦你完畢了PPAPI插件的開發,實際使用時可能會有下列需求:
- 動態創建PPAPI插件
- 刪除PPAPI插件
- 改變PPAPI插件的尺寸
實現起來非常easy,從JS裏直接訪問DOM(BOM)就可以。以下是一個演示樣例HTML文件:
<!DOCTYPE html> <html> <!-- Copyright (c) 2016 [email protected](programmer_sight). All rights reserved. Use of this source code is governed by a BSD-style license that can be found in the LICENSE file. --> <head> <style type="text/css"> #pluginContainer { padding: 0px; width: 1220px; height: 540px; background-color: gray; } </style> <script type="text/javascript"> function createPlugin() { var plugin = document.createElement("embed"); plugin.setAttribute("id", "explugin"); plugin.setAttribute("type", "application/x-ppapi-example"); plugin.setAttribute("width", "1200px"); plugin.setAttribute("height", "520px"); var container = document.getElementById("pluginContainer"); container.appendChild(plugin); } function deletePlugin(){ var container = document.getElementById("pluginContainer"); var plugins = container.getElementsByTagName("embed"); if(plugins.length >= 1){ container.removeChild(plugins[0]); } } function changeSize() { var plugin = document.getElementById("examplePlugin"); plugin.setAttribute("width", "600px"); plugin.setAttribute("height", "300px"); } function restoreSize() { var plugin = document.getElementById("examplePlugin"); plugin.setAttribute("width", "1200px"); plugin.setAttribute("height", "520px"); } </script> <meta charset="UTF-8"> <title>Plugin Test</title> </head> <body> <input type="button" value="CreatePPAPI" onclick="createPlugin()"/> <input type="button" value="ChangeSize" onclick="changeSize()"/> <input type="button" value="RestoreSize" onclick="restoreSize()"/> <input type="button" value="DeletePPAPI" onclick="deletePlugin()"/> <div id="pluginContainer"> <!-- <embed id="examplePlugin" type="application/x-ppapi-example" width="1200px" height="520px" /> --> </div> </body> </html>
上面的HTML演示了創建、刪除、改變大小幾種常見的操作。
須要註意的是,當你刪除一個PPAPI插件時,會調用到PPP_Instance的DidDestroy方法,你須要在這裏的C++/C代碼裏刪除插件實例,釋放對應的資源。比方Graphics 2D。Image Data等。DidDestroy調用後,過一會兒。假設沒有其它的插件實例存在。就會接著調用PPP_ShutdownModule。假設有,則不會。
個中邏輯,能夠參考理解PPAPI的設計。
當你設置embed元素的width和height屬性後,PPAPI插件裏。PPP_Instance的DidChangeView方法會被調用,你須要在這裏依據新尺寸又一次創建相關資源。
就這樣吧。
其它參考文章詳見我的專欄:【CEF與PPAPI開發】。
PPAPI插件的動態創建、改動、刪除