# Blend Mode - Poster Recreation

**URL:** <https://discourse.processing.org/t/blend-mode-poster-recreation/14403>\
**Category:** Coding Questions\
**Created:** [October 3, 2019, 7:24pm UTC](https://discourse.processing.org/t/blend-mode-poster-recreation/14403 "2019-10-03T19:24:57Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![tylerowens](https://avatars.discourse-cdn.com/v4/letter/t/ac8455/32.png) [@tylerowens](https://discourse.processing.org/u/tylerowens)\
**Post date:** [October 3, 2019, 7:24pm UTC](https://discourse.processing.org/t/blend-mode-poster-recreation/14403/1 "2019-10-03T19:24:57Z")

</div>

Hello all,

I have made a poster in adobe illustrator which I want to bring to life a little in processing.

 ![11%20PM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/f/fc5f46ec46cf2635d8bc0e6e24c74c76e818c255.png)

I want to be able to use the mouse to place circles onto the poster to sort of have a punching a hole through the black layer effect. My thinking was that I could have a white background, black text, and then a transparent black rectangle over the text… i would then have a circle at the mouse x & y location which will blend with the transparent rectangle to show the text.

```auto
  size(661,826);
  PFont a = createFont(("MonumentGrotesk-Regular"),50);
  String title = "it's yours";
  textFont(a);
  textSize(50);
  text(title,50,80);
}

void draw() {
  background(255);
  blendMode(DIFFERENCE);
  fill(0,90);
  rect(0,0,661,826);
  fill(0);
  ellipse(mouseX,mouseY,20,20);;
  //fill(255);
  //ellipse(mouseX,mouseY,20,20);
}

```

This is what I have so far to show my thought process however I wasnt really at all getting what i wanted to happen. Any help to send me in the right direction is appreciated.

Thank you

---

<div class="post-metadata">

**Author:** ![F53](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/f53/32/7118_2.png) [@F53](https://discourse.processing.org/u/F53)\
**Post date:** [October 4, 2019, 2:44am UTC](https://discourse.processing.org/t/blend-mode-poster-recreation/14403/2 "2019-10-04T02:44:33Z")

</div>

```auto
ArrayList<circle> cutouts;
void setup(){
  cutouts = new ArrayList<circle>();
  size(661,826);
}

void draw() {
  background(0);
  
  fill(255/2);
  ellipse(mouseX,mouseY,70,70);
  for (circle c: cutouts)
    c.show();
  
  String title = "it's yours";
  textSize(50);
  fill(0);
  text(title,50,80);
}

public class circle{
  float x, y;
  public circle(){
    x = mouseX;
    y = mouseY;
  }
  public void show(){
    fill(255);
    ellipse(x,y,70,70);
  }
}

void mouseReleased(){
  cutouts.add(new circle());
}

```

this creates the effect in the original _`reference poster`_, pretty well.

---

<div class="post-metadata">

**Author:** ![tylerowens](https://avatars.discourse-cdn.com/v4/letter/t/ac8455/32.png) [@tylerowens](https://discourse.processing.org/u/tylerowens)\
**Post date:** [October 4, 2019, 11:36pm UTC](https://discourse.processing.org/t/blend-mode-poster-recreation/14403/3 "2019-10-04T23:36:28Z")

</div>

Thank you! with a few adjustments i was able to get it to exactly what i wanted.

I am new to processing and dont have a background in any other coding languages so i was wondering if you could explain some of the syntax in your code…

i know of arrays with [] but i have never seen \< \>, whats that mean?

i also know of making classes, however i have never seen public class, what does “public” mean in this context?

 ![24%20PM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/d/d65982b99210370fe8c011c69a4e6b65d4d5dbd3.jpeg)  
 ![41%20PM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/8/8ffb5ecaacd617b0b4722682ee68d428d97000ff.jpeg)

---

<div class="post-metadata">

**Author:** ![F53](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/f53/32/7118_2.png) [@F53](https://discourse.processing.org/u/F53)\
**Post date:** [October 5, 2019, 12:08am UTC](https://discourse.processing.org/t/blend-mode-poster-recreation/14403/4 "2019-10-05T00:08:49Z")

</div>

An ArrayList\<\> is an array that has an automaticly changing size.  
When you declare one it has a size of 0, increasing with each .add()

It also has a lot of additional features, like sorting, removing and more.

Internally arrayLists are actually just arrays with extra methods handing everything for you.

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [October 5, 2019, 12:17am UTC](https://discourse.processing.org/t/blend-mode-poster-recreation/14403/5 "2019-10-05T00:17:55Z")

</div>

- [Forum.Processing.org/two/discussion/8080/why-use-arraylist-instead-of-array-with-append](http://Forum.Processing.org/two/discussion/8080/why-use-arraylist-instead-of-array-with-append)

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [October 6, 2019, 9:16pm UTC](https://discourse.processing.org/t/blend-mode-poster-recreation/14403/6 "2019-10-06T21:16:51Z")

</div>

> [@tylerowens](#):
>
> i also know of making classes, however i have never seen public class, what does “public” mean in this context?

From the reference:

> Keyword used to provide other classes access the fields and methods within a class. The `public` keyword is used before a field or method that you want to make available. **In Processing, all fields and methods are public unless otherwise specified by the `private` keyword.**
> 
> This keyword is **an essential part of Java programming and is not usually used with Processing**. Consult a Java language reference or tutorial for more information.
> 
> [public / Reference / Processing.org](https://processing.org/reference/public.html)

So – required in Java, does nothing (but doesn’t hurt anything) in Processing.

---

<div class="post-metadata">

**Author:** ![F53](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/f53/32/7118_2.png) [@F53](https://discourse.processing.org/u/F53)\
**Post date:** [October 7, 2019, 2:16pm UTC](https://discourse.processing.org/t/blend-mode-poster-recreation/14403/7 "2019-10-07T14:16:44Z")

</div>

Public isn’t required in processing?  
Thats new to me

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [October 7, 2019, 3:51pm UTC](https://discourse.processing.org/t/blend-mode-poster-recreation/14403/8 "2019-10-07T15:51:36Z")

</div>

> [@F53](#):
>
> Public isn’t required in processing?

It isn’t required in the Processing dialect, as written in .pde files and run from PDE or processing-java. This has been true since the first Processing in 2001.

If you browse through the [reference](https://processing.org/reference/), and [examples](https://processing.org/examples), for instance on on [objects](https://processing.org/tutorials/objects/) and [classes](https://processing.org/examples/objects.html), you will notice that none of them use `public`.

If you include a .java file in a Processing sketch, it must use valid Java syntax – then `public` is required in that file. Also, if you use Processing as a library in a Java applications – e.g. in Eclipse – then again `public` is required.

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [October 7, 2019, 3:58pm UTC](https://discourse.processing.org/t/blend-mode-poster-recreation/14403/9 "2019-10-07T15:58:21Z")

</div>

PDE’s pre-processor automatically prefixes all methods & fields within “.pde” files w/ `public` if they don’t have an access level already.

The exceptions are classes & interfaces.

Also, the pre-processor fails to prefix methods within anonymous instantiations w/ `public`, unless they happen at the global section of the sketch.