Color Shuffle with hex color codes

Hi there,

Am trying to get colors in an array to shuffle, but having some trouble understanding how to adapt this code:

I want to create an array with the following hex color codes and have them shuffle whenever there’s a keyPressed()
{#FEF0D5, #D81E5B, #F35B68, #00BEB2, #1A5D63}

With Integers and Strings, this works but with Color[] or color[] this doesn’t work at all. How can I resolve this? Thanks!

//with INTEGERS
import java.util.*;

Integer[] array;
List<Integer> l;

void setup() {
  size(600,600);
  array = new Integer[]{1, 2, 3, 4};
  // Shuffle the elements in the array
  l = Arrays.asList(array);
  printArray("original order: " + l);
}

void draw() {
  background(0);
}

void keyPressed() {
  Collections.shuffle(l);
  printArray("new order:      " + l);

Replacing Integer with String:

//with STRINGS
import java.util.*;

String[] array;
List<String> l;

void setup() {
  size(600,600);
  array = new String[]{"one", "two", "three", "four"};
  // Shuffle the elements in the array
  l = Arrays.asList(array);
  printArray("original order: " + l);
}

void draw() {
  background(0);
}

void keyPressed() {
  Collections.shuffle(l);
  printArray("new order:      " + l);
}
1 Like

Can you please post the code you’re using to shuffle a color array?

It was just a substitute like this. I don’t really know what to do to access the hex color code eg: #FEF0D5
I know to convert integers to strings, etc but for color type am very confused.

Also there is a Color and color. One that starts with a capital letter ‘C’ and the other with the lower case ‘c’.
In java tutorials they seem to use ‘Color’ and in the processing reference it is ‘color’. However, both give errors.

//**with 'color'**
import java.util.*;

color[] array;
List<color> l;

void setup() {
  size(600,600);
  array = new color[]{#FEF0D5, #D81E5B, #F35B68, #00BEB2, #1A5D63};
  // Shuffle the elements in the array
  l = Arrays.asList(array);
  printArray("original order: " + l);
}

void draw() {
  background(0);
}

void keyPressed() {
  Collections.shuffle(l);
  printArray("new order:      " + l);
}
1 Like

Behind the scenes, color isn’t really a type. Processing automatically converts color values into int values. That’s why the color type doesn’t work with Java code: Java doesn’t know about this color to int magic.

To get your example working, you can use Integer values instead:

import java.util.*;

Integer[] array;
List<Integer> l;

void setup() {
  size(600,600);
  array = new Integer[]{#FEF0D5, #D81E5B, #F35B68, #00BEB2, #1A5D63};
  // Shuffle the elements in the array
  l = Arrays.asList(array);
  printArray("original order: " + l);
}

void draw() {
  color c = array[0];
  background(c);
}

void keyPressed() {
  Collections.shuffle(l);
  printArray("new order:      " + l);
}

Also notice the code inside the draw() function which treats the Integer value like a color. Processing knows that color values are really int values, so this will work.

By the way, the Color type (with an upper-case C) is a Java-specific class that you should (almost) never use in Processing.

2 Likes

@GoToLoop Please include an explanation when you post links.

Neither the primitive datatype color & its corresponding wrapper Color exist in the Java language! :zipper_mouth_face:

We should replace them w/ int & Integer when dealing w/ Java and its <generic> container types. :coffee:

1 Like

Thanks Kevin… this is really awesome!!

This line itself is a huge eye-opener for me. Have never used it like this… always new color[]{… ,…, …};

array = new Integer[]{#FEF0D5, #D81E5B, #F35B68, #00BEB2, #1A5D63};

Thank you for your explanation Kevin… it really cleared up a lot of concepts for me! Cheers! :slight_smile:

Thanks @GoToLoop the Color and color issue was making me see ‘red’. Pardon the pun :slight_smile:
Thanks so much for the assist. I did go through _vk’s explanations as well as how to create the custom Shuffle function. Quite cool! :slight_smile:

This is what I was able to adapt it to:

import java.util.*;

Integer[] array;
List<Integer> l;

void setup() {
  size(600, 600);
  array = new Integer[]{#FEF0D5, #D81E5B, #F35B68, #00BEB2, #1A5D63};
  // Shuffle the elements in the array
  l = Arrays.asList(array);
  printArray("original order: " + l);
}

void draw() {
  background(0);
  for (int i = 0; i < array.length; ++i) {
    color c = array[i];
    fill(c);
    ellipseMode(CENTER);
    ellipse(i*(width/array.length)+width/array.length/2, height/2, width/5, width/5);
  }
}

void keyPressed() {
  Collections.shuffle(l);
  printArray("new order:      " + l);
}

My final plan for this to to save color harmonies from Adobe’s Kuler site https://color.adobe.com/explore/?filter=most-popular&time=month

I don’t think they have the API anymore to connect directly. So I have to save this and use Adobe Illustrator to save out a .ase file. Then use a .jsx script to save .ase to .csv. Now onto loadTable() :slight_smile:

If there’s a better way, do let me know. Your inputs are most valued. Thank you once again!

1 Like

The better & more performant way is to rely on IntList instead, as I had already linked to at my 1st reply: :wink:
https://Processing.org/reference/IntList.html

You’ll have access to better methods, such as shuffle() & array(): :muscle:

  1. https://Processing.org/reference/IntList_shuffle_.html
  2. https://Processing.org/reference/IntList_array_.html
1 Like

Yes… this is quite helpful! :grinning: