[英]Creating an “Animated” Spiky Ball in Processing.js
For my class, I'm creating a project in which a level includes a cursor in the form of an ellipse that reacts to a mousePressed command by having spikes protrude from within the ellipse and then recede back into the ellipse. 对于我的班级,我正在创建一个项目,在该项目中,一个级别包含一个椭圆形的光标,该光标通过使尖峰从椭圆形内突出,然后退回到椭圆形,对mousePressed命令做出反应。 The code for my cursor is right here:
我的光标的代码就在这里:
class Cursor{
float r;
float x;
float y;
Cursor(float _r){
r = _r;
x = 0;
y = 0;
}
void setLocation (float _x, float _y) {
x = _x;
y = _y;
}
void display(){
noStroke();
fill(230, 242, 255);
ellipse(x, y, r, r);
}
My teacher suggested I use createShape (TRIANGLE) within the ellipse and animate one of the vertices from each spike coming out at the appropriate time, but I simply wasn't able to follow his instructions as well as I had needed to. 我的老师建议我在椭圆内使用createShape(TRIANGLE),并在适当的时间为每个尖峰中的一个顶点设置动画,但是我根本无法按照他的指示进行操作。 Any assistance on this matter would be greatly appreciated.
在此问题上的任何协助将不胜感激。 I do hope to further use the animated vertices to "pop" a surrounding object later on, but I'm only mentioning that in the case that it's important for the initial creation and animation.
我确实希望以后再使用动画顶点来“弹出”周围的对象,但是我仅在提到它对于初始创建和动画很重要的情况下提及。
Thank you very much in advance! 提前非常感谢您!
Your teacher was probably talking about the beginShape(TRIANGLES)
function. 您的老师可能正在谈论
beginShape(TRIANGLES)
函数。 From the reference: 从参考:
beginShape(TRIANGLES);
vertex(30, 75);
vertex(40, 20);
vertex(50, 75);
vertex(60, 20);
vertex(70, 75);
vertex(80, 20);
endShape();
You could use this function to generate your spikes around your circle. 您可以使用此功能在圆周围生成尖峰。 You'll have to figure out the
x
and y
positions of the triangles around the circle, but you can do that using an incrementing angle and the cos()
and sin()
functions. 您必须弄清楚圆周围三角形的
x
和y
位置,但是您可以使用递增角度以及cos()
和sin()
函数来实现。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.