I am trying to add collision detection to this particle system I made

Question

I am doing this in processing which is essentially java and I have never attempted anything like this before. Can't find any examples of collision detection using arrays to map the pixels.

I am not really trying to make them realistic collisions. I was thinking it would have the same response as if it hit a wall which is just for it to change directions in whatever axis is appropriate for the wall it hit.

I have tried checking if the x and y position are the same but can't seem to make that work. I'd appreciate any input on this.

import java.util.Arrays;

int numOfParticles = 10;


float[] x = new float[numOfParticles]; //initial position of y only matters
float[] px = new float[numOfParticles];
float[] y = new float[numOfParticles]; 
float[] py = new float[numOfParticles];

int speed = 10;//inversly related to speed

float[] xIncrement = new float[numOfParticles]; //the ratio of increments determines the pattern
float[] yIncrement = new float[numOfParticles]; // it is the slope of the line

//float xIncrement = 10/speed; //the ratio of increments determines the pattern
//float yIncrement = 11/speed; // it is the slope of the line

color currentColor;
int alpha = 100;//range of 0-255

//radius of ball
int radius = 1;

//thickness of line behind ball
int thickness = 5;

int rateOfColor = 5; //this is inversely related to rate but also changes the range of colors

int maxColor = 255;
int minColor = 0;

void setup(){
  size(500,500);
  background(0);
  colorMode(HSB);
  strokeWeight(thickness);
  frameRate(60);

  //initialize particles
  for(int i = 0;i<numOfParticles;i++){
    xIncrement[i] = random(0,100)/speed; //the ratio of increments determines the pattern
    yIncrement[i] = random(0,100)/speed; // it is the slope of the line
    x[i] = random(0,width);
    px[i] = x[i];
    y[i] = random(0,height);
    py[i] = y[i];
  }

  //you can either initialize all of them individually or do a random one
  //x[0] = 0;
  //px[0] = x[0];
  //y[0] = 450;
  //py[0] = y[0];

  //x[1] = width;
  //px[1] = x[1];
  //y[1] = 450;
  //py[1] = y[1];
}

void draw(){  
  background(0);  //comment out for criss cross

  for(int i = 0; i < numOfParticles; i++){
    particle(i);
  }

}

void particle(int particleNum){
  currentColor = color(minColor + (x[particleNum]/rateOfColor)%maxColor,255,255,alpha);

  stroke(currentColor);
  fill(currentColor);

  ellipse(x[particleNum],y[particleNum],radius,radius);
  line(px[particleNum],py[particleNum],x[particleNum],y[particleNum]);


  px[particleNum] = x[particleNum];
  py[particleNum] = y[particleNum];

  y[particleNum]+= yIncrement[particleNum];
  x[particleNum]+= xIncrement[particleNum];

  if(x[particleNum] > width + 1 || x[particleNum] < 0){
    x[particleNum] -= 2*xIncrement[particleNum];
    xIncrement[particleNum]*=-1;
  }

  if( y[particleNum] > height + 1 || y[particleNum] < 0){
    y[particleNum] -= 2*yIncrement[particleNum];
    yIncrement[particleNum]*=-1;
  }

  //if(Arrays.binarySearch(x,x[particleNum]) >= 0 && Arrays.binarySearch(y,y[particleNum]) >= 0){
  //  xIncrement[particleNum]*=-1;
  //  yIncrement[particleNum]*=-1;
  //  print("*\n");
  //  stop();
  //} 

  print("x[0] = " + x[0] + "\n");
  print("x[1] = " + x[1] + "\n");
  print("y[0] = " + y[0] + "\n");
  print("y[1] = " + y[1] + "\n");
}

Answer 1

Stack Overflow isn't really designed for general "how do I do this" type questions. It's for specific "I tried X, expected Y, but got Z instead" type questions. But I'll try to help in a general sense:

You need to break your problem down into smaller pieces and then take those pieces on one at a time. Don't worry about the whole particle system. Make it work for a single particle. Do some research on collision detection.

Then if you get stuck, you can post a more specific question along with a MCVE. Good luck.