Adobe Animate CC ——Html5 Canvas

最新推荐文章于 2024-07-15 17:18:58 发布

Salmonberry

最新推荐文章于 2024-07-15 17:18:58 发布

阅读量3.7k

点赞数 2

本文链接：https://blog.csdn.net/salmonberry/article/details/88563279

版权

通過點擊事件，跳轉到指定幀，本該停止播放狀態的影片剪輯會自動播放
Slove:
- why： 主要原因是該影片剪輯在時間軸上的時間長度沒有足夠長到againButton的所在時間的位置上。
- What:
  - 時間域： 整個影片的所在時間軸上占用的時間
  - 時間域範圍： 該影片剪輯控件在時間軸上所占的時間長度的有效作用域，若該影片剪輯在播放的過程中保持某一時刻狀態，那麽只要在該時間軸上的有效作用域内，該狀態（在沒有設置循環播放的情況下）保持一直不變，但是如果在該影片剪輯所在時間作用外，通過代碼跳轉的方式重新進入到該影片剪輯的有效作用範圍内，該影片剪輯就會被再次調用（該過程，與通過new的方式，實例化一個重新初始化對象類似，所以影片就會被重新調用）
- how: 調整影片的時間長度，讓影片的時間長度與整個影片動畫的時間長度一致，那麽就相當于一個全局對象，不會被重新被初始化調用
Summary：
- An的動畫影片長度相當與程序的由運行到退出的生命周期長度；而要對單一控件進行事件綁定控制調用，應保證該控件的時間長度是與An動畫長度是一致的，從而確定該控制的狀態作用于整個生命周期,就是編程技術上說的全局對象；
- 相反來説，若對某一控件多次復用，設置不同的時間長度，就相當於實例化多個來自同一模板的同一控件，這裏和Unity中的prefab的應用一致，是一種實例化多個對象的方式。

Q2：

設置點擊事件無響應
Slove:
- **why:**主要原因是 控件命名不唯一，儅有控件被使用重複命名時，控件就無法有響應。
- **what:**控件的name命名，在一個An的動畫中是全局de 唯一id，不允許重複的。
- **how:**修改控件的命名，保證其唯一性。
Summary:
- 在An中控件的命名時唯一的id名，不可以用同樣的命名賦予給多個控件
- 在重複命名了。由於An不是專業的IDE也不會有相關的信息提示，只能通過綁定事件時，無法觸發相關的事件進行推測。

Q3：

由EaselJS 引起的設置點擊事件無響*
Slove:
- why:
  - 在 EaselJS 中，帧编号从 0 开始而不是从 1 开始。这会影响一些调用，如 **gotoandstop() **和gotoAndPlay() 调用。
  - 如果从本地文件系统运行同时具有位图和按钮的内容，一些浏览器可能会生成本地安全性错误。
- what:
```
//action217幀----EaselJS216幀
this.tufuButton.addEventListener("click", fl_ClickToGoToAndStopAtFrame_6.bind(this));
function fl_ClickToGoToAndStopAtFrame_6()
{
 this.gotoAndStop(218);
}

//action218幀----EaselJS217幀
this.kkButton.addEventListener("click", fl_MouseClickHandler_3.bind(this));
function fl_MouseClickHandler_3()
{
	// 开始您的自定义代码
	// 此示例代码在"输出"面板中显示"已单击鼠标"。
	alert("已单击鼠标");
	// 结束您的自定义代码
}
```
這裏正是由於Animate與EaselJS中對幀數的定義不同而引起的歧義問題
- how:
  - 對於所跳轉的兩個幀畫面，都爲控件關於 **gotoandstop() **和gotoAndPlay() 调用，應遵循EaseJs規範來設置幀數。確保調用**gotoandstop() **和gotoAndPlay() 方法時，所設置的幀數必須為An轉場畫面的第一楨的前一幀
Summary:
- AnimateCC是根據CreateJS而驅動的H5模式，在涉及編程時，應遵循CreateJS的規範；而對於動畫的製作則可以按照原AnimateCC的套路來做
- EaselJS 中，帧编号从 0 开始而不是从 1 开始。这会影响一些调用，如 gotoandstop() 和gotoAndPlay() 调用。

Q4：

代碼片段設置在有效時間段非初始幀而導致的交互無效
Slove:
- why：一個有效的時間片段，由初始時間到結束時間，是一個功能狀態的變化，若初始就不存在相關的功能，後續添加相關的代碼也是無效（中間幀或末幀的狀態出現，並是一個狀態的變化過程量）。
- What:
  - 有效的狀態變化： 應該從一個有效時間區間的初始幀開始設置
- how: 將末幀的代碼片段設置在初始幀上
Summary：
- AN中的代碼交互是與時間軸上的有效時間區段息息相關的，一個有效的代碼時間區段是從初態,發生態，末態的變化過程
- 而在一個時間區段的生命周期都起作用的代碼片段，必須從初態（初始幀）上設置代碼片段，而對於到某一時間段停止的（單端在某一狀態下發生效果的，並沒有在整個生周期中具有全局性意思的），則可以在特定的幀上設置代碼片段。

Q5：

部分圖片在渲染的時候無法顯示
Slove:
- why：An在轉換為Html5 Canvas時，其圖片的默認轉換格式為svg，若工程文件中使用的是Jpg,Jpeg,png格式的文件在轉換為svg會出現異常，在工程中觀察是沒有異常 ,，但在渲染中會無法渲染
- how： 將庫中的原圖片替換轉換出錯的文件，就可以解決
Summary：
- An在轉換為Html5 Canvas時,Jpg,Jpeg,png格式的文件在轉換為svg會出現異常
- 修改時，盡可能在庫中的相應元件中更改，原因在庫中的元件是一個prefab