KineticJS 是一个流行的 HTML5 canvas 库，它允许用户创建交互式图形应用程序。然而，当需要在移动设备上显示 KineticJS 画布时，由于不同设备的分辨率和大小差异，可能会导致画布元素失真或过小。幸运的是，CocoonJS 提供了一个名为 idtkscale 的属性，可以帮助我们解决这个问题。
什么是 CocoonJS？
CocoonJS 是一个 HTML5 游戏引擎，它可以将游戏打包到本机应用程序中，并提供了一些优化功能（例如加速器、物理引擎等），以使游戏在移动设备上运行更流畅。其中一个非常有用的功能是 idtkscale 属性。
如何使用 CocoonJS idtkscale？
首先，确保你已经在你的项目中添加 CocoonJS 插件并正确配置了你的 CocoonJS 应用程序。接下来，我们需要在 KineticJS 中启用 idtkscale。这可以通过以下代码实现：
-- -------------------- ---- -------
--- ----- - --- ---------------
---------- ------------
------ ----
------- ----
------ -
-- ----------------- - ----
-- ------------------ - ---
--
---------- ----
---在上面的代码中，我们通过将 idtkscale 属性设置为 true 启用了 CocoonJS 的缩放功能。此外，我们还在舞台配置对象中使用了一个 scale 对象，用于计算画布的初始缩放比例。
接下来，我们需要添加一些事件处理程序，以确保画布在设备旋转或窗口大小变化时正确缩放：
-- -------------------- ---- -------
--------------------------------- ---------- -
--- ----- - ------------------
--- ------ - -------------------
-------------------
---------------------
-------------
-- ----- - ----
-- ------ - ---
---
-------------
-- -------
-------------------------------------------- ---------- -
--------------------- -
--- ----- - ------------------
--- ------ - -------------------
-------------------
---------------------
-------------
-- ----- - ----
-- ------ - ---
---
-------------
-- -----
-- -------在上面的代码中，我们添加了两个事件处理程序：一个是 resize 事件，用于在窗口大小变化时更新画布缩放比例；另一个是 orientationchange 事件，用于在设备旋转时更新画布缩放比例。注意，由于设备旋转事件可能发生得非常快，因此我们使用了一个 setTimeout 函数来延迟更新操作。
现在，我们已经启用了 CocoonJS 的缩放功能，并在窗口大小变化或设备旋转时更新了画布的缩放比例。让我们来看一下完整的示例代码：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
---------------- ------ ---- -------- -----------------
------- ------------------------------------------------------------------------------
------- ----------------------------------------------------------------------
------- -----------------------------------------------------------------------------
-------
------
---- ---------------------
--------
--- ----- - --- ---------------
---------- ------------
------ ----
------- ----
------ -
-- ----------------- - ----
-- ------------------ - ---
--
---------- ----
---
--- ----- - --- -------
- ----------------------------------------------------------- --------
----------------------------------------------------------------------------------