# G4P text is blurred without background()

**URL:** <https://discourse.processing.org/t/g4p-text-is-blurred-without-background/11489>\
**Category:** Libraries\
**Created:** [May 22, 2019, 10:07am UTC](https://discourse.processing.org/t/g4p-text-is-blurred-without-background/11489 "2019-05-22T10:07:33Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![gyula](https://avatars.discourse-cdn.com/v4/letter/g/ccd318/32.png) [@gyula](https://discourse.processing.org/u/gyula)\
**Post date:** [May 22, 2019, 10:07am UTC](https://discourse.processing.org/t/g4p-text-is-blurred-without-background/11489/1 "2019-05-22T10:07:33Z")

</div>

Using Processing 3.5.3 and G4P V4.2.1 on Windows 7.

Why does G4P control text get blurred when not clearing the display window at the beginning of each frame?  
 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/2/283dc42d4f99e0ef4935893d11621e060dbd5143.png) vs. ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/7/7608234d130fb95d8f9c48f018c9b1a689051e2d.png)

Here’s a simple example:

```auto
import g4p_controls.*;

boolean bgIsSelected = false; 
GCheckbox cb1; 

void setup() {
  createCheckboxGUI();
}

void draw() {
  if (bgIsSelected) background(200);
}

void createCheckboxGUI() {
  cb1 = new GCheckbox(this, 5, 40, 100, 20);
  cb1.setText("Background");
  cb1.addEventHandler(this, "cb1_clicked1");
}

void cb1_clicked1(GCheckbox source, GEvent event) {
  bgIsSelected = !bgIsSelected; // toggle signal
}

```

Thanks.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [May 22, 2019, 10:53am UTC](https://discourse.processing.org/t/g4p-text-is-blurred-without-background/11489/2 "2019-05-22T10:53:24Z")

</div>

It’s usual in processing, not to do with g4p

---

<div class="post-metadata">

**Author:** ![gyula](https://avatars.discourse-cdn.com/v4/letter/g/ccd318/32.png) [@gyula](https://discourse.processing.org/u/gyula)\
**Post date:** [May 22, 2019, 11:39am UTC](https://discourse.processing.org/t/g4p-text-is-blurred-without-background/11489/3 "2019-05-22T11:39:08Z")

</div>

> [@Chrisir](#):
>
> It’s usual in processing, not to do with g4p

How very true. Thank you!

To demonstrate the phenomenon, I added two lines to my original code and got this:  
 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/f/fb0d0c971e87170dc8c5ec069d9bcc54c08a2268.png) vs. ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/2/294eef9faba9deb56522b0f061fdcfa9661952f8.png)

Here’s the code:

```auto
import g4p_controls.*;

boolean bgIsSelected = false; 
GCheckbox cb1; 

void setup() {
  fill(0, 0, 255); // added
  createCheckboxGUI();
}

void draw() {
  if (bgIsSelected) background(200);
  text("text()", 10, 80); // added
}

void createCheckboxGUI() {
  cb1 = new GCheckbox(this, 5, 40, 100, 20);
  cb1.setText("Background");
  cb1.addEventHandler(this, "cb1_clicked1");
}

void cb1_clicked1(GCheckbox source, GEvent event) {
  bgIsSelected = !bgIsSelected; // toggle signal
}

```

---

<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:** [May 24, 2019, 2:41pm UTC](https://discourse.processing.org/t/g4p-text-is-blurred-without-background/11489/4 "2019-05-24T14:41:23Z")

</div>

Unless I’m misunderstanding, this has nothing to do with G4P. This is true of all text (and all antialiased images, which characters are) in Processing.

If you don’t clear the background, then anything with a soft edge will compound over multiple frame draws, blooming out and developing crackly edges.

Try it:

```auto
void setup(){
  background(0);
  frameRate(5);
}
void draw(){
  // background(0); // enable to fix 
  text("abcdefghijklmnopqrstuvwxyz", 5, 10, 80, 100);
}

```

---

<div class="post-metadata">

**Author:** ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)\
**Post date:** [May 24, 2019, 7:47pm UTC](https://discourse.processing.org/t/g4p-text-is-blurred-without-background/11489/5 "2019-05-24T19:47:56Z")

</div>

Both @Chrisir and @jeremydouglass are correct in that G4P expects the use of `background()` inside the `draw()` method and that repeated antialiasing will blur soft edges.

For G4P there is a possible solution but it might not give you the visual appearance you are looking for. If you have a G4P control then you can make its background opaque with  
`control.setOpaque(true)`

This will work for all visible G4P controls. The reason for this is that all visual G4P controls use an offsreen buffer for its graphics, this buffer normally has a transparent background but using the statement above the buffer background is a solid colour. The buffer is copied to the screen every frame overwriting the previous one.