手繪vs碼繪，你覺(jué)得呢

碼繪——顧名思義就是用代碼畫(huà)畫(huà)，第一次接觸到碼繪的時(shí)候還是在MFC上用MoveTo(),LineTo()艱辛地繪畫(huà)，十分地心酸。
這次幸運(yùn)地遇上了P5.js, 繪畫(huà)起來(lái)較之之前方便很多

說(shuō)到P5.js,官網(wǎng)上有十分詳細(xì)的介紹P5.js官網(wǎng)，在這里不多說(shuō)了。下載好相關(guān)的庫(kù)在html界面引用就好

當(dāng)然，你也可以直接在網(wǎng)上進(jìn)行編輯
網(wǎng)址1
網(wǎng)址2
在這里,我用的代碼編輯器是vscode
首先建一個(gè)js文件 并在網(wǎng)頁(yè)中進(jìn)行引用
那我們開(kāi)始第一幅碼繪作品吧 GO!!!
1.創(chuàng)建你想要的畫(huà)布大小
function setup() { createCanvas(850, 800); }
2.在function draw(){}函數(shù)中進(jìn)行繪畫(huà)

設(shè)置背景顏色

background(129,193,252);

設(shè)置線寬strokeWeight(3);

//臉fill(210,145,14);rect(350, 150, 200, 180); fill(0);//耳朵drawEar();//上臉ellipse(450,230,130,70);fill(255);//眼睛drawEye1(420);fill(0);drawEye2(430);fill(255);drawEye3(435);

//身體fill(210,145,14);quad(450,330,370,410,450,490,530,410);//鼻子fill(0);drawNose(56);fill(255);drawNose(20);//腳fill(117,111,108);drawFoot();

//尾巴fill(210,145,14);triangle(370,410,270,430,300,480);arc(285,455,58,58,HALF_PI/3*2,HALF_PI/3*8);//花紋fill(255);line(420,494,424,488);line(426,494,430,488);line(480,488,484,494);line(474,488,478,494);strokeWeight(10);line(266,434,296,480);line(296,428,314,460);line(326,422,334,440);strokeWeight(0);fill(0,255,0);for(var i=0;i<=75;i++)grass(i*10+30);fill(255);for(var i=0;i<=6;i++)cloud(i*150);

咳咳，畫(huà)出來(lái)的大致樣子就是這樣，小老鼠加小浣熊的結(jié)合體，手繪。。見(jiàn)笑了。。。

一些畫(huà)小部件的具體函數(shù)代碼如下

function drawEar(){arc(350, 150, 100, 100, HALF_PI,HALF_PI*4);arc(550, 150, 100, 100, -PI, HALF_PI);}function drawEye1(x){ellipse(x,230,56,56);ellipse(x+60,230,56,56);}function drawEye2(x) {ellipse(x,230,24,24);ellipse(x+40,230,24,24);}function drawEye3(x){ellipse(x,230,10,10);ellipse(x+30,230,10,10);}function drawNose(x){ellipse(450,330,x,x);}function drawFoot(){ellipse(430,490,42,15);ellipse(470,490,42,15);}function grass(x){triangle(25+x,510,x,580,50+x,580);}function cloud(x){ellipse(50+x,50,50,30);ellipse(75+x,50,50,30);}

碼繪出來(lái)的樣子是這樣滴，我不管我覺(jué)得就是很可愛(ài)

碼繪和手繪根源還是一樣的，代碼畫(huà)其實(shí)也是在紙上想好所要畫(huà)什么圖形，在技術(shù)層面上講，碼繪需要將紙上的畫(huà)的點(diǎn)轉(zhuǎn)換為坐標(biāo)，用各種形狀函數(shù)進(jìn)行繪制，而手繪除了靈感之外，比較隨心所欲。代碼理性占的比重較大，更加嚴(yán)謹(jǐn)
本人沒(méi)有什么對(duì)兩者其一的偏好，認(rèn)為各有各的好處，完成后的成就感也是不同的，代碼給我的成就感更大。

總結(jié)

以上是生活随笔為你收集整理的手绘vs码绘的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。