canvas學習心得之路徑

      剛開始接觸canvas的路徑時,有些迷糊。

      由於我們正常生活的繪畫邏輯,或者由於java的GUI編程的影響,我們總是以爲繪畫就是有紙有筆,直接畫出圖形就可以了。

      這紙筆也就是編程環境,這是必不可少的,一般來說,我們就可以直接繪圖了,但在canvas的繪圖中,雖然也能直接繪製一些圖,但是更多的圖是通過路徑來繪製的。剛開始接觸的時候,有好幾次都是設置好路徑,運行程序,結果界面空白一片,就是沒有圖出來。經過一些研究,終於對路徑有了一點體會。

      原來canvas中的路徑,就是設置好圖畫的形狀,但並沒有顯示出來。舉個例子,在電視劇中我們經常看到一些人得到了一張藏寶圖,但是圖上什麼東西都看不到。其實上面是有圖的,只不過是被隱藏起來的,只要滴點血或滴點墨水等等就能讓圖顯示出來,這隱藏的圖就相當於路徑,而在canvas中要使路徑顯示出來,則要用到fill()和stroke()這兩個方法,其中,stroke是把圖勾勒出來,fill則是把圖填充出來。

      另外,我們再來說說關於路徑的另外兩個重要的方法,beginPath()和closePath(),beginPath是用來重置路徑的,如果沒用這個方法會發生什麼事呢,比如說,我們先畫一條直線,沒用這個方法,就又畫一個圓,那麼圖上就會有兩條直線一個圓(其中一條直線覆蓋在另一條直線上,因爲他們的路徑時一樣的),如兩次繪畫採用的顏色不一樣,那我們就看不到第一次畫的那條直線了。之所以發生這樣的事,是因爲我們畫完直線的時候,它的路徑還是存在的,這時我們再創建一個圓的路徑,畫布上就有一條直線一個圓的路徑,之前的路徑並沒有被清除掉,而解決這種情況就要用到我們的beginPath();這個方法是用來重置路徑的,也可以理解爲,是用來清除之前的那些路徑的,之後我們再設置路徑,畫布上就只有新創建的路徑了,而closePath(),很多人一看,誒,關閉路徑,那我關了之前的路徑,是不是不用再beginPath()也可以呢,其實呢,這個也坑過我,顧名思義有時真的害人,這個closePath()更準確的說,應該是封閉路徑,比如說,你畫了一個半圓,沒用closePath的話,圖上就只有一條弧線,而用了closePath呢,圖上就有一條弧線加一條直線,這條直線連接弧線的兩個端點,把這個半圓封閉起來。總的來說,closePath就是用來連接路徑的最終點與起點的。

      一般來說,beginPath和closePath是成對出現的,我們也可以只用beginPath而不用closePath,但是不可以只用closePath而不用beginPath,也就是說,closePath出現的次數應該少於等於beginPath出現的次數。





 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章