AhFatKr的電腦圖學筆記week17

 #week17 

1.期末作品繳交方式

2.期末作品評分方式

3.網友問pop matrix(),push matrix()問題

##step01-1

##step02-2

---老師示範如何完成期末作品---

AhFatKr的電腦圖學筆記week16

 #week16

##step01-1

alpga內插公式: alpha: `0.0~ 1.0`

`angle = alpha*新 + (1-alpha)*舊`

ex.

    alpha: 0 => 舊

    alpha:0.5 =>半新半舊

    alpha: 1=> 新

使用Excel or Google Spreadsheet 來做

#step01-2

用程式試試看 week15_angles_TRT_again拿來改

1.File-New-Project,GLUT,week16_interpolation 內插

2.複製程式,執行,按s會存一行,mouse motion改動作4次,按s存檔

3.原本失敗的結果,按r會讀到動作但不連續,關掉

接下來要改造程式

1.void myInterplate(float alpha)

```

///a

#include<GL/glut.h>

#include<stdio.h>

float angle[20],oldX=0;

int angleID=0;

FILE * fout = NULL, * fin = NULL;

void myWrite(){

    if(fout == NULL) fout = fopen("file.txt","w+");

    for(int i=0;i<20;i++){

            printf("%.1f ",angle[i]);///小黑印出來

            fprintf(fout,"%.1f ",angle[i]);///檔案印出來

    }///這裡老師沒有fclose

    printf("\n");

    fprintf(fout,"\n");

}

float NewAngle[20],OldAngle[20];

void myRead(){

    if( fout != NULL){ fclose(fout); fout=NULL; }

    if( fin == NULL ) fin = fopen("file.txt"," r");

    for(int i=0;i<20;i++){

        OldAngle[i] = NewAngle[i];///原來的新的,變舊

        fscanf(fin,"%f", &NewAngle[i]);

       ///fscanf(fin, "%f",&angle[i]);

    }

    glutPostRedisplay();

}

void myInterpolate(float alpha){

    for(int i=0;i<20;i++){

        angle[i] = alpha * NewAngle[i]+(1-alpha) * OldAngle[i];

    }

}

int t=0;

float alpha=0;

void keyboard(unsigned char key,int x,int y){

    if(key=='p'){///Play

        if(t%30==0)myRead();

        myInterpolate((t%30)/30.0);///介於0.0~1.0

        glutPostRedisplay();

        t++;

    }

    if(key=='s') myWrite();///調好動作才存檔

    if(key=='r') myRead();

    if(key=='1') angleID=1;

    if(key=='2') angleID=2;

    if(key=='3') angleID=3;

}

void mouse(int button,int state,int x,int y){

    oldX=x;

}

void motion(int x,int y){

    angle[angleID] += (x-oldX);

    ///myWrite();

    oldX = x;

    glutPostRedisplay();///請GLUT重畫畫面Re display

}

void display()

{

    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

    glColor3f(1,1,1);///白色的

    glRectf(0.3,0.5,-0.3,-0.5);///四邊形

    glPushMatrix();///右半部

        glTranslatef(0.3,0.4,0);///(3)把手臂掛回身體

        glRotatef(angle[0],0,0,1);///(2)旋轉 對Z軸轉

        glTranslatef(-0.3,-0.4,0);///(1)把手臂的旋轉中心,放中心

        glColor3f(1,0,0);//紅色的

        glRectf(0.3,0.5,0.7,0.3);

        glPushMatrix();

            glTranslatef(0.7,0.4,0);///(3)把手肘掛回剛剛的位置

            glRotatef(angle[1],0,0,1);///(2)旋轉

            glTranslatef(-0.7,-0.4,0);///(1)把手肘旋轉中心,放中心

            glColor3f(0,1,0);///綠色的

            glRectf(0.7,0.5,1.0,0.3);///上手臂

        glPopMatrix();

        glPushMatrix();///左半部

        glTranslatef(-0.3,0.4,0);///(3)把手臂掛回身體

        glRotatef(angle[2],0,0,1);///(2)旋轉 對Z軸轉

        glTranslatef(0.3,-0.4,0);///(1)把手臂的旋轉中心,放中心

        glColor3f(1,0,0);///紅色的

        glRectf(-0.3,0.5,-0.7,0.3);

        glPushMatrix();

            glTranslatef(-0.7,0.4,0);///(3)把手肘掛回剛剛的位置

            glRotatef(angle[3],0,0,1);///(2)旋轉

            glTranslatef(0.7,-0.4,0);///(1)把手肘旋轉中心,放中心

            glColor3f(0,1,0);///綠色的

            glRectf(-0.7,0.5,-1.0,0.3);///上手臂

        glPopMatrix();

    glPopMatrix();

    glutSwapBuffers();

}

int main(int argc, char**argv)

{

    glutInit(&argc,argv);

    glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

    //glutInitWindowSize(600,600);

    glutCreateWindow("week13 rect TRT");

    glutMouseFunc(mouse);

    glutMotionFunc(motion);

    glutKeyboardFunc(keyboard);

    glutDisplayFunc(display);

    glutMainLoop();

}```

##step02-1

接下來讓動畫可以不用按P就自動播放,並讓它變得更流暢只需要加入幾行程式碼就好!

##step02-2

利用課本上的projection來幫助我們理解照相機的運作方式

##step03-1

1.File-Bew-Projec,GLUT,week16_camera_projection_gluLookAt

2.輩分177行範例,要改造裡面的程式

3.aspect ratio 長寬比 ex.1920x1080, 1280x720, 640*480, 16:9, 4:3

```

#include<GL/glut.h>

void reshape(int w,int h){

    float ar = (float) w/(float) h;

    glViewport(0,0,w,h);

    glMatrixMode(GL_PROJECTION);///3D變2D

    glLoadIdentity();

    gluPerspective(60,ar,0.1,100);

    glMatrixMode(GL_MODELVIEW);///3D Model+view

    glLoadIdentity();

    gluLookAt(0,0,3,   ///eye

              0,0,0,   ///center看哪裡

              0,1,0);  ///up向量

}

void display()

{

    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

    glutSolidTeapot(1);

    glutSwapBuffers();

}

int main(int argc, char**argv)

{

    glutInit(&argc,argv);

    glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

    glutCreateWindow("week16 camera");;

    glutDisplayFunc(display);

    glutReshapeFunc(reshape);///範例是用resize

    glutMainLoop();

}

```

AhFatKr的電腦圖學筆記week15

 # week15

PlaySound()更詳細解說

1. 播聲音、播MP3

2. 播放動畫、內插

3. 機器人擺動作、跳舞

```

## Step01-1 PlaySound()解釋

```C

0.File-New-Empty File-week15_playsound.cpp

1.上週#include<mmsystem.h>

2.這週使用#include<windows.h>

3.上週playsound("檔名.wav",NULL,SND_ASYNC);//不等待,不同步

4.這週PlaySound("檔名.wav",NULL,SND_SYNC);//等待,同步

5.setting-compiler setting-linker加入winmm(可以撥聲音)

6.注意工作目錄的位置,將下載下來的聲音檔放在自己檔案存放的位置(記得音樂檔是wav檔)

##Step01-2 PlaySound()更多參數

```C

    File-New-Empty File-week15-2_SND_SYNC_SND_ASYNC

    PlaySound("檔名.wav",NULL,SND_SYNC);=>加上變ASYNC就會不播音樂直接結束

```放在你檔案存放的位置(記得音樂檔是wav檔)

做一些變更

```C

#include <windows.h>

#include <stdio.h>

int main()

{///不等待會快速執行下一行，互動性佳

    PlaySound("07013033.wav",NULL,SND_ASYNC);///背景會先撥放此段音樂

    while(1){

        printf("請輸入數字: ");///邊秀出文字

        int n;

        scanf("%d",&n);

        if(n==1)PlaySound("do.wav",NULL,SND_ASYNC);///ASYNC不等待

        if(n==2)PlaySound("re.wav",NULL,SND_ASYNC);

        if(n==3)PlaySound("mi.wav",NULL,SND_ASYNC);

    }

}

```

## Step02-1 MP3(小/有壓縮) vs WAV(大/原始檔)

>>PlaySound()只能撥最原始的檔案,只要一行

>>MP3比較麻煩,需要打比較多行

SND_ASYNC 不等待會比較快執行到下一行，互動性會比較好

```

#include <windows.h>

#include <stdio.h>

int main()

{

    PlaySound("07071034.wav", NULL, SND_ASYNC);

    while(1){

        printf("請輸入數字:");

        int N;

        scanf("%d",&N);

        if(N==1) PlaySound("do.wav", NULL, SND_ASYNC);

        if(N==2) PlaySound("re.wav", NULL, SND_ASYNC);

        if(N==3) PlaySound("mi.wav", NULL, SND_ASYNC);

    }

}

```

只能播wav檔不能播mp3檔，因為mp3檔被壓縮過，wav檔沒被壓縮過，所以執行程式碼時，如果把壓縮過的mp3檔讓音效卡讀取時就會無法讀取，所以只能用原始大小的wav檔會比較好

##step02-2

今天主要是接續上周的進度，要將動畫相關的動作進行改良。

0. File-New-Project, GLUT專案,week15_angles_TRT_again

1. copy 上周的程式碼,改成 week15並試跑:按'0' '1' '2' '3'換關節,最後按'r'長按,就可慢慢讀入資料

2.發現問題:沒有動畫的樣子!只是拉關節太僵硬了

3.myWrite()會寫一行,myRead()會讀一行

4.不能把myWrite()放motion()

5.把動作對應的關節全部調好後,才存(一行)動作

6.所以在擺動作時,擺好後按's' 存動作

7.執行時,存幾個動作,'r' 可讀入

8.事後在工作執行目錄 file.txt 可以大量copy動作,重複,再重跑程式,動作就可以多起來了

## step03-1

1.機器人擺動作,需要有3D Model (glm.h glm.cpp) (.obj .mtl .jpg ...)

2.把模型切成很多塊 分別讀入

3.TRT的程式,才能轉動

4.keyboard()切換關節,mouse motion

一步步做

1.File-New-Project,GLUT專案 ,week15_hw_gundam_parts.cbp

2.工作執行目錄 working_dir不太好_要改到現在程式的目錄

3.使用NotePad++ 把week15_hw_gundam_parts.cbp 改裡面的working_dir

4.將freeglut.dll複製貼上到程式所在的檔案夾

4.把glm.h glm.cpp和gundam的data目錄,全放在現在要用的檔案目錄

hw4

AhFatKr的電腦圖學筆記week14

 #week15

1.寫檔、讀檔

2.關節、做動畫

3.計時器、glutTimeFunc(時間,timer,參數t)

4.播放聲音

##step01-1

寫檔 File Output

0.File-New-Empty File,

1.fopen()開啟檔案

2.print()=>fprintf()

3.fclose()關閉檔案

##step01-2

讀檔File Input

0.File-New-Empty File,存檔到week14-2_fprintf_fscanf 目錄裡的week14-2.cpp

1.把剛才的week14-2.cpp拿來用

2.另外一組File *  fin =fopen("檔名","r") ;

3.scanf()=>fscanf() File Input

4.fclose()

##step01-3

把上週的程式碼拿來用

並加入本周所學

```

#include<GL/glut.h>

#include<stdio.h>

float angle[20],oldX=0;

int angleID=0;

FILE * fout = NULL;

void myWrite(){

    if(fout == NULL) fout = fopen("file.txt","w+");

    for(int i=0;i<20;i++){

            printf("%.1f ",angle[i]);///小黑印出來

            fprintf(fout,"%.1f",angle[i]);///檔案印出來

    }///這裡老師沒有fclose

}

void keyboard(unsigned char key,int x,int y){

    if(key=='0') angleID=0;

    if(key=='1') angleID=1;

    if(key=='2') angleID=2;

    if(key=='3') angleID=3;

}

void mouse(int button,int state,int x,int y){

    oldX=x;

}

void motion(int x,int y){

    angle[angleID] += (x-oldX);

    myWrite();

    oldX = x;

    glutPostRedisplay();///請GLUT重畫畫面Re display

}

void display()

{

    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

    glColor3f(1,1,1);///白色的

    glRectf(0.3,0.5,-0.3,-0.5);///四邊形

    glPushMatrix();///右半部

        glTranslatef(0.3,0.4,0);///(3)把手臂掛回身體

        glRotatef(angle[0],0,0,1);///(2)旋轉 對Z軸轉

        glTranslatef(-0.3,-0.4,0);///(1)把手臂的旋轉中心,放中心

        glColor3f(1,0,0);//紅色的

        glRectf(0.3,0.5,0.7,0.3);

        glPushMatrix();

            glTranslatef(0.7,0.4,0);///(3)把手肘掛回剛剛的位置

            glRotatef(angle[1],0,0,1);///(2)旋轉

            glTranslatef(-0.7,-0.4,0);///(1)把手肘旋轉中心,放中心

            glColor3f(0,1,0);///綠色的

            glRectf(0.7,0.5,1.0,0.3);///上手臂

        glPopMatrix();

        glPushMatrix();///左半部

        glTranslatef(-0.3,0.4,0);///(3)把手臂掛回身體

        glRotatef(angle[2],0,0,1);///(2)旋轉 對Z軸轉

        glTranslatef(0.3,-0.4,0);///(1)把手臂的旋轉中心,放中心

        glColor3f(1,0,0);///紅色的

        glRectf(-0.3,0.5,-0.7,0.3);

        glPushMatrix();

            glTranslatef(-0.7,0.4,0);///(3)把手肘掛回剛剛的位置

            glRotatef(angle[3],0,0,1);///(2)旋轉

            glTranslatef(0.7,-0.4,0);///(1)把手肘旋轉中心,放中心

            glColor3f(0,1,0);///綠色的

            glRectf(-0.7,0.5,-1.0,0.3);///上手臂

        glPopMatrix();

    glPopMatrix();

    glutSwapBuffers();

}

int main(int argc, char**argv)

{

    glutInit(&argc,argv);

    glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

    //glutInitWindowSize(600,600);

    glutCreateWindow("week13 rect TRT");

    glutMouseFunc(mouse);

    glutMotionFunc(motion);

    glutKeyboardFunc(keyboard);

    glutDisplayFunc(display);

    glutMainLoop();

}

```

再開一個新專案 名稱week14_angles_fpintf_fscanf

```

///a

#include<GL/glut.h>

#include<stdio.h>

float angle[20],oldX=0;

int angleID=0;

FILE * fout = NULL, * fin = NULL;

void myWrite(){

    if(fout == NULL) fout = fopen("file.txt","w+");

    for(int i=0;i<20;i++){

            printf("%.1f ",angle[i]);///小黑印出來

            fprintf(fout,"%.1f",angle[i]);///檔案印出來

    }///這裡老師沒有fclose

    printf("\n");

    fprintf(fout,"\n");

}

void myRead(){

    if( fout != NULL){ fclose(fout); fout=NULL; }

    if( fin == NULL ) fin = fopen("file.txt"," r");

    for(int i=0;i<20;i++){

        fscanf(fin, "%f",&angle[i]);

    }

    glutPostRedisplay();

}

void keyboard(unsigned char key,int x,int y){

    if(key=='r') myRead();

    if(key=='1') angleID=1;

    if(key=='2') angleID=2;

    if(key=='3') angleID=3;

}

void mouse(int button,int state,int x,int y){

    oldX=x;

}

void motion(int x,int y){

    angle[angleID] += (x-oldX);

    myWrite();

    oldX = x;

    glutPostRedisplay();///請GLUT重畫畫面Re display

}

void display()

{

    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

    glColor3f(1,1,1);///白色的

    glRectf(0.3,0.5,-0.3,-0.5);///四邊形

    glPushMatrix();///右半部

        glTranslatef(0.3,0.4,0);///(3)把手臂掛回身體

        glRotatef(angle[0],0,0,1);///(2)旋轉 對Z軸轉

        glTranslatef(-0.3,-0.4,0);///(1)把手臂的旋轉中心,放中心

        glColor3f(1,0,0);//紅色的

        glRectf(0.3,0.5,0.7,0.3);

        glPushMatrix();

            glTranslatef(0.7,0.4,0);///(3)把手肘掛回剛剛的位置

            glRotatef(angle[1],0,0,1);///(2)旋轉

            glTranslatef(-0.7,-0.4,0);///(1)把手肘旋轉中心,放中心

            glColor3f(0,1,0);///綠色的

            glRectf(0.7,0.5,1.0,0.3);///上手臂

        glPopMatrix();

        glPushMatrix();///左半部

        glTranslatef(-0.3,0.4,0);///(3)把手臂掛回身體

        glRotatef(angle[2],0,0,1);///(2)旋轉 對Z軸轉

        glTranslatef(0.3,-0.4,0);///(1)把手臂的旋轉中心,放中心

        glColor3f(1,0,0);///紅色的

        glRectf(-0.3,0.5,-0.7,0.3);

        glPushMatrix();

            glTranslatef(-0.7,0.4,0);///(3)把手肘掛回剛剛的位置

            glRotatef(angle[3],0,0,1);///(2)旋轉

            glTranslatef(0.7,-0.4,0);///(1)把手肘旋轉中心,放中心

            glColor3f(0,1,0);///綠色的

            glRectf(-0.7,0.5,-1.0,0.3);///上手臂

        glPopMatrix();

    glPopMatrix();

    glutSwapBuffers();

}

int main(int argc, char**argv)

{

    glutInit(&argc,argv);

    glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

    //glutInitWindowSize(600,600);

    glutCreateWindow("week13 rect TRT");

    glutMouseFunc(mouse);

    glutMotionFunc(motion);

    glutKeyboardFunc(keyboard);

    glutDisplayFunc(display);

    glutMainLoop();

}

```

#step02-2

為甚麼產生的檔案file.txt放在奇怪的目錄?

1.原來是歷史餘讀 GLUT專案 需要 freeglut.dll所以working_dir被設到freeglut\bin裡面

2.在.cbp CodeBlocks Progect 檔裡,有working_dir的設定 工作執行的目錄

3.Notepad++存檔後,CodeBlocks Reload他,便成功了!!

4.小心 歷史餘毒 freeglut.dll 要再修正, 放到week14_angles_fprintf_fscanf 程式專案的同目錄, 再執行時, 便可以 mouse motion 動動動, 按r重播,而且file.txt 也放在你的程式專案目錄囉!!!

#step03-1

開一個新專案week14_timer

模擬一下早晨鬧鐘響的樣子吧

#include<GL/glut.h>

#include<stdio.h>

void timer(int t){

    printf("起床,現在時間 %d\n",t);

}

void display(){

}

int main(int argc,char** argv)

{

    glutInit(&argc, argv);

    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);

    glutCreateWindow("week14_timer");

    glutTimerFunc(1000,timer,1);

    glutTimerFunc(2000,timer,2);

    glutTimerFunc(3000,timer,3);

    glutTimerFunc(4000,timer,4);

    glutTimerFunc(5000,timer,5);

    glutDisplayFunc(display);

    glutMainLoop();

}

#step03-2

期末作品如果要每秒30格，這樣要一個設定太麻煩應該自動點

所以我們就在程式碼上動動手腳ㄅ

#include<GL/glut.h>

#include<stdio.h>

void timer(int t){

    printf("起床,現在時間 %d\n",t);

    glutTimerFunc(1000,timer,t+1);

}

void display(){

}

int main(int argc,char** argv)

{

    glutInit(&argc, argv);

    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);

    glutCreateWindow("week14_timer");

    glutTimerFunc(5000,timer,0);

    glutDisplayFunc(display);

    glutMainLoop();

}

##step03-3

播放聲音 PlaySound()請先下載do.wav

1.繼續改 week14_timer_one_by_one

2.加上一行#include<mmsystem.h>

3.PlaySound(do.wav,NULL,SND_ASYNC);

AhFatKr的電腦圖學筆記week13

 #week13

##step01-1

glRectf(x1,y1,x2,y2)方塊

1.File-New-Project,GLUT專案

2.貼上GLUT 10行程式,不用茶壺

3.把手臂接到身體

#include<GL/glut.h>

void display()

{

    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

    glColor3f(1,1,1);//白色的

    glRectf(0.3,0.5,-0.3,-0.5);//四邊形

    glPushMatrix();

        ///glTranslatef(x,y,z);(3)把手臂掛回身體

        ///glRotatef(angle,0,0,1);(2)旋轉 對Z軸轉

        ///glTranslatef(x2,y2,z2);(1)把手臂的旋轉中心,放中心

        glColor3f(1,0,0);//紅色的

        glRectf(0.3,0.5,0.7,0.3);

    glPopMatrix();

    glutSwapBuffers();

}

int main(int argc, char**argv)

{

    glutInit(&argc,argv);

    glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

    //glutInitWindowSize(600,600);

    glutCreateWindow("week13 rect TRT");

    glutDisplayFunc(display);

    glutMainLoop();

}

#step01-2

先把旋轉中心放在正中心

把(0.3 0.4)移到(0 0)

加一行glTranslatef(-0.3,-0.4,0);將旋轉中心移動到正中心 

#step01-3

再加入一行glRotatef(45,0,0,1);讓手臂旋轉45度

#step01-4

在加一行glTranslatef(0.3,0.4,0);把手臂掛回身體

#step02-1

加入另一隻手臂

#step02-2

加入三行程式讓另一隻手臂也能轉，並且與第一條手臂相接

#step3-1

File-New-Project,GLUT新的專案week13_rect_many_TRT

複製剛剛的程式碼，並加入左半邊的手臂(將座標正負互換，形成鏡射效果)

#include<GL/glut.h>

float angle=45,oldX=0;

void mouse(int button,int state,int x,int y){

    oldX=x;

}

void motion(int x,int y){

    angle += (x-oldX);

    oldX = x;

    glutPostRedisplay();///請GLUT重畫畫面Re display

}

void display()

{

    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

    glColor3f(1,1,1);///白色的

    glRectf(0.3,0.5,-0.3,-0.5);///四邊形

    glPushMatrix();///右半部

        glTranslatef(0.3,0.4,0);///(3)把手臂掛回身體

        glRotatef(angle,0,0,1);///(2)旋轉 對Z軸轉

        glTranslatef(-0.3,-0.4,0);///(1)把手臂的旋轉中心,放中心

        glColor3f(1,0,0);//紅色的

        glRectf(0.3,0.5,0.7,0.3);

        glPushMatrix();

            glTranslatef(0.7,0.4,0);///(3)把手肘掛回剛剛的位置

            glRotatef(angle,0,0,1);///(2)旋轉

            glTranslatef(-0.7,-0.4,0);///(1)把手肘旋轉中心,放中心

            glColor3f(0,1,0);///綠色的

            glRectf(0.7,0.5,1.0,0.3);///上手臂

        glPopMatrix();

        glPushMatrix();///左半部

        glTranslatef(-0.3,0.4,0);///(3)把手臂掛回身體

        glRotatef(angle,0,0,1);///(2)旋轉 對Z軸轉

        glTranslatef(0.3,-0.4,0);///(1)把手臂的旋轉中心,放中心

        glColor3f(1,0,0);///紅色的

        glRectf(-0.3,0.5,-0.7,0.3);

        glPushMatrix();

            glTranslatef(-0.7,0.4,0);///(3)把手肘掛回剛剛的位置

            glRotatef(angle,0,0,1);///(2)旋轉

            glTranslatef(0.7,-0.4,0);///(1)把手肘旋轉中心,放中心

            glColor3f(0,1,0);///綠色的

            glRectf(-0.7,0.5,-1.0,0.3);///上手臂

        glPopMatrix();

    glPopMatrix();

    glutSwapBuffers();

}

int main(int argc, char**argv)

{

    glutInit(&argc,argv);

    glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

    //glutInitWindowSize(600,600);

    glutCreateWindow("week13 rect TRT");

    glutMouseFunc(mouse);

    glutMotionFunc(motion);

    glutDisplayFunc(display);

    glutMainLoop();

}

#step03-2

如果只有一個角度是不行的

所有關節那些加起來大約需要20個角度

#include<GL/glut.h>

float angle[20],oldX=0;

int angleID=0;

void keyboard(unsigned char key,int x,int y){

    if(key=='0') angleID=0;

    if(key=='1') angleID=1;

    if(key=='2') angleID=2;

    if(key=='3') angleID=3;

}

void mouse(int button,int state,int x,int y){

    oldX=x;

}

void motion(int x,int y){

    angle[angleID] += (x-oldX);

    oldX = x;

    glutPostRedisplay();///請GLUT重畫畫面Re display

}

void display()

{

    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);

    glColor3f(1,1,1);///白色的

    glRectf(0.3,0.5,-0.3,-0.5);///四邊形

    glPushMatrix();///右半部

        glTranslatef(0.3,0.4,0);///(3)把手臂掛回身體

        glRotatef(angle[0],0,0,1);///(2)旋轉 對Z軸轉

        glTranslatef(-0.3,-0.4,0);///(1)把手臂的旋轉中心,放中心

        glColor3f(1,0,0);//紅色的

        glRectf(0.3,0.5,0.7,0.3);

        glPushMatrix();

            glTranslatef(0.7,0.4,0);///(3)把手肘掛回剛剛的位置

            glRotatef(angle[1],0,0,1);///(2)旋轉

            glTranslatef(-0.7,-0.4,0);///(1)把手肘旋轉中心,放中心

            glColor3f(0,1,0);///綠色的

            glRectf(0.7,0.5,1.0,0.3);///上手臂

        glPopMatrix();

        glPushMatrix();///左半部

        glTranslatef(-0.3,0.4,0);///(3)把手臂掛回身體

        glRotatef(angle[2],0,0,1);///(2)旋轉 對Z軸轉

        glTranslatef(0.3,-0.4,0);///(1)把手臂的旋轉中心,放中心

        glColor3f(1,0,0);///紅色的

        glRectf(-0.3,0.5,-0.7,0.3);

        glPushMatrix();

            glTranslatef(-0.7,0.4,0);///(3)把手肘掛回剛剛的位置

            glRotatef(angle[3],0,0,1);///(2)旋轉

            glTranslatef(0.7,-0.4,0);///(1)把手肘旋轉中心,放中心

            glColor3f(0,1,0);///綠色的

            glRectf(-0.7,0.5,-1.0,0.3);///上手臂

        glPopMatrix();

    glPopMatrix();

    glutSwapBuffers();

}

int main(int argc, char**argv)

{

    glutInit(&argc,argv);

    glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);

    //glutInitWindowSize(600,600);

    glutCreateWindow("week13 rect TRT");

    glutMouseFunc(mouse);

    glutMotionFunc(motion);

    glutKeyboardFunc(keyboard);

    glutDisplayFunc(display);

    glutMainLoop();

}

AhFatKr的電腦圖學筆記week12

#step01-1

1.jsyeh.org/3dcg10 下載windows.zip ,data.zip

2.windows.zip => 下載\windows\Transformation.exe

3.data.zip => 下載\windows\data\模型

4.重點要有T移動 R轉動,按右鍵swap交換T R

5.glTranslatef(0.9 , 0, 0);移動

6.glRotatef(角度,0,1,0);轉動

在右邊轉動的藍色車子

```cpp

glTranslatef(0.9 , 0, 0);移動在右邊

glRotatef(角度,0,1,0);旋轉

畫一台藍色車子

```

```cpp

繞著中間轉的車子

glRotatef(角度,0,1,0);旋轉

glTranslatef(0.9 , 0, 0);移動在右邊

畫一台藍色車子

```

#step01-2

 用另一個程式來理解OpenGL T-R-T的函式;對特定軸轉動練習

1. 120.125.80.50/GL 有程式,老師寫的程式,可以給我們更了解函式的運作方式

2. (右下角)點ToDraw, 左邊黑的地方可以畫圖

3. Ctrl - R Reload可清空

4. 可以畫個身體 叫 myDrawObject(0)

5. 可以再畫個手臂 叫 myDrawObject(1)

6.可以上下更改程式的順序,都試試看比較方便理解函式的運作

7.接下來是練習內容!

當我把glRotatef(angle,0,0,0);寫在兩個物件之上時,兩個都會轉動,因為代表兩個物件都在Rotate的函式之下

#step02-1

1.把glTranslatef();那一行,點它變紅色,就可以移動左邊的東西了

2.把glTranslatef();那一行,放在Rotatef()的下面手臂的上面

3.把另一個glTranslatef();放在Rotatef()的上面

```cpp

glPushMatrix();

        myDrawObject(0);畫身體

        glRotatef(angle,0,0,0);//這個旋轉會轉下面所有的東西

        glTranslatef(0.02,-0.06);往左下方移動(讓軸心在正中央)

        myDrawObject(1);畫手臂(右上方)

glPopMatrix();

```

```cpp

myDrawObject(0);畫身體

glPushMatrix()

        glTranslatef(0.15,0.20,0);往右上方移

        glRotatef(angle,0,0,0);//這個旋轉會轉下面所有的東西

        glTranslatef(0.02,-0.06,0);往左下方移動(讓軸心在正中央)

        myDrawObject(1);畫手臂(右上方)

glPopMatrix();

```

#step02-2

這裡老師在講解下周考試題目,運用到的是今天上課所學的T-R-T

```cpp

glPushMatrix()

        glTranslatef(0.15,0.20,0);往右上方移

        glRotatef(angle,0,0,0);//這個旋轉會轉下面所有的東西

        glTranslatef(0.02,-0.06,0);往左下方移動(讓軸心在正中央)

        myDrawHand(1);畫手(右上方)

glPopMatrix();

```

#step02-3

現在要寫程式了

1. File-New-Project,GLUT專案,名稱week12_TRT

2. 把十行程式碼放進去

3. 把T-R-T的6行放進去

4. 再讓他會自動轉

5. glutIdleFunc( display );

程式如下

#include <GL/glut.h>

float angle=0;

void display()

{

    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

    glPushMatrix();///備份矩陣

        glRotatef(angle,0,0,1);

        glutSolidTeapot(0.2);

    glPopMatrix();///還原矩陣

    glutSwapBuffers();

    angle+=0.1;

}

int main(int argc, char *argv[])

{

    glutInit(&argc, argv);

    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);

    glutCreateWindow("Week12_TRT");

    glutIdleFunc(display);

    glutDisplayFunc(display);

    glutMainLoop();

}

#include <GL/glut.h>

float angle=0;

void display()

{

    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

    glColor3f(1,1,1);

    glutSolidTeapot( 0.3 );//茶壺當身體

    glPushMatrix();///備份矩陣

        glTranslatef(0.2,0,0);

        glRotatef(angle,0,0,1);

        glTranslatef(0.2,0,0);

        glColor3f(1,0,0);//紅的

        glutSolidTeapot( 0.2 );//小茶壺 當她是小手臂

    glPopMatrix();///還原矩陣

    glutSwapBuffers();

    angle+=0.1;

}

int main(int argc, char *argv[])

{

    glutInit(&argc, argv);

    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);

    glutCreateWindow("Week12_TRT");

    glutIdleFunc(display);

    glutDisplayFunc(display);

    glutMainLoop();

}

#step03-2

為了寫回家作業

1. 要有3D模型(可用MAYA自己建出來，也可以用網路上找的模型來裁切)需要包含身體、上手臂、下手肘。

 回家作業就來改數值!

#include <GL/glut.h>

float angle=0;

void display()

{

    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

    glColor3f(1,1,1);

    glutSolidTeapot( 0.3 );//茶壺當身體

    glPushMatrix();///右邊的手臂手肘!!!

        glTranslatef(0.2,0,0);

        glRotatef(angle,0,0,1);

        glTranslatef(0.2,0,0);

        glColor3f(1,0,0);//紅的

        glutSolidTeapot( 0.2 );//小茶壺 當她是下手臂

        glPushMatrix();///備份矩陣

            glTranslatef(0.2,0,0);

            glRotatef(angle,0,0,1);

            glTranslatef(0.2,0,0);

            glColor3f(1,0,0);//紅的

            glutSolidTeapot( 0.2 );//小茶壺 當她是下手肘

        glPopMatrix();///還原矩陣

    glPopMatrix();///還原矩陣

    glutSwapBuffers();

    angle+=0.1;

}

int main(int argc, char *argv[])

{

    glutInit(&argc, argv);

    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);

    glutCreateWindow("Week12_TRT");

    glutIdleFunc(display);

    glutDisplayFunc(display);

    glutMainLoop();

}

寫完一隻手臂後，當然要再加上另一隻!

#include <GL/glut.h>

float angle=0;

void display()

{

    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

    glColor3f(1,1,1);

    glutSolidTeapot( 0.3 );//茶壺當身體

    glPushMatrix();///右邊的手臂手肘

        glTranslatef(0.2,0,0);

        glRotatef(angle,0,0,1);

        glTranslatef(0.2,0,0);

        glColor3f(1,0,0);//紅的

        glutSolidTeapot( 0.2 );//小茶壺 當她是下手臂

        glPushMatrix();///備份矩陣

            glTranslatef(0.2,0,0);

            glRotatef(angle,0,0,1);

            glTranslatef(0.2,0,0);

            glColor3f(1,0,0);//紅的

            glutSolidTeapot( 0.2 );//小茶壺 當她是下手肘

        glPopMatrix();///還原矩陣

    glPopMatrix();///還原矩陣

    glPushMatrix();///左邊的手臂手肘!!!!!!!!!

        glTranslatef(-0.2,0,0);

        glRotatef(-angle,0,0,1);

        glTranslatef(-0.2,0,0);

        glColor3f(1,0,0);//紅的

        glutSolidTeapot( 0.2 );//小茶壺 當她是下手臂

        glPushMatrix();///備份矩陣

            glTranslatef(0.2,0,0);

            glRotatef(angle,0,0,1);

            glTranslatef(0.2,0,0);

            glColor3f(1,0,0);//紅的

            glutSolidTeapot( 0.2 );//小茶壺 當她是下手肘

        glPopMatrix();///還原矩陣

    glPopMatrix();///還原矩陣

    glutSwapBuffers();

    angle+=0.1;

}

int main(int argc, char *argv[])

{

    glutInit(&argc, argv);

    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);

    glutCreateWindow("Week12_TRT");

    glutIdleFunc(display);

    glutDisplayFunc(display);

    glutMainLoop();

}

AhFatKr的電腦圖學筆記week11

 step01

(家裡OK)1-1安裝好freeglut

(家裡OK)1-2opencv裝好,opencv裡面設定調好

(家裡OK)setting-compiler-search directories   compiler include  C:\OpenCV2.1\include

(家裡OK)setting-compiler-search directories   Linker lib C:\OpenCV2.1\lib

(家裡OK)setting-compiler-Linker  cv210 cxcore210 highgui210

1-3重開codeblocks 開新專案

1-4myGumdam.zip裡的data放進freeglut的bin裡打以下程式碼

#include <opencv/highgui.h>

int main()

{

    IplImage * img = cvLoadImage("data/Diffuse.jpg");

    cvShowImage("week11",img);

    cvWaitKey();

}

step02

把茶壺貼上鋼彈的貼圖

2-1上面放上週的myTexture放在程式碼裡面

2-2下面放GLUT 必要10行程式

2-3main()的glutMainLoop()之前,加入myTexture("data/Diffuse.jpg");

打以下程式碼

#include <opencv/highgui.h>

#include <opencv/cv.h>

#include <GL/glut.h>

int myTexture(char * filename)

{

    IplImage * img = cvLoadImage(filename); ///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);

    return id;

}

void display()

{

    glClear(GL_COLOR_BUFFER_BIT || GL_DEPTH_BUFFER_BIT);

    glutSolidTeapot(0.3);

    glutSwapBuffers();

}

int main(int argc,char**argv)

{

    glutInit(&argc,argv);

    glutInitDisplayMode(GLUT_DOUBLE | GLUT_DEPTH);

    glutCreateWindow("week11 gundam");

    glutDisplayFunc(display);

    myTexture("data/Diffuse.jpg");

    glutMainLoop();

}

Step03 持續實作 glm 模型相關練習

3-1 在https://jsyeh.org/3dcg10/裡下載source.zip 

3-2  取得glm.h 和glm.c改成.cpp 和 transformation.c

3-3 把glm.cpp用Add file的方式加入進main.cpp旁邊

3-4 從transformation.c參考並加入程式碼

3-5 main.cpp加入兩行程式碼

#include "glm.h"

GLMmodel * pmodel=NULL;

3-6 display()加入好幾行

3-7 最終程式碼

#include <GL/glut.h>

#include <opencv/highgui.h>

#include <opencv/cv.h>

#include "glm.h"

GLMmodel * pmodel=NULL;

///GLUquadric * sphere = NULL;///指標,指到2次曲面

int myTexture(char * filename)

{

    IplImage * img = cvLoadImage(filename); ///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);

    return id;

}

float angle=0;///旋轉角度

 void display()

 {

    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

    glPushMatrix();

        glRotatef(angle,0,1,0);

        if(pmodel==NULL)///如果是空指標 表示模型還沒準備好

        {

            pmodel=glmReadOBJ("data/Gundam.obj");///讀模型

            glmUnitize(pmodel);///換算成unit單位大小

            glmFacetNormals(pmodel);///重新計算模型的面的法向量

            glmVertexNormals(pmodel,90);///重新計算模型頂點的法向量

        }

        glmDraw(pmodel,GLM_TEXTURE);///有模型後畫面要記得畫貼圖

    glPopMatrix();

    glutSwapBuffers();

    angle+=0.01;

 }

 int main(int argc, char *argv[])///main()主函式 進階版

 {

    glutInit(&argc,argv);///把參數送給glutInit初始化

    glutInitDisplayMode(GLUT_DOUBLE|GLUT_DEPTH);///雙緩衝區+3D深度功能

    glutCreateWindow("week11_gundam");///開GLUT視窗

    glEnable(GL_DEPTH_TEST);

    glutDisplayFunc(display);///顯示用的函式

    glutIdleFunc(display);

    myTexture("data/Diffuse.jpg");

    ///myTexture("earth.jpg");

    ///sphere=gluNewQuadric();///準備好2次曲面

    glutMainLoop();

 }

就可以轉圈圈啦