Question

我是Processing的新手，所以这个问题可能是...... 我想在我生成的图形中添加拖放功能。

我发现Processing - Mouse Functions解释了如何将拖动添加到特定对象，但我正在寻找一个通用的解决方案，我不必为每个想要能够拖动的对象添加拖动方法。

感谢

Answer 1

一种选择是将功能封装到可以扩展的类中。如果你的图形扩展了这样一个类，那么它们也会变得“可拖动”。

这是一个最小的例子，其中图形只是框，但扩展了“可拖动的行为”：

int nb = 3;
Box[] boxes = new Box[nb];//a list of draggable graphics, currently empty

void setup(){
  size(400,400);
  for(int i = 0 ; i < nb; i++){
    boxes[i] = new Box();//populate the list with actual objects
    boxes[i].x = 10+110*i;//and setup their coordinates
    boxes[i].y = 100;//and dimenensions
    boxes[i].w = boxes[i].h = 100;
  }
}
void draw(){
  background(0);//clear
  for(int i = 0 ; i < nb; i++){
    boxes[i].update(mouseX,mouseY);//update the internal state(if it's over or not, calculate drag offset, etc.)
    boxes[i].draw();//render each graphics element on screen
  }
}
void mouseDragged(){//if the mouse is dragged
  for(int i = 0 ; i < nb; i++){//for each graphics element
    if(boxes[i].isOver) {//if it's over
      boxes[i].x = mouseX-boxes[i].offx;//than drag based on the mouse position
      boxes[i].y = mouseY-boxes[i].offy;//but take te mouse offset in relation to each object into account
    }
  }
}
class Draggable{//a generic draggable template with no graphics to display
  float x,y,w,h,offx,offy;//position, dimensions and x,y offset to drag
  boolean isOver;//is the cursor over the bounding box of this object ?
  void update(int mx,int my){//let's work that out based on the mouse x and y coordinates
    isOver = ((mx >= x && mx <= x+w) && (my >= y && my <= y+h));//if it's within bounds on x and y axis, then we're in the over state
    if(isOver){//if we're in the over state we can also update the mouse drag offsets
      offx = mx-x;
      offy = my-y;
    }
  }
}
class Box extends Draggable{
  void draw(){
    fill(isOver ? 127 : 255);
    rect(x,y,w,h);
  }
}

这将是测试OOP概念的一个有趣的小机会：多态性

int nb = 6;
Draggable[] boxes = new Draggable[nb];//a list of draggable graphics, currently empty

void setup(){
  size(400,400);
  for(int i = 0 ; i < nb; i++){
    boxes[i] = (random(1.0) > .5) ? new Box() : new Blob();//populate the list with actual objects
    boxes[i].x = 10+110*i;//and setup their coordinates
    boxes[i].y = 100;//and dimenensions
    boxes[i].w = boxes[i].h = 100;
  }
}
void draw(){
  background(0);//clear
  for(int i = 0 ; i < nb; i++){
    boxes[i].update(mouseX,mouseY);//update the internal state(if it's over or not, calculate drag offset, etc.)
    boxes[i].draw();//render each graphics element on screen
  }
}
void mouseDragged(){//if the mouse is dragged
  for(int i = 0 ; i < nb; i++){//for each graphics element
    if(boxes[i].isOver) {//if it's over
      boxes[i].x = mouseX-boxes[i].offx;//than drag based on the mouse position
      boxes[i].y = mouseY-boxes[i].offy;//but take te mouse offset in relation to each object into account
    }
  }
}
class Draggable{//a generic draggable template with no graphics to display
  float x,y,w,h,offx,offy;//position, dimensions and x,y offset to drag
  boolean isOver;//is the cursor over the bounding box of this object ?
  void update(int mx,int my){//let's work that out based on the mouse x and y coordinates
    isOver = ((mx >= x && mx <= x+w) && (my >= y && my <= y+h));//if it's within bounds on x and y axis, then we're in the over state
    if(isOver){//if we're in the over state we can also update the mouse drag offsets
      offx = mx-x;
      offy = my-y;
    }
  }
  void draw(){}//empty implementation to be overwritten by a subclass
}
class Box extends Draggable{
  void draw(){
    fill(isOver ? 127 : 255);
    rect(x,y,w,h);
  }
}
class Blob extends Draggable{
  void draw(){
    fill(isOver ? 127 : 255);
    ellipse(x,y,w,h);
  }
}

这是如何实现这一点的想法，但有多种方法可以实现这一点。查看Processing OOP tutorial或更深入的Java OOP one 例如，可以使用Interfaces或AbstractClass来实现上述目的。这取决于您的目标和限制最佳解决方案。

处理 - 如何向图形添加拖动工具

1 个答案: