征集網銳志網絡淘途找素材上91
創意在線首頁
平面設計交互設計CG動漫工業設計建筑環境數碼影像創意搜
 首頁大賽征集資訊教程畫廊訪談作品集創企同盟設計招聘人才專區競賽臺專題論吧 找素材看酷站設計網址庫
教程網 Illustrator、Photoshop、CoreaDreaw、AI教程、PS教程
當前位置:首頁 > 教程 > Flash > 正文
Flash AS曲線的繪制
作者: 來源:52design.com 發表時間:2007-8-29 16:56:07 瀏覽:

曲線的繪制原理有兩種一種是由無數多或有限多的,即:lineTo繪制的曲線。
Flash AS曲線的繪制

另一種是由函數計算并由曲線函數curveTo計算而成的。
Flash AS曲線的繪制
重點之重是講第二點,最簡單的曲線繪制代碼:

this.lineStyle(1);
this.moveTo(50,50);
this.curveTo(100,100,200,100);

將上面的這三行代碼直接放入一個空的flash里面,生成就可以看到一段曲線,這是怎么作出來的呢?
Flash AS曲線的繪制
但是我們平時用到的如畫出美麗的曲線很多都是對稱并且是很平滑的,這個as能辦到么? 答案是能。現在我們晉級來專注以下幾個問題:曲線、對稱、平滑。

曲線:
上面已經講的很清楚了,但是為什么還要講呢?主要是用as來控制曲線一定要以曲線的原理來為曲線分段,從而得到相應的節點。如上圖,你看到的曲線和下圖被分割的一樣么,也許用鋼筆[繪畫軟件里面的工具]繪制是同一條線,但是用as來繪制的話就是這樣的。上面的曲線是兩個點組成的一條曲線,下面的是由三個點組成的兩條曲線,分清這些才能繼續深入研究as曲線的構造[不過也有例外,即使平滑的單條曲線也可由多條曲線線段組成,不過這樣做沒有太大意義]。***[以曲線的兩個點作射線可交在一起,此點為flash函數中控制曲線的點的位置]***

平滑:


Flash AS曲線的繪制


什么是平滑呢?在曲線與曲線之間過渡不僵硬就代表平滑了,比如圓、橢圓等,平滑能夠使效果看上去很舒服。最平滑的方法是這樣的,最簡單的3點ABC,當AB的曲線固定位置后c曲線可任意 但是c曲線因為平滑會受到某些限制,即前面曲線的控制點要和B點以及BC所繪制的曲線的控制點要在一條直線上,如下圖:


Flash AS曲線的繪制


p2可以在p1和B的延長線上移動,但是不能移動到B左側,否則曲線無法平滑。

對稱:
例如一個圓,要做到用as來繪制,是十分難的,最上面提到的最簡單的代碼,如果你用手動嘗試來一次次試驗,猶如像愛迪生一樣屢屢失敗,無法達到預期的效果,在這個問題之前應該看一下例圖:


Flash AS曲線的繪制


我們會發現曲線為對稱時,曲線的控制點也在兩端點連線的垂直平分線上,那么我們就來討論如何得到以中點垂直直線所得到的線上的任意點吧! 

垂直平分線上的任意點:
對于幾何,大家可以很簡單的得到這個問題的答案 但是大家想想看,如果對于任意角度的線段由as來得到顯然有點難度。畢竟是編程,沒有什么難不倒大家的,我們找找材料吧。發現了!flash8里面內置了一個類point,其實這個類很簡單,如果大家只是為了沖著point類而生成flash8的文件,那就太浪費了,因為這個類完全可以自己寫,我在最下面把它整理上來,幫助大家使用[這個類我結合了vect2d和point兩個方法總結到一起,大家別嫌代碼多啊 呵呵]。中點那個方法是point.verticalPoint(點1,點2,與中點的距離[可以為正/負])。這個函數的原理我不知道是不是最方便的。在此把思路告訴大家,取任意兩點AB,得到其中點O,將AB點分別復制為A’B’點并讓此克隆點[clone方法],以原來的點旋轉[即A’相對B旋轉,B’相對A點旋轉],得出此新的兩點,進一步又得到兩個新點的中點O’,如圖:


Flash AS曲線的繪制


再在OO’上取相對O定長的點很容易。再回到剛才的問題上來就很容易解決對稱曲線的問題了。曲線真是一種很奇妙的東西,com_zszen是我的自定義類包[pakage適合flash7以上版本],里面包括了一個math類和一個point類,你可以通過研究我的代碼來達到學習的目的。

還有就是我上面忘了提到一點:
      關于閉合以及非閉合平滑過渡曲線的繪制,顯然你通過找點是無法實現的,或是說你無從下手,也就是說給你兩個以上的點,他們的曲線控制點是任意的,也就是說你第一個點決定了你的去曲線的行走方式.所以這樣顯然不能得到我們想要的曲線。所以我認為應該從曲線的控制點考慮,也就是說曲線的控制點如果都已知,那么就ok了。
      我的方法是建立一個方程 以p1=curveX(target,p1,p2,p3),將追蹤得到新的控制點,當然第一次運行不會繪制上來,也就是說運行此程序還存在效率問題,就是n個點的閉合曲線要運行n+1次,n個點的非閉合曲線要運行n次,而非閉合的起始點就成為了無法繪出的曲線位置,我的這個程序對于精確的曲線運算,沒有足夠的重視,如果說實現一些效果,應當是可以的,[其中用過聯想廣告的噪音聲波圖]。     

static function curvePlus(path:MovieClip, a1, control1, control2, doNoDraw:Boolean) {
                path.moveTo(a1.x, a1.y);
                var c1 = new point(control1.x, control1.y);
                var c2 = new point(control2.x, control2.y);
                var m = point.interpolate(c1, c2, 0.5);
                if (doNoDraw == true) {
                        return (m);
                }
                path.curveTo(c1.x, c1.y, m.x, m.y);
                //curveTo(c2.x, c2.y, a2.x, a2.y);  
                return (m);
        }

在線編輯:morion
本文鏈接:


推薦閱讀:
·2019第五屆“包豪斯獎”國際設計大賽 征稿公告
·第十三屆《中國大學生美術作品年鑒》第二批征稿
·2019第五屆“包豪斯獎”國際設計大賽 征稿公告
·青春唯美插畫培訓網絡遠程班正在招生
·2019第十一屆中國高校美術作品學年展征稿章程
·2019第五屆“包豪斯獎”國際設計大賽 征稿公告
·2019第五屆“包豪斯獎”國際設計大賽 征集公告
·2019第十三屆“創意中國”設計大獎獲獎名單揭曉
免責聲明:本站刊載此文不代表同意其說法或描述,僅為提供更多信息。對本文有異議,請聯絡本站!
轉載要求:文章作者及來源信息必需保留。轉載之圖片、文件請不要盜鏈本站地址,且不準打上各自站點的水印!

近期推薦報道 返回首頁更多精彩等著你!

Photoshop| Photoshop快速調出情侶圖片柔美的插畫藝術| 絕望的小熊—美國插畫師Luke
網頁設計| 波蘭Tiquet網站設計作品欣賞插畫藝術| Nanami Cowdroy靈動黑白插畫
Photoshop| Photoshop調出美女圖片絢麗的橙紅HTML/CSS| 實現DIV透明而里面的文字不透明
平面設計| 世界杯之平面廣告欣賞插畫藝術| Alberto Cerrite&ntil
平面設計| Havaianas人字拖最新平面廣告系列網頁設計| 英國madefavourite簡潔細膩型
韓國站點 素材資源 藝術攝影 游戲娛樂 影視網站 建筑家居 FLASH站 旅游購物 明星網站 個性展示 網站教學 工 作 室 學校教育
設計門戶 優秀企業 時尚品牌 象素站點 數碼通信 設計公司 汽車網站 國外優秀 兒童網站 文化藝術 體育運動 美容健身 食品飲料
網站名稱:whaternet
網站地址:http://whaternet.com/
加入時間:2014-8-5 13:59:20
網站名稱:mnnaite
網站地址:http://www.mnnaite.com/static/
加入時間:2014-8-5 13:58:07
網站名稱:tijuanaflats
網站地址:http://tijuanaflats.com/
加入時間:2014-8-5 13:55:32
網站名稱:digital
網站地址:http://production-digital.com/
加入時間:2014-8-5 13:54:45
網站名稱:deutschesee
網站地址:http://www.deutschesee.de/
加入時間:2014-8-5 13:51:54
網站名稱:kennedy
網站地址:http://www.kennedyandoswald.com/
加入時間:2014-8-5 13:50:57
關于本站 | 聯系方式 | 商業服務 | 合作伙伴 | 站點地圖 | 免責聲明 | 版權聲明 | 在線投稿  
 
宝石探秘财富加倍电子
策略盈配资 黑龙江6+1 喜乐彩 吉林快三 体彩p5 4场进球 陕西11选5 股票融资融券开户条件 北单 黑龙江十一选五 北京时时彩 迷你电子记分牌led体育比分 明道配资 股票配资流程 刮刮乐 黑龙江十一选五