Director基礎教程:Shockwave 預載技術（3）

2024-09-08 19:27:09

字體：大中小

來源：轉載

供稿：網友

shockwave 預載技術
　　原著：lingoworkshop
　　翻譯：alphachi

第二部分：進度條組件

　　在上一部分，我們創建了一個“preloader”父代劇本用來：（1）預載一個url；（2）當預載完成時發送一個消息；（3）預載進行時發送“狀況”消息。在這一部分，我們將創建一個可以顯示當前狀況（例如預載完成的百分比）的進度條。

　　創建進度條有很多種方法。我們可以使用flash角色、可拉伸的圖形角色、普通的文本角色以及像os controls這樣的xtras提供的相關組件等，不過在這里，我們選擇了imaging lingo。無論使用何種方法，劇本自身都應該能夠對下列消息做出響應：（a）等待連接到服務器時發送的mshowworking消息；（b）知道預載已經完成多少時發送的mshowprogress消息（是一個數值）。

　　當我們將mshowworking消息發送給下面的劇本時，一個簡單的動畫將被繪制到舞臺上。當我們發送mshowprogress消息時，這個動畫將被一個簡單的進度條替換。

simple progress bar (v.1)

-- 聲明屬性變量
property mycolour, mycolour2
property mycanvas, myscreenrect, mybuffer, mybufferrect
property mystep, mysegmentsize

on beginsprite me
　　 thissprite = sprite ( me . spritenum )
-- 確定繪制范圍
　　 myscreenrect = thissprite. rect
-- 對輸出圖像進行引用
　　 mycanvas = ( the stage ). image
-- 創建圖像緩沖
　　 mybuffer = image (myscreenrect. width , myscreenrect. height , 24 )
　　 mybuffer. copypixels (mycanvas, mybuffer. rect , myscreenrect)
-- 存儲rect以便稍后使用
　　 mybufferrect = mybuffer. rect
-- 建立動畫運行參數
　　 mystep = 0
　　 mysegmentsize = mybuffer. height - 4
-- 控制其他的角色
sendallsprites ( # mregisterwidget, me , # progressbar)
end

on mshowprogress ( me , amt)
-- 確保amt在0和1.0之間
　　 amt = min ( 1 . 0 , max ( 0 , amt))
-- 復制緩沖
　　 buffer = mybuffer. duplicate ()
-- 繪制邊界
　　 buffer. draw (mybufferrect, [ # shapetype: #rect , # color: mycolour])
-- 計算基于顯示數量的填充rect
　　 progressbarrect = rect ( 2 , 2 , (mybufferrect. width - 2 )*amt, mybufferrect. height - 2 )
-- 填充進度條rect
　　 buffer. fill (progressbarrect, mycolour)
-- 將運行結果復制到舞臺上
　　 mycanvas. copypixels (buffer, myscreenrect, mybufferrect)
end

on mshowworking ( me )
-- 復制緩沖
　　 buffer = mybuffer. duplicate ()
-- 繪制邊界
　　 buffer. draw (mybufferrect, [ # shapetype: #rect , # color: mycolour])
-- 給屬性變量mystep加1，以便單獨移動stripes
　　 mystep = mystep + 1
-- 如果繪制部分過大則進行重設
if mystep > 0 then mystep = -mysegmentsize
-- 創建臨時圖像
　　 innerrect = buffer. rect . inflate (- 2 ,- 2 )
　　 innerimage = image (innerrect. width , innerrect. height , 24 )
　　 innerimage. fill (innerimage. rect , mycolour)
-- 繪制stripes
　　 l = mystep
repeat while true
　　　　 drect = rect (l, 0 , l + mysegmentsize, mysegmentsize+ 2 )
　　　　 innerimage. draw ( point (l, 0 ), point ( l + mysegmentsize, mysegmentsize), [ # shapetype: #line , # linesize: 1 , # color: mycolour2, # ink: 2 ])
　　　　 l = l + mysegmentsize
if l > buffer. width then exit repeat
end repeat
-- 向緩沖中添加內容
　　 buffer. copypixels (innerimage, innerrect, innerimage. rect )
-- 將運行結果復制到舞臺上
　　 mycanvas. copypixels (buffer, myscreenrect, mybufferrect)
end

on getpropertydescriptionlist ( me )
　　 pdlist = [:]
　　 pdlist[ # mycolour] = [ # comment: "bar colour" , # format: #color , # default: rgb ( 68 , 68 , 68 )]
　　 pdlist[ # mycolour2] = [ # comment: "stripe colour " , # format: #color , # default: rgb ( 255 , 255 , 255 )]
return pdlist
end

　　這個簡單的進度條行為本身唯一的作用只是對mshowworking和mshowprogress消息做出響應，而當beginsprite事件發生時，它又會發出一個mregisterwidget消息，這樣做的目的是讓別的對象能夠獲得對其的引用（作為參數和mregisterwidget消息同時被發送的“me”引用）。這些對象需要此引用以便進行反饋工作，當然，也可以使用sendsprite和sendallsprite命令實現這一點。

[1] [2] 下一頁

上一篇：Director基礎教程:Shockwave 預載技術（2）

下一篇：Director基礎教程:Shockwave 預載技術（4）