2019第17週上課-06161196宋丹華

第17週課程內容:

A.期末作品展示

B.選票 / 加分 / 心得

C.學期回顧

D.Q & A

1.打分數+寫心得跟回饋~

2.期末作品介紹+影片連結:

期末作品介紹--->

(1)作品簡介:
      雖然我的機器人跳舞沒有在音樂的節拍上面!!不過，我有盡量跟著拍子動。
我選的音樂是---高爾宣[沒了你]想選這首歌的動機為，不僅歌詞很貼近生活，也蠻有律動感的~

(2)程式操簡介:
      這個期末作品，需要用到我們14週交的機器人作業來當基礎。可是因為我14週的機器人模型，打光沒有打好所以顏色出不來!!我選擇期末作品重做!!

      我先把模型匯進去glut的專案裡面，因為顏色上還是有跑掉，所以有請老師幫我調一下!!接下來是匯入音樂檔案，確定模型跟音樂是同步的~

      後來就是比較繁雜的寫檔跟讀檔。把動作的檔案利用w鍵寫出來、再用r鍵讀進去、最後用p/t鍵來播放檔案!!!

      最後把動作串連一起，變成一個完整會跳舞的機器人了~

(3)回饋心得:
       起初其實很想放棄這個做作品!!因為我是重新開始做，花了很多時間跟精神~

       還記得做的第一天晚上，我熬夜到4點多，可是半個東西都沒有匯進去專案裡面。

       心情上真的受到很大的挫折!!但是覺得還是不能放棄，都花時間重新建模了。

       應該要好好完成到最後~隔天有問一下班上比較厲害的同學，問他看看還記不記得。

       怎麼把模型匯進去不會有問題。然後，就跑去問老師打光的問題~~~

       接下來就一步一步地完成，匯音樂、寫檔讀檔、連續動作等等，總共花了一個禮拜的時間好不容易完成的那刻，內心真的很激動哈哈哈 覺得很不真實，自己有辦法完成這項作業。

       其實對老師真的很不好意思，因為我理解上很慢，常常看不懂老師寫的程式是甚麼意思?

       然後就會一直問老師，占用到老師的休息時間跟吃飯時間!!!老師很抱歉啦~

       不過，被老師教過真的懂了很多。也比較了解自己下一步該怎麼做囉~

       謝謝老師給我們這個機會做這個做作品，可能出來的樣子不是很美!! 但至少知道怎麼做了才比較重要。 謝謝老師對我的幫忙^_^


影片連結--->
    https://youtu.be/a6QmFvarcD0

2019第16週上課-06161196宋丹華

第16週課程內容:

A.作業:Q & A

B.複習:貼圖

C.複習:打光

D.複習:模型

E.期末作品

1.第一節複習貼圖如何貼上:
(~第一版~)

#include <opencv/highgui.h> ///for cvCvtColor()

#include <opencv/cv.h>

#include <GL/glut.h> ///3D glut

#include <stdio.h>

float angle=0; ///自動轉很帥

GLUquadric * quad;

void display()

{   glEnable(GL_DEPTH_TEST); ///要啟動 Detph Test 深度值的測試,3D顯示才正確

    glClear(GL_COLOR_BUFFER_BIT  | GL_DEPTH_BUFFER_BIT);

    glPushMatrix();///自動轉很帥

        glRotatef(90, 1,0,0);

        glRotatef(angle, 0,0,1);///自動轉很帥

        gluQuadricTexture(quad, 1);

        gluSphere(quad, 0.5, 30, 30);///glutSolidTeapot(0.3);

    glPopMatrix();///自動轉很帥

    glFlush();

    angle+=1;///自動轉很帥

}

void myInit()

{

    quad = gluNewQuadric();

    IplImage * img = cvLoadImage("marvel.jpg"); ///OpenCV讀圖
    cvCvtColor(img,img, CV_BGR2RGB); ///OpenCV轉色彩 (需要cv.h)

    glEnable(GL_TEXTURE_2D); ///1. 開啟貼圖功能

    GLuint id; ///準備一個 unsigned int 整數, 叫 貼圖ID

    glGenTextures(1, &id); /// 產生Generate 貼圖ID

    glBindTexture(GL_TEXTURE_2D, id); ///綁定bind 貼圖ID

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖T, 就重覆貼圖

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT); /// 貼圖參數, 超過包裝的範圖S, 就重覆貼圖

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); /// 貼圖參數, 放大時的內插, 用最近點

    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); /// 貼圖參數, 縮小時的內插, 用最近點

    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, img->width, img->height, 0, GL_RGB, GL_UNSIGNED_BYTE, img->imageData);
}   ///最後一行最難/最重要, 所貼圖影像的資料都設定好

void timer(int t)

{/// 1000 msec   50fps:20msec

    glutTimerFunc(20, timer, 0);

    //printf("timer now\n");

    glutPostRedisplay();

}

int main(int argc, char**argv)

{   glutInit(&argc, argv);

    glutCreateWindow("3D");

    glutDisplayFunc(display); ///顯示

    //glutIdleFunc(display);///自動轉很帥 (閒閒沒事幹, 就重畫)

    glutTimerFunc(0, timer, 0);

    myInit(); ///我的 init 初始化 把貼圖準備好 前面OpenCV 2行, 後面 OpenGL 9行

    glutMainLoop();

}

2.第二節複習貼圖如何貼上:
(~第二版~)

#include <GL/glut.h>
#include <opencv/highgui.h> ///OpenCV High GUI讀圖 ///貼圖需要它
#include <opencv/cv.h> ///OpenCV cvCvtColor() to convert color///貼圖需要它
///程式碼是對的, 但是沒有設定好include, lib, bin


GLuint id1, id2, id3;///NOW2 ///貼圖需要它
float a=0;


void display()
{
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    glBindTexture(GL_TEXTURE_2D, id1);///id1 for background ///貼圖需要它
    glBegin(GL_POLYGON); ///貼圖需要它
        glTexCoord2f(0, 0); glVertex3f(-1, +1, 0); ///貼圖需要它
        glTexCoord2f(0, 1); glVertex3f(-1, -1, 0); ///貼圖需要它
        glTexCoord2f(1, 1); glVertex3f(+1, -1, 0); ///貼圖需要它
        glTexCoord2f(1, 0); glVertex3f(+1, +1, 0); ///貼圖需要它
    glEnd();///貼圖需要它

    glBindTexture(GL_TEXTURE_2D, id3);///id3 for rotating square
    glPushMatrix();
        glTranslatef(0.5, 0.5, 0);
        glRotatef(a++, 0, 0, 1);
        glScalef(0.3, 0.3, 0.3);
        glBegin(GL_POLYGON);
            glTexCoord2f(0, 0); glVertex3f(-1, +1, 0);
            glTexCoord2f(0, 1); glVertex3f(-1, -1, 0);
            glTexCoord2f(1, 1); glVertex3f(+1, -1, 0);
            glTexCoord2f(1, 0); glVertex3f(+1, +1, 0);
        glEnd();
    glPopMatrix();

    glBindTexture(GL_TEXTURE_2D, id2);///id2 for teapot
    glutSolidTeapot( 0.3 );
    glutSwapBuffers();
}


///void myInit()
GLuint myTexture(char * filename) ///貼圖需要它
{
    IplImage * img = cvLoadImage(filename); ///NOW OpenCV ///貼圖需要它
    cvCvtColor(img, img, CV_BGR2RGB);///convert color ///NOW OpenCV ///貼圖需要它

    GLuint id; ///貼圖需要它
    glEnable(GL_TEXTURE_2D); ///貼圖需要它
    glGenTextures(1, &id ); ///貼圖需要它
    glBindTexture(GL_TEXTURE_2D, id); ///貼圖需要它
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT); ///貼圖需要它
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT); ///貼圖需要它
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); ///貼圖需要它
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); ///貼圖需要它
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, img->width, img->height, 0, GL_RGB, GL_UNSIGNED_BYTE, img->imageData); ///貼圖需要它
    return id;///貼圖需要它
}


int main(int argc, char **argv)
{
    ///IplImage * img = cvLoadImage("marvel.jpg");
    ///cvShowImage("opencv", img);
    ///cvWaitKey(0);///等你按按鍵
    glutInit(&argc, argv);
    glutInitDisplayMode(GLUT_DOUBLE |GLUT_DEPTH);
    glutCreateWindow("GLUT");///之後
    ///建好GLUT視窗,可以開始準備 3D 貼圖 (要在create...MainLoop才能建貼圖)
    id1 = myTexture("marvel.jpg"); ///myInit();///我們的貼圖在這裡 ///貼圖需要它
    id2 = myTexture("teapot.jpg");
    id3 = myTexture("square.jpg");

    glutDisplayFunc(display);
    glutIdleFunc(display);

    glutMainLoop();///之前

}


3.第三節打光注意事項:
(~模型~)

#include <GL/glut.h>
#include <opencv/highgui.h> ///OpenCV High GUI讀圖 ///貼圖需要它
#include <opencv/cv.h> ///OpenCV cvCvtColor() to convert color///貼圖需要它
///程式碼是對的, 但是沒有設定好include, lib, bin


GLuint id1, id2, id3;///NOW2 ///貼圖需要它
float a=0;
#include "glm.h"///呼叫外掛 ///glm需要它


GLMmodel * pmodel=NULL;///準備指標 ///glm需要它
GLMmodel * pmodel2=NULL;///準備指標 ///glm需要它
GLMmodel * pmodel3=NULL;///準備指標 ///glm需要它
GLMmodel * pmodel4=NULL;///準備指標 ///glm需要它

void display()
{
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    glEnable(GL_TEXTURE_2D);
    glBindTexture(GL_TEXTURE_2D, id1);///id1 for background ///貼圖需要它
    glBegin(GL_POLYGON); ///貼圖需要它
        glTexCoord2f(0, 0); glVertex3f(-1, +1, -1); ///貼圖需要它
        glTexCoord2f(0, 1); glVertex3f(-1, -1, -1); ///貼圖需要它
        glTexCoord2f(1, 1); glVertex3f(+1, -1, -1); ///貼圖需要它
        glTexCoord2f(1, 0); glVertex3f(+1, +1, -1); ///貼圖需要它
    glEnd();///貼圖需要它

    if (!pmodel) { ///glm需要它
        pmodel = glmReadOBJ("body.obj"); ///glm需要它
        if (!pmodel) exit(0); ///glm需要它
        ///glmUnitize(pmodel); ///glm需要它
        glmFacetNormals(pmodel); ///glm需要它
        glmVertexNormals(pmodel, 90.0); ///glm需要它
    }

    glDisable(GL_TEXTURE_2D);
    glPushMatrix();
        glRotatef(a++, 0,1,0);
        glScalef(0.2, 0.2, 0.2);
        glmDraw(pmodel, GLM_SMOOTH | GLM_MATERIAL);
    glPopMatrix();

    if (!pmodel2) { ///glm需要它
        pmodel2 = glmReadOBJ("head.obj"); ///glm需要它
        if (!pmodel2) exit(0); ///glm需要它
        ///glmUnitize(pmodel2); ///glm需要它
        glmFacetNormals(pmodel2); ///glm需要它
        glmVertexNormals(pmodel2, 90.0); ///glm需要它
    }

    glDisable(GL_TEXTURE_2D);
    glPushMatrix();
        glRotatef(a, 0,1,0);
        glScalef(0.2, 0.2, 0.2);
        glmDraw(pmodel2, GLM_SMOOTH | GLM_MATERIAL);
    glPopMatrix();

    glutSwapBuffers();
}
///void myInit()


GLuint myTexture(char * filename) ///貼圖需要它
{
    IplImage * img = cvLoadImage(filename); ///NOW OpenCV ///貼圖需要它
    cvCvtColor(img, img, CV_BGR2RGB);///convert color ///NOW OpenCV ///貼圖需要它

    GLuint id; ///貼圖需要它
    glEnable(GL_TEXTURE_2D); ///貼圖需要它
    glGenTextures(1, &id ); ///貼圖需要它
    glBindTexture(GL_TEXTURE_2D, id); ///貼圖需要它
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT); ///貼圖需要它
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT); ///貼圖需要它
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); ///貼圖需要它
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); ///貼圖需要它
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, img->width, img->height, 0, GL_RGB, GL_UNSIGNED_BYTE, img->imageData); ///貼圖需要它
    return id;///貼圖需要它
}


const GLfloat light_ambient[]  = { 0.0f, 0.0f, 0.0f, 1.0f }; ///glm需要它
const GLfloat light_diffuse[]  = { 1.0f, 1.0f, 1.0f, 1.0f }; ///glm需要它
const GLfloat light_specular[] = { 1.0f, 1.0f, 1.0f, 1.0f }; ///glm需要它
const GLfloat light_position[] = { 2.0f, 5.0f, 5.0f, 0.0f }; ///glm需要它
int main(int argc, char **argv)
{
    ///IplImage * img = cvLoadImage("marvel.jpg");
    ///cvShowImage("opencv", img);
    ///cvWaitKey(0);///等你按按鍵
    glutInit(&argc, argv);
    glutInitDisplayMode(GLUT_DOUBLE |GLUT_DEPTH);
    glutCreateWindow("GLUT");///之後
    ///建好GLUT視窗,可以開始準備 3D 貼圖 (要在create...MainLoop才能建貼圖)
    id1 = myTexture("marvel.jpg"); ///myInit();///我們的貼圖在這裡 ///貼圖需要它
    id2 = myTexture("teapot.jpg");
    id3 = myTexture("square.jpg");

    glutDisplayFunc(display);
    glutIdleFunc(display);

    glEnable(GL_DEPTH_TEST);    ///glm需要它

    glEnable(GL_LIGHT0);  ///glm需要它
    glEnable(GL_NORMALIZE); ///glm需要它
    glEnable(GL_COLOR_MATERIAL); ///glm需要它
    glEnable(GL_LIGHTING); ///glm需要它

    glLightfv(GL_LIGHT0, GL_AMBIENT,  light_ambient); ///glm需要它
    glLightfv(GL_LIGHT0, GL_DIFFUSE,  light_diffuse); ///glm需要它
    glLightfv(GL_LIGHT0, GL_SPECULAR, light_specular); ///glm需要它
    glLightfv(GL_LIGHT0, GL_POSITION, light_position); ///glm需要它

    glMatrixMode(GL_PROJECTION); ///投影矩陣相關 戴好我們的正確度數的眼睛
    glLoadIdentity();  ///投影矩陣相關 戴好我們的正確度數的眼睛
    glOrtho(-1,+1, -1,+1, -100,+100); ///投影矩陣相關 戴好我們的正確度數的眼睛
    glMatrixMode(GL_MODELVIEW);  ///投影矩陣相關 切換回我們正確的矩陣

    glutMainLoop();///之前
}

2019第15週上課-06161196宋丹華

第15週課程內容:

A.主題:攝影機 / 運鏡

B.主題:投影 / 矩陣

C.複習:位置移動 V.S. 轉動

D.複習:背景貼圖

E.期末作品

1.下載資料:
(data+win32+glut32.dll)

2.把(data+glut32.dll)丟進去windows:

3.攝影機視角:
/*程式碼:glLookAt(eyeX,eyeY,eyeZ,
                                centerX,centerY,centerZ
                                upX,upY,upZ);
*/

4.下載source資料，再把別人的專案件到code:
(先把glm.cpp+glm.h+projection.c加到自己的專案資料夾)
(再複製data到freeglut的bin資料夾)

5.加進去自己的專案:

6.自己畫出另一個模型:

7.攝影機視角加進來 讓模型可以選轉:

(選轉視角):

8.讓模型的顏色可以出來 然後繼續旋轉:

(有顏色旋轉視角):

9.改變視野位置(更高了):

2019第14週上課-06161196宋丹華

第14週課程內容:

A.主題:計時器 /Timer

B.主題:內插公式

C.主題:動畫

D.期末作品

E.上周 

1.先複習主程式的部分:

2.加入一個簡單的音檔:

(讓聲音可以一直循環播放)

(音檔是放屁聲^_^)

3.用Timer來計時:

(1000ms= 1sec, 30ms= 1/33sec, 33fps)--->公式

4.介紹內插公式:

5.茶壺往橫向跑動:

/*茶壺連續跑動的圖*/

2019第13週上課-06161196宋丹華

第13週課程內容:

A.主題:檔案

B.主題:關節 / 擺動作

C.主題:複習

D.作業:機器人擺動作

1.從第一週上課內容到現在第13週 再複習一次:

(先讀取檔案)

2.讀進資料後的檔案可以從資料夾裡面找到:

3.讀取之前教的角度:

(可以讓機器人動關節的)

4.複習關節轉動:

(先用茶壺複製一個到右邊)

5.複習關節轉動:

(接下來做左邊關節的部分)

6.複習關節轉動:

(總結 把所有的關節做出來)

7.變化:利用按R鍵 可以開始轉動。

2019第12週上課-06161196宋丹華

第12週課程內容:

A.主題:鍵盤

B.主題:聲音 / 音樂

C.複習:階層T-R-T骨架

D.作業:能操控的機器人

1.下載音樂檔案:

2.下載完之後，要用程式碼把檔案叫出來:
(用console檔案開啟)

3.用程式碼打開音樂檔案:

4.開新的專案(glut檔案):

5.用glut的檔案 把剛剛做好的音樂程式加進來:

6.改編一下 多增加5個音樂檔案:

(用數字鍵12345去控制音樂的播放與否)

7.可以自己錄音，把錄的檔案加到程式碼裡面:

2019第11週上課-06161196宋丹華

第11週課程內容:

A.小考:T-R-T  轉動

B.主題:階層轉動 / 骨架

C.主題:鍵盤按鍵

1.下載freeglut:

2.寫上次教的T-R-T程式:

3.利用上次教的，再加深一點東西:

(變成一個手臂的樣子，可以旋轉!)

4.幾張茶壺手臂變換圖:

5.矯正旋轉的位置，讓手臂旋轉看起來比較自然:

6.旋轉變化圖:

7.選擇數字鍵(按1or2or3or4)來控制旋轉:

8.結合所有if的程式: