Graphic範例練習
依照滑鼠大小改變圖片尺寸
l 撰寫OF程式碼
1.
開啟empty資料夾(of_v0071_win_cb_release\examples\empty)
2.
在app資料夾下新增一個資料夾,名稱自訂(of_v0071_win_cb_release\apps)
3.
複製emptyExample資料夾到新增的資料夾中
4.
開啟資料夾中的emptyExample.cbp
5.
執行且編譯(F9)
l 從原始範例複製需要的圖片(of_v0071_win_cb_release\examples\graphics\imageLoaderExample\bin\data)
到emptyExample的data資料夾底下(emptyExample\bin\data)
若檔案沒有編譯過,不會產生bin與data資料夾
l 開啟testApp.h
1.
定義一個變數,型態為ofImage,名稱為bikers
l 開啟testApp.cpp,在setup中寫入初始設定
1.
設定背景色為白色
ofBackground(255,255,255);
2.
在bikers中讀取一張圖片
bikers.loadImage("images/bikers.jpg");
3.
若圖片名稱錯誤會出現
4.
讀取後要顯示圖片,在draw中打入
bikers.draw(0,0,mouseX,mouseY);
5.
若要更改色調,使用ofSetColor(R,G,B)
ofSetColor(255,0,0);
讀取圖片練習二
1.
在testApp.h定義ofImage變數,名稱為gear
ofImage gear;
2.
讀取圖片,在setup中寫入
gear.loadImage("images/gears.gif");
3.
顯示圖片,在draw中寫入程式,並把先前的滑鼠控制註解掉
bikers.draw(0,0,bikers.getWidth()/2,bikers.getHeight()/2);
//擺放圖片在0,0的位置,長寬為自己的一半
gear.resize(bikers.getWidth()/2,bikers.getHeight()/2);
//將gear的尺寸縮放跟biker一樣
gear.draw(bikers.getWidth()/2,0);
//擺放圖片在bike旁,y為0
4.
若要使圖片有透明度,讀取的圖片需為具透明屬性的圖片,ex.png
讀取有透明度圖片
1.
在testApp.h中定義ofImage型態的變數transparency
ofImage transparency;
2.
在testApp.cpp中的setup將含有透明圖層的圖片讀取至transparency
transparency.loadImage("images/transparency.png");
3.
在draw中,顯示transparency,因含透明度,需使用ofEnableAlphaBlending()與ofDisableAlpahBlending()
ofEnableAlphaBlending(); //開啟透明圖層效果
float wave =
sin(ofGetElapsedTimef()); //定義一個變數wave,使用sin函數,ofGetElapsedTimef取得程式執行經過時間(浮點數)
transparency.draw(mouseX+(wave*100),mouseY);//transparaency這圖將會跟著滑鼠座標,且做左右幅度為100的來回震盪
ofDisableAlphaBlending(); //關閉透明圖層效果