6_2: rotate(), p.209(236)
http://140.136.150.78/IM2010/HW06/b/applet/
6_3: easing, p.239(266)
http://140.136.150.78/IM2010/HW06/c/applet/
6_4: storing mouse data p.306(333)
http://140.136.150.78/IM2010/HW06/d/applet/
這次學會透過陣列座標傳遞來達成移動的效果。
p.160
translate(x, y)
if translate(10,30) , rec(0,5,20,20) 的座標系統會轉成在 (10,35) 的位置開始畫
所有在translate( )後畫的東西做標系統都會改變
如果連續寫translate( ), 座標直會相加
ex:
translate(10,30)
rect(0,5,20,20) --> draw from 10,35
translate(10,30)
rect(0,5,20,20) --> draw from 20,70
p.164
rotate(angle): function
rotates the coordinate system so that shapes can be drawn
to the screen at an angle. --> that's why need translate()
Shapes are always rotated around their position
relative to the origin (0,0), and
positive
numbers rotate them in a
clockwise direction.
rotate和translate一樣，連續寫的話也會累積,0.0 to 2π.
ex:
rotate(PI/2)
rotate(-PI/8)
translate(width/2, height/2); --> 位移座標系統
rotate(PI/8);
rect(-25, -25, 50, 50); --> 畫在中央
with for:
translate(66, 33); // Set initial offset
for (int i = 0; i < 18; i++)
{ // 18 repetitions
strokeWeight(i); // Increase stroke weight
rotate(PI/12); // Accumulate the rotation
line(0, 0, 55, 0);
}
p.252
if ((keyPressed == true) && (key == 'A'))
If you want to check for both uppercase and lowercase letters, you have to extend the
relational expression with a logical OR, the || relational operator.
--> if ((keyPressed == true) && ((key == 'a') || (key == 'A')))
key code: Alt, Control, Shift, Backspace, Tab, Enter, Return, Escape, Delete,ALT, CONTROL, SHIFT, UP, DOWN, LEFT, RIGHT
用之前要先if (key == CODED)
ex:
if (key == CODED)
{
if (keyCode == UP) { }
}
p.258
mouseMoved() : block is run at the end of each frame when the mouse moves and no button is pressed.
mouseDragged() block does the same when the mouse button is pressed
p. 266
Easing, also called interpolation, is a technique for moving between two points.
As the shape approaches the target position, the distance moved each frame decreases.
The easing variable sets the fraction of the
distance between the
circle’s current
position and the position of the mouse that the circle moves each frame.
between 0.0 and 1.0,
The value of this variable changes how quickly the circle will reach the target.
An easing value of 0.5 means the circle will move half the distance each frame and an
easing value of 0.01 means the circle will move one hundredth of the distance each
frame.
