Processing筆記_week01

概要:第一周的課程最主要是在講環境的選擇與安裝，最後選擇Processing作為我們的

上課軟體，以及一些Processing的環境。

。架設、基本語法。

課堂作業1 CodeBlocks 開 OpenGL專案

CodeBlocks: File-New-Project, OpenGL專案

先第2行，挑選桌面當目錄

再回第1行設定專案名稱

Win+Shift+s 螢幕截圖

在C語言的OpenGL程式，需要設定Windows的視窗，花很多行程式碼，裡面設定WindowProc函式，去處理你的視窗的活動

真的「圖學」的程式。在EnableOpenGL和DisableOpenGL裡，把相關的設定設好。

Q:我們要學的程式碼是什麼呢?

A:80~94行

課堂作業2用Java的OpendGL使用Processing來開發

學校電腦的Win-E開檔案總管下載 有Processing解壓縮的目錄開啟Processing(藍色)

File-Preference設定，把字型放大，比較好寫程式

Processing開啟後->偏好設定->調整字的大小

利用C的OpenGL核心的幾行的例子，算出我們的程式

//week01_2Java_OpenGL_Processing

size(400,400,P3D); //設定好全部的OpenGL

beginShape(TRIANGLES);

fill(255,0,0); vertex(0,200);

fill(0,255,0); vertex(400,0);

fill(0,0,255); vertex(400,400);

endShape();

//Ctrl-S存檔

課堂作業3 在網頁，試著把程式寫出來。從課堂作業2出發

Google:p5js

找到官網 https://p5js.org

左下角 Strat Coding 線上寫程式

https://editor.p5js.org

在function()裡面，塞入剛剛程式的beginShape()….endShape()那幾行再按粉色三角形

課堂作業4想讓它轉動

在藍色的 Processing Ctrl+N 開新的程式

把舊的程式，貼到新視窗，然後改寫

加兩個函式void setup()、void draw()

void setup():在程式碼剛開始運行時會執行一次

void draw():在程式終止前會不斷執行，像是迴圈一樣

課堂作業5 三角形繞圈圈

新增background()、修改背景為黑色 translate()、移動的旋轉座標 並更改三個頂點的位置

課堂作業6 印圖片

印圖片的時候要注意，圖片需要手動拉進Processing視窗裡面，才能正確顯示