蔣維 劉華煜


摘要:本文介紹了在Flash中如何利用動作腳本實現放大鏡移動到小圖上的任意位置時,舞臺上會相應地出現放大鏡放置位置的局部放大圖。
關鍵詞:Flash;動作腳本;放大鏡
中圖分類號:TP311? ? ? ? 文獻標識碼:A
文章編號:1009-3044(2019)20-0267-02
開放科學(資源服務)標識碼(OSID):
Flash中制作的放大鏡效果通常是利用遮罩的方法,把同一副圖的大小圖重疊放置,再將放大鏡作為遮罩層將大圖遮住,舞臺上看到的是小圖,只有在鏡面所在處才露出大圖,為了使放大鏡鏡面中顯示出的大圖內容與放大鏡放置在小圖上的內容一致,就不能使大小圖顯示的圖像位置有差異,在放大過程中就需要隨時改變大圖的坐標位置,使其出現在小圖同一位置內容的上方,為了方便準確地移動大圖的坐標位置,我們在調整大小圖相對大小時需要兩圖的縱橫比例一樣。本文中介紹的放大鏡的制作方法,沒有上述的諸多條件限制,可以更為靈活便捷的實現放大鏡效果。
1 程序的設計與實現
1.1 程序的設計
程序的基本設計思想是把小圖放在舞臺上的一角,這個小圖可以是大圖的縮小圖,也可以是與大圖相似的小圖,在本設計中大圖和小圖的縱橫比可以不用一致。鼠標拖動放大鏡使放大鏡在小圖上隨意移動,放大鏡的移動范圍可控制在小圖面積內,也可是整個舞臺。當放大鏡移動到小圖上的某位置時,舞臺中間就會出現放大鏡所在位置的局部放大圖,如圖1所示。
1.2 程序的實現
1.2.1 制作的原理
在Flash中,一個元件對象在舞臺上的坐標值是以注冊點來定位的,一個元件的注冊點默認是在此元件的左上角,如果讓放大鏡的移動區域大小與小圖的大小一樣,則放大鏡在小圖區域內移動時放大鏡的鏡片可能會移出小圖畫面,如圖2所示,圖2中十字交叉點為放大鏡的注冊點,在圖2中我們可以看到放大鏡的鏡片可能會移動到我們不需要放大的地方,要解決此問題我們可以把放大鏡的移動區域控制得比小圖面積小,如圖3所示,也可以嘗試把放大鏡的注冊點定義在對象中心點或者右下角等地方。為了使大圖顯示的內容隨著放大鏡位置的移動而變化,大圖移動的注冊點坐標位置區域要與放大鏡移動的注冊點坐標位置區域在相反的坐標象限區域內,例如:放大鏡當前注冊點坐標值為(20,40),則大圖的注冊點坐標值要為(a*20,b*40),若小圖是由大圖等比縮放變化的,則a、b的值相等,否則a、b的值要根據大圖相對于小圖的大小比例取值,如圖4所示。
1.2.2 實現過程
新建一文檔,設置舞臺大小為(600,400),此處可設置為任意舞臺窗口大小;
在時間軸面板的圖層上依次創建三個圖層,分別放置大地圖、小地圖、放大鏡,把它們轉化為元件 — 影片剪輯,分別調整它們在舞臺上的大小和位置,其中在調整大地圖大小時為了更好地得到放大效果應使得其大于舞臺窗口大小;
選中放大鏡圖層的第一個關鍵幀,打開動作面板輸入以
2 結論
本文利用動作腳本制作了放大鏡動畫效果,對于程序中的一些參數設置,我們可以根據實際制作情況進行更改和調整,如在設置startDrag()函數的第二個參數時就可以把移動區域固定在小圖區域內:Rectangle(0,0, xiaotu.width-50, xiaotu.height-50),還有大圖取得的坐標值的放大倍數值隨著大圖放大得越大,倍數值也應越大等等,用戶可根據自己的需求進行設計。
參考文獻:
[1] 李志勇,李亮.Flash互動編程設計——基于ActionScript 3.0 [M].北京:清華大學出版社,2017.
[2] 張建琴,官彬彬.Flash CS6動畫制作案例教程[M]. 北京:清華大學出版社,2018:2.
【通聯編輯:唐一東】