2017計算機圖學: Week10

顯示具有 Week10 標籤的文章。顯示所有文章

2018年1月13日星期六

計圖筆記WEEK10

()老師播放SIGGRAPG ASIA和圖學相關作品的影片

(2)用processing寫Android程式碼
processing更改mode方式 : 右上角點添加模式，選android
接下來的程式碼即可在手機上投影

(3)與專題同組開始討論我們的專題方向及實作辦法

計算機圖學 WEEK10

1. 觀看SIGGRAPH 影片

2.用processing寫Android程式碼
processing更改mode方式 : 右上角點添加模式，選android
接下來的程式碼即可在手機上投影

Hello World_OpenGL_note_Week10

Week10

本周是互動式的程式介紹。

由於~~我的手機不支援~~，所以改採其他方式...將之前的課程八的地球儀打光。

因為我已經改成角椎，因此打光很輕鬆! 幾乎隨便調都有光! 事實上，sample的係數就已經設計得很不錯了，直接拿來用即可。

這是不同角度的截圖，上面的code就是我們熟悉的sample!

我只是一只可愛的麻雀（．＿．）Week10 筆記

本周主題：利用processing code寫android app

1. 於processing軟體右上角新增android mode
2. 系統會跳出是否安裝SDK 選擇安裝

靠杯不知道為什麼試很久沒辦法安裝QQQQQQ

所以看一下同學的筆記就好QQQQQ

Week 10 陳泱竹

(1)老師上課撥放了許多SIGGRAPG ASIA和圖學相關作品的影片，來幫助我們想專題題目

(2)與專題同組學長開始討論我們的專題方向及實作辦法
學習共筆鏈結:https://hackmd.io/s/B1j4leggM

2018年1月12日星期五

Claire 的課堂作業 week10

計算機圖學 Computer Graphics

期末作品說明示範
SIGGRAPH
影片示範

SIGGRAPH

期末作品說明示範

除了Facebook社團中，老師貼了許多和音樂結合的WebGL的作品，

課堂上老師有Demo一些範例，一些現有的經典遊戲，或是其他班級學生做的作品，讓我們找靈感：

皮卡丘打排球

Pah

青蛙祖瑪

igarashi的作品

Processing - Painter

在 Processing 寫 Android App

1. Processing 本身是以Java為基礎，他也另外提供了其他模式，

點選視窗右上角的Java會出先一個選單，選擇Add Mode...

2. 在Modes之下，可以看到Android Mode，點選它，在右下角可以按 Install

下載完成後就可以使用了！但前提是要有一隻可以測試的Android手機，還有傳輸線 > <

// 下面這段程式碼如果在Android 模式下，可以將手機變成閃燈

void setup(){

fullScreen(); // 在手機裡的全螢幕

}

void draw(){

if(mousePressed) background(255, 0, 255); // 按著畫面為粉色

else background(0, 255, 0); // 放開為綠色

}

在 Processing 實作碰撞偵測

綠色的球不斷移動，當碰到視窗外框或咖啡色由使用者操作的球時，會依照入射角等於反射角的計算而彈開，而不會相容在一起，這就是所謂碰撞偵測，原始碼如下，可閱讀簡單註解。

2018年1月11日星期四

40147027S-Week10

以processing與手機互動

將 processing 右上角的 java改成app mode
下載 android模式

彈力球範例：

void setup() {
size(500, 500);
}
float ballX=250, ballY=450, ballVX=1.3, ballVY=-10;
float ball2X=250, ball2Y=50;
void draw() {
if ( dist(ballX, ballY, ball2X, ball2Y)<100 ) {
float cx=(ballX+ball2X)/2, cy=(ballY+ball2Y)/2;
float nx=ballX-ball2X, ny=ballY-ball2Y;
line(ballX,ballY, ball2X,ball2Y);
PVector N=new PVector(nx, ny);
N.normalize();
PVector v0=new PVector(ballVX, ballVY);
float len= -N.dot(v0);
v0.add(N.mult(len*2));
line(cx,cy, cx+10*ballVX, cy+10*ballVY);
line(cx,cy, cx+20*v0.x, cy+20*v0.y);
ellipse(cx, cy, 10, 10);
stroke(0);
line(ballX, ballY, ball2X, ball2Y);
stroke(255, 128, 0);
line(cx, cy, cx+5*ballVX, cy+5*ballVY);
stroke(255, 128, 0);
line(cx, cy, cx+5*v0.x, cy+5*v0.y);
stroke(255, 0, 0);
line(cx, cy, cx+N.x, cy+N.y);
//return;
ballVX=v0.x;
ballVY=v0.y;
}
background(255);
ballX+=ballVX;
ballY+=ballVY;
if(ballX<50 || ballX>500-50) ballVX = -ballVX;
if(ballY<50 || ballY>500-50) ballVY = -ballVY;
ellipse(ballX, ballY, 100, 100);
ellipse(ball2X, ball2Y, 100, 100);
}
void mouseDragged(){
ball2X=mouseX; ball2Y=mouseY;
}

2018年1月10日星期三

2017年12月21日星期四

[耍廢]WEEK10

用 processing寫 android app

1. 將 processing 右上角的 java改成app mode
(要下載 android模式)
自動安裝 Android SDK NDK)
可以與手機互動

2.偵測碰撞遊戲:

void setup(){

size(500,500);

}

float ballX=250,ballY=450, ballVX=1, ballVY=10;

float ball2X=250, ball2Y=50;

void draw(){

if(ballX>450||ballX<50) //牆壁

ballVX=-ballVX;

if(ballY>450 || ballY<50) //牆壁

ballVY=-ballVY;

if( dist(ballX, ballY, ball2X, ball2Y)<100 ){

float cx=(ballX+ball2X)/2, cy=(ballY+ball2Y)/2;

float nx=ballX-ball2X, ny=ballY-ball2Y;

PVector N=new PVector(nx,ny);

N.normalize();

PVector v0=new PVector(ballVX, ballVY);

float len= -N.dot(v0);

v0.add(N.mult(len*2));

ellipse(cx, cy, 10,10);

stroke(0); line(ballX, ballY, ball2X, ball2Y);

stroke(255,128,0); line(cx,cy, cx+5*ballVX, cy+5*ballVY);

stroke(255,128,0); line(cx,cy, cx+5*v0.x, cy+5*v0.y);

stroke(255,0,0); line(cx,cy, cx+N.x, cy+N.y);

//return;

ballVX=v0.x; ballVY=v0.y;

}

background(255);

ballX+=ballVX; ballY+=ballVY;

ellipse(ballX, ballY, 100,100);

ellipse(ball2X, ball2Y, 100,100);

}

ㄅㄏ的OpenGL_glut_Week_10

1.
SIGGRAPH 期末作品可參考
...等介紹

2.
Processing 新增Android模式即可寫APP
可連接手機直接進行測試
程式寫法和之前很像
void draw()
{...}
void mouseDragged()
{...}
...
..
之類的

2017年11月30日星期四

WEEK10

Topic:

Processing Android

期末專題討論

A. Processing Android

STEP 1: 將模式改為Android

STEP 2: Result:按下滑鼠後變為紅色

B. Ball

STEP 1: 程式碼

STEP 2: Result

2017年11月23日星期四

詠銓_Week10_Note

Class: Android 程式

1.先下載 processing 程式

2.點選右上角的選單(預設是Java)

3.選擇 Android Mode 之後選 Install，即可編寫 Android 程式

4.範例程式: greenperple:

void setup(){
fullScreen(); //全螢幕
}
void draw(){
if(mousePressed)background(255, 0, 255); 點螢幕時，背景色變成紫色
else background(0, 255, 0); 背景色綠色
}

Note:
1.只要將 Android 手機用傳輸線插進電腦的USB孔，讓 processing 偵測到就可以在手機上建立執行檔看執行結果
2.如果沒有 Android 手機，則可以使用選單裡的 "Run in Emulator" 則可以在模擬器上執行

羅浩倫的學習筆記 Week10

本週學習重點

1.介紹一些圖學相關的project

2.用P語言做一些簡單的小程式

我的期末專題

目前已可以讀取模型檔並貼上貼圖顯示出來

圖學筆記Week10

1，期末專題討論

2，process3 mode anroid教學

->process3要下載 android模式
自動安裝 Android SDK NDK

->

android mode需要USB連接電腦與手機，
所以用java mode先做測試。

3.碰撞問題:

=>

寫出求碰撞以及撞到視窗邊界時候反射回去的碰撞。
此圖程式碼只要在+上滑鼠設置就基本完成!

=>附上程式碼:
void setup(){
size(500,500);
}
float ballX=250,ballY=450, ballVX=1.3, ballVY=-10;
float ball2X=250, ball2Y=50;
void draw(){
if( dist(ballX, ballY, ball2X, ball2Y)<100 ){
float cx=(ballX+ball2X)/2, cy=(ballY+ball2Y)/2;
float nx=ballX-ball2X, ny=ballY-ball2Y;
PVector N=new PVector(nx,ny);
N.normalize();
PVector v0=new PVector(ballVX, ballVY);
float len= -N.dot(v0);
v0.add(N.mult(len*2));
ellipse(cx, cy, 10,10);
stroke(0); line(ballX, ballY, ball2X, ball2Y);
stroke(255,128,0); line(cx,cy, cx+5*ballVX, cy+5*ballVY);
stroke(255,128,0); line(cx,cy, cx+5*v0.x, cy+5*v0.y);
stroke(255,0,0); line(cx,cy, cx+N.x, cy+N.y);
//return;
ballVX=v0.x; ballVY=v0.y;
}
background(255);
ballX+=ballVX;
ballY+=ballVY;
if(ballX<50||ballX>500-50)ballVX=-ballVX;
if(ballY<50||ballY>500-50)ballVY=-ballVY;
ellipse(ballX, ballY, 100,100);
ellipse(ball2X, ball2Y,100,100);
}

--------------------------------------------------------
滑鼠設置

void mouseDragged()
{
ball2X=mouseX;ball2Y=mouseY;
}

NOTE week10

1.先下載並安裝Processing，右上角選AddMode加入Android模式
安裝完後選取Android並自動安裝Android SDK
沒有Android手機可以裝虛擬機
2.小畫家
void setup()
{
fullScreen();
}
void draw()
{
if(mousePressed) background(255,0,0);
else background (0,255,0);
}

3.彈力球遊戲
void setup() {
size(500, 500);
}
float ballX=250, ballY=450, ballVX=1.3, ballVY=-10;
float ball2X=250, ball2Y=50;
void draw() {
if ( dist(ballX, ballY, ball2X, ball2Y)<100 ) {
float cx=(ballX+ball2X)/2, cy=(ballY+ball2Y)/2;
float nx=ballX-ball2X, ny=ballY-ball2Y;
line(ballX,ballY, ball2X,ball2Y);
PVector N=new PVector(nx, ny);
N.normalize();
PVector v0=new PVector(ballVX, ballVY);
float len= -N.dot(v0);
v0.add(N.mult(len*2));
line(cx,cy, cx+10*ballVX, cy+10*ballVY);
line(cx,cy, cx+20*v0.x, cy+20*v0.y);
ellipse(cx, cy, 10, 10);
stroke(0);
line(ballX, ballY, ball2X, ball2Y);
stroke(255, 128, 0);
line(cx, cy, cx+5*ballVX, cy+5*ballVY);
stroke(255, 128, 0);
line(cx, cy, cx+5*v0.x, cy+5*v0.y);
stroke(255, 0, 0);
line(cx, cy, cx+N.x, cy+N.y);
//return;
ballVX=v0.x;
ballVY=v0.y;
}
background(255);
ballX+=ballVX;
ballY+=ballVY;
if(ballX<50 || ballX>500-50) ballVX = -ballVX;
if(ballY<50 || ballY>500-50) ballVY = -ballVY;
ellipse(ballX, ballY, 100, 100);
ellipse(ball2X, ball2Y, 100, 100);
}
void mouseDragged(){
ball2X=mouseX; ball2Y=mouseY;
}

吳映廷計算機圖學 week10

Mengting計圖筆記Week10 - 專題發想、app製作

一、介紹SIGGRAPG ASIA，並展示一些圖學相關的專案

推薦一coursera課程交互式計算機圖形學

二、手機app程式教學(以processing實作)

1. 按下會有顏色變化的app

void setup(){
fullScreen();
}
void draw(){
if(mousePressed) background(255, 0, 255);
else background(0, 255, 0);
}

2. 小畫家app
void setup(){
size(1080,1920);
}
void draw(){
}
void mouseDragged(){
stroke(255, 0, 0);
line(mouseX, mouseY, pmouseX, pmouseY);
}

3. 碰撞偵測(展示了數支程式)
ballsize//球的半徑(當兩球之間距離小於半徑即發生碰撞)
return//程式直接停止

2017年11月22日星期三

俊凱的Week10筆記

1.期末作品展示
2.製作Android App
(i).在Processing下載Android Mode
(ii).執行程式碼
void setup()
{
fullScreen();
}

void draw()
{
if(mousePressed)background(255,0,0);
else background(0,255,0);

}
(iii)展示
*手機內會多一個應用程式

*銀幕產生綠色

*按下銀幕產生紅色

3.執行老師範例程式
void setup() {
size(500, 500);
}
float ballX=250, ballY=450, ballVX=1.3, ballVY=-10;
float ball2X=250, ball2Y=50;
void draw() {
if ( dist(ballX, ballY, ball2X, ball2Y)<100 ) {
float cx=(ballX+ball2X)/2, cy=(ballY+ball2Y)/2;
float nx=ballX-ball2X, ny=ballY-ball2Y;
line(ballX,ballY, ball2X,ball2Y);
PVector N=new PVector(nx, ny);
N.normalize();
PVector v0=new PVector(ballVX, ballVY);
float len= -N.dot(v0);
v0.add(N.mult(len*2));
line(cx,cy, cx+10*ballVX, cy+10*ballVY);
line(cx,cy, cx+20*v0.x, cy+20*v0.y);
ellipse(cx, cy, 10, 10);
stroke(0);
line(ballX, ballY, ball2X, ball2Y);
stroke(255, 128, 0);
line(cx, cy, cx+5*ballVX, cy+5*ballVY);
stroke(255, 128, 0);
line(cx, cy, cx+5*v0.x, cy+5*v0.y);
stroke(255, 0, 0);
line(cx, cy, cx+N.x, cy+N.y);
//return;
ballVX=v0.x;
ballVY=v0.y;
}
background(255);
ballX+=ballVX;
ballY+=ballVY;
if(ballX<50 || ballX>500-50) ballVX = -ballVX;
if(ballY<50 || ballY>500-50) ballVY = -ballVY;
ellipse(ballX, ballY, 100, 100);
ellipse(ball2X, ball2Y, 100, 100);
}
void mouseDragged(){
ball2X=mouseX; ball2Y=mouseY;
}

訂閱：文章 (Atom)

2018年1月13日 星期六