實現動畫的方法 計算機達人成長之路(21)

2021-09-22 03:28:16 字數 4867 閱讀 3182

2、天馬行空

木鴻飛提前乙個月來到了xt大學。

三年前,他是校園裡可有可無的過客,三年後,他已經是學校的一員。三年前,他還來不及仔細欣賞校園的美景,三年後,他有足夠的時間細細品味這優美的畫卷。三年前,他對計算機只有驚鴻一瞥,三年後,他終於可以與計算機戀愛般親密接觸。

再次來到大學校園,木鴻飛不再來去匆匆,卻是緩緩而行,貪婪的欣賞著周圍的美景。穿過三道拱門組成的校門,景色依舊,庭院深深深幾許,一條大路從校門向內延伸,直至眼光的盡頭。道路兩旁綠樹成蔭,從校門前行200公尺,是乙個田徑場,場內青草依依,微風吹過,綠色的草浪此起彼伏,彷彿在訴說校園裡多麼熱鬧,多麼生機勃勃。

從最南邊,到最北邊,穿越校園就是穿越乙個巨大而美麗的公園,在這裡,上課將是一次次穿越花園的旅行!

旅行結束,到達北青樓,木鴻飛又見到了幾年前熟悉的面孔,結實的高老師乙個勁的感嘆,「時間過得真快,小小木居然就讀大學了!」。一如木鴻飛工作後感嘆白雲蒼狗一般,記得剛剛參加工作時,看著同事的小孩在膝下嬉鬧,十年彈指一揮間,如今卻常常聽同事訴說自己的小孩在大學中如何如何,唉,年輕真好!

得知弟弟提前到來,哥哥早有準備,他專門從系裡借了一台486機器。三年過去了,486早已是昨日黃花,如今是586(奔騰)的時代,甚至傳說中686也已經問世,所以暑假期間借一台淘汰的486到家裡使用還是可以的,這樣也省去了來回奔波上機的麻煩。

了解到木鴻飛高中開設了計算機課,還編寫了俄羅斯方塊,哥哥興趣大增,要求木鴻飛演示一把。只是演示什麼呢?俄羅斯方塊程式在5寸磁碟中,但5寸磁碟早已全面被淘汰,資料取不出來。

「那就演示動畫吧。」木鴻飛想了想,設計動畫程式似乎是最方便的。

「哦,你還會動畫!」哥哥吃驚的說道,然後馬上出題:「設計乙個從左邊移動到右邊的矩形。」

與俄羅斯方塊相比,這個需求實在是太簡單了,木鴻飛思索了一陣子,開啟qbasic,在發一點時間習慣後,寫出了這段**。

「我再編個天馬飛翔的動畫。」前面的熱身顯然達到了效果,木鴻飛主動請纓再戰,程式設計癮已經吊起,還可以show一次,何樂而不為。

但木鴻飛並不馬上程式設計,而是拿出紙筆,用簡筆畫的方式勾勒出一匹大馬,再在背上加上雙翅,然後為每一根線條標上座標,整個過程大約髮費了兩個小時。然後才進入qbasic,開始輸入**,又過了乙個多小時,一匹背生翅膀的天馬從右到左飛過螢幕,螢幕黑黑的,時不時反射幾絲亮光,就如同從宇宙深處掠過一般。

哥哥點點頭,對這個作品讚不絕口:「很好,很好。先準備,再程式設計,比很多大學生強多了。現在有的學生連幹什麼都不知道就直接上機去了,真不明白他們要編什麼。」

「無準備,不程式設計!」木鴻飛想起了設計俄羅斯方塊時寫滿**的筆記本,看來當初的做法是正確了。「我設計的馬並不是簡單的飛過螢幕怎麼簡單,你看,」木鴻飛再次執行程式,「在移動的過程中,翅膀上下翻動,馬腿前後移動,而且整匹馬也沒有保持在同乙個水平線上,而是忽上忽下,用來表示跑動中顛簸的效果。」

「你是如何實現上下顛簸的?」哥哥問道:「有沒有為每個位置的馬單獨設計**?」

「沒有,我使用了乙個函式來畫馬,馬的左上角座標是函式的引數,比如x是左上角的橫座標,y是左上角的縱座標。函式中所有的畫線過程均採用相對座標,比如這條線從(x+1,y+10)開始畫起,到(x+10, y+20)結束。無論在任何位置,都可以很方便的實現。」木鴻飛回答道。

「會使用函式,很好,很好!」哥哥繼續點頭:「你是如何實現動畫的?」

「動畫很簡單,它由兩個步驟組成:顯示和擦除。顯示就是直接畫出馬就可以了,而擦除嗎,」木鴻飛洋洋得意起來,「其實就是在原地方用黑色再畫一次,馬就消失了,然後把左上角座標移動到新的位置繼續顯示,馬就前移了!不斷的擦除和顯示,就形成了動畫的效果。我在俄羅斯方塊中就是這麼做的。」

「在原處用黑色畫馬實現動畫。」哥哥若有所思,「你有沒有考慮,還有什麼方法可以實現動畫呢?這些方法都有什麼優缺點?比如目前你使用的方法實現動畫有什不足?」

「多種方法?不足之處?」木鴻飛搖搖頭,「我沒有考慮過。」

「應該考慮,至少還有四種方法可以實現動畫。」哥哥說道。

「還有四種,加上這一種不就是五種。我不知道。」頓了頓,木鴻飛補充道:「為什麼要考慮這麼多方法,反正可以實現了,不浪費吧。」

「在計算機中常常有多種方法可以實現同一件事情,也就是條條大路通羅馬。真正的程式設計師需要綜合各種情況,思索各種實現方法,並從中選擇最適合的一種。」哥哥一本正經的說道,但木鴻飛顯然不理解,一臉的不可置信。

「不信?」哥哥略一沉思,計從心來,「讓我們演示一下。我在這個程式開頭部分增加乙個語句,設定螢幕背景為藍色,咱們再看看效果。」

程式再次執行,藍色的螢幕上,天馬消失的無影無蹤,取而代之的是,紅線、黑線依次劃過,留下一片漆黑的區域。

程式執行「異常」,木鴻飛大吃一驚,疑惑之情暴露無遺。不過這一切都在哥哥的預料之內。「實現動畫的第一種方法,就是在原位置處以底色重畫一次。記住是以底色重畫一次,不是以黑色重畫。」哥哥講述「底色」和「黑色」時明顯加重了語氣。

「我明白了!」木鴻飛也是八面玲瓏,一點就通,「我應該用藍色重畫天馬!」說幹就幹,更改**後,久違的天馬終於再次行空,所不同的是上次是掠過宇宙星空,而本次則是劃過藍天。

「很好。」哥哥毫不吝嗇對木鴻飛的讚譽,同時開始諄諄教導,「但是這種方法有個缺點,你發現了嗎?」

「沒有!」木鴻飛很直接。

「以底色重畫天馬來實現動畫,這種方法的優點是簡單,但缺點是,如果背景不是純底色時,會破壞原來的背景。」見木鴻飛緊鎖眉頭,哥哥繼續解釋:「假設你的背景是由太陽、星星和地球的圖案,當你用背景色——比如黑色——重畫時,螢幕上留下的將是黑色的線條,原來的背影將被黑色取代。而隨著動畫的繼續,最終天馬飛過的地方將全成為黑色……」

「就像剛剛以藍色為背景時一樣。」木鴻飛明白了,開始搶答。

「對!所以第二種動畫方法就是以異或方式畫圖。」重音在「異或」上。

「疑惑?」木鴻飛只知疑惑,不識異或。

「異或是位執行,你還沒有學習二進位制,不過沒關係,二進位制很簡單,你的數學也很好,應該馬上能夠理解。」哥哥開始現場教學。

不一會兒,木鴻飛理解了「異或」的特性:對同一背景,同一圖形,使用「異或」方式顯示兩次,則背景復原,就如同從來沒有顯示一樣。程式的更改也很簡單:在開始處將輸出方式設定為「異或」;「擦除」時也不再使用背景色而使用前景色——此處是紅色——即可。為了使演示結果更具備說服力,木鴻飛還在移動前畫了若干個幾何圖形充當背景。

程式開始執行,天馬飛過星空後,星空背景一切依舊,成功!木鴻飛歡喜的手舞足蹈,不住的說:「這個方法好,這個方法好!簡單!」

「使用異或方式是實現動畫的一種方法,其優點是可以保護背景,但是缺點也顯而易見。」哥哥繼續爆料。

「它還有缺點?還顯而易見?我怎麼沒有看到。」木鴻飛已經完全陷入驚奇當中。

「你別只顧高興,平靜的觀察的話肯定可以發現。」哥哥叫停木鴻飛的興奮。

「好。」木鴻飛深吸一口氣,平靜一下心情,然後看了看**,好像還是沒有什麼特別,再執行程式,終於有了發現:「天馬的顏色變了,程式使用了紅色,但顯示出來是紫紅色!還有通過背景幾何圖形時,那些交叉的點顏色都變了!」

「對,異或方式顯示容易更改顏色。」說著,哥哥拿起筆,在紙上演示:「你看,本來輸出紅色,紅色**是0100,而背景是藍色,藍色**是0001,這兩種顏色異或後是0101,正好是紫紅色。」

「哦,我明白了。」木鴻飛恍然大悟,「有沒有什麼方法既可以保留背景,又不更改顯示的顏色呢。」

「你能這麼想就對了!程式就是在一次次改進中前行。不過其他的方法設計起來就比較麻煩了。比如背景儲存法:在顯示前,先把圖形所涉及區域的背景儲存下來。擦除時,就把儲存的背景再顯示出來。」考慮到木鴻飛還沒有學習相關函式,哥哥親自操刀,對程式進行了一些修改,於是天馬終於以自己本來的顏色飛躍星空了。

「哥哥,這個方式設計起來好像比較麻煩,加了好多**。」木鴻飛已經初步具備了分析設計方法的思維了。

「的確比較麻煩,而且儲存背景也是需要記憶體的。當然,可以採用背景重新整理的方法解決這個問題,。」哥哥又提出一種方法。

「背景重新整理法,難道每次都重新重新整理,也就是全面畫一次背景影象。」木鴻飛自動忽略不懂的「記憶體」,主動思考新方法。

「沒錯,每次擦除時,都把重新畫一次背景,這樣做即能擦除原圖形,又能復原背景,一舉兩得,而且實現起來相當簡單。不過每次重畫背景時都特別費時,每動一步,就看到螢幕閃爍一次,給人一種卡機的感覺。」哥哥詳細的分析。

「有解決方案嗎?」木鴻飛知道哥哥必有下文。

「有,可以採用多頁面顯示法。乙個螢幕就是乙個頁面,我們呼叫各種畫圖函式,一般都是直接畫在螢幕頁面上,比如你呼叫line函式,螢幕上馬上就會顯示一條線。但是也可以不馬上顯示,比如準備一張白紙,所有的畫圖函式都畫在白紙上,當然白紙藏起來不顯示到螢幕上的,上面畫的圖形你都看不到,直到畫圖完畢,再把白紙的內容顯示到螢幕上。這種白紙就是頁面,我們可以在顯示乙個頁面的同時,畫另乙個頁面,畫好後顯示另乙個頁面而同時畫前乙個頁面,如此迴圈。」哥哥說道。

「你還沒有正式學習計算機,有些情況可能還不太了解。」哥哥解釋道:「有時候直接在螢幕上畫圖速度會比較慢。今天的例子簡單,所以看不出來。但是有一些複雜的圖形程式,生成全部的圖形需要比較長的時間,如果直接在螢幕上顯示的話,就會像慢動作一樣很明顯的看到這個過程,比如先畫乙個三角形,再畫乙個矩形等等。而實際上,使用者只在乎最後的結果,所以就需要把這些緩慢的實現步驟掩藏起來。」

「我明白了。實現動畫有背景色重畫法、異或法、背景儲存法、背景重新整理法和多頁面顯示法。」木鴻飛對今天的學習做了乙個總結。

「當然,你也可以找到其他的方法。其實今天告訴你動畫的這麼多種實現方法,並不是教會你做動畫,那還太早了點。目的只是告訴你,電腦程式的設計方法多種多樣,每種方法都有自己的優缺點,都有自己適用範圍。所以在設計程式時,一定要考慮各種方法,並從中選出最適合的來。不要以為這樣很多餘,也不要以為浪費了其他的設計方法,這個程式不適合,也許下乙個程式剛好適合也不一定。有一句可能現在你還不能理解:演算法沒有好壞之分,只有適合和不適合的區別。」

木鴻飛度過了非常有意義的一天,他在展示自身計算機才能的同時也隱隱觸及了計算機的博大精深,僅僅乙個動畫就牽涉若干的方法,而這還只是冰山一角。雖然不能立刻學會這些的知識,雖然不能馬上消化這些的思想,但木鴻飛越發喜歡上計算機,今天他對計算機還只是懵懵懂懂,但是明天他一定能掌握計算機,因為木鴻飛就是為計算機而生。

ps :動畫演示程式,五角星飛躍地球,未使用圖形加速,有點閃。

/attachment/201010/653596_1287643414.rar

計算機達人成長之路(1)

引子 1979 年,那是乙個春天,有乙個老人,在祖國的南海邊划了乙個圈 看來,79 年對祖國來說是乙個不平凡的年份,同樣,1979 年對木鴻飛來說更加不同尋常,因為這一年他出生了。雖然常常聽說歷史的年輪因為某某人而滾滾向前,但中國十多億人口,木鴻飛應該不是有幸穿越成觸動歷史年輪的主人公。同時歷史的年...

計算機達人成長之路目錄

計算機達人成長之路 第一部分 十五與君初相識 第1章 一石激起千層浪 第2章 誘拐無知少年 第3章 高老師 第4章 千萬被感染計算機病毒 第5章 千呼萬喚始出來 第6章 第一次親密接觸 第7章 愛你愛到腿發軟 第二部分 金風玉露一相逢 第1章 從希望中尋找失望 第2章 我只是略懂,略懂 第3章 六天...

開學前夕 計算機達人成長之路(30)

木鴻飛在 xt大學的日子,不只有程式設計,還有激情蓬勃的生活。比如當太陽肆虐著大地 大家都午休的時候,總有幾個大學生模樣的人,光著膀子,流淌著汗水,在籃球場上奔跑,一遍又一遍的投籃。無論何時,籃球場永不休眠。籃球從他們手中飛出,撞擊籃板,然後跌落到地上,永不休止的發出 嘭嘭 的聲響,撞擊北青樓裡午休...