Glowing ellipse

Processing for Android
1

ads
Screenshot_2019-10-02-14-40-56-130_processing.test.ads.png2160×1080 40.1 KB

This is how my sketch (game)looks like.How can i make the ellipse glow and look more appealing?
I tried blendmode and understood that doesn’t fit in the game because
1.It takes input as pixels
2.frame rate drops
3.hard to integrate with my sketch.
Any suggestions/ideas?

2

You could use a PGraphics to draw a custom ellipse and use that.
One way to achieve a glow-like effect is to draw a few ellipses with different diameter on top of each other. When the outer ellipses are semi-transparent, it looks a little bit like “glowing”.

PGraphics glowingEllipse;

void setup() {
  size(400, 400);
  glowingEllipse = createGraphics(40, 40);
  glowingEllipse.beginDraw();
  glowingEllipse.noStroke();
  for (int i =0; i< 10; i++) {
    glowingEllipse.fill(0, 255, 0, 1+10*i);
    glowingEllipse.ellipse(20, 20, 40-3*i, 40-3*i);
  }
  glowingEllipse.endDraw();
}

void draw() {
  background(0);
  image(glowingEllipse, mouseX-20, mouseY-20);
}
2 Likes
3

I have a fade effect as u can see the ellipse…ive drawn a rect instead of background (0) to get that affect.
Acc to my knowledge, with pgraphics we cannot create such things!?

4

Did you try?

Just replace the background(0) in the example above with these lines:

  fill(0, 20);
  rect(0,0,width, height);
1 Like
5

Hi @Yash,

The PostFX library has bloom filter for a glowing effect.

Below an example with a moderate bloom intensity: fx.render().bloom(0.5, 100, 4).compose();

ss211%20(2)
ss211 (2).png958×544 289 KB

4 Likes
6

Hello!

I’ve been trying to create something like this, and it doesn’t work.

Can you please send source? Thanks!

7

fx_bloom_example
fx_bloom_example.png1773×970 97.1 KB

please study that picture, you see

  • install library
  • find example
  • run it
  • find the bloom code line
2 Likes
8

i got this error after importing library and running built in example.

Blockquote
AndroidDevice: cannot find process id, console output will be disabled.
FATAL EXCEPTION: GLThread 2989
Process: processing.test.advancedeffect, PID: 32190
java.lang.NoSuchMethodError: No virtual method sketchPath()Ljava/lang/String; in class Lprocessing/core/PApplet; or its super classes (declaration of ‘processing.core.PApplet’ appears in /data/app/processing.test.advancedeffect-xaDK0dN4P43-YxRJ3b7j9Q==/base.apk)
at ch.bildspur.postfx.pass.BasePass.getLibPath(BasePass.java:79)
at ch.bildspur.postfx.pass.BasePass.(BasePass.java:21)
at ch.bildspur.postfx.pass.BrightPass.(BrightPass.java:19)
at processing.test.advancedeffect.AdvancedEffect.setup(AdvancedEffect.java:45)
at processing.core.PApplet.handleDraw(PApplet.java:1838)
at processing.opengl.PSurfaceGLES$RendererGLES.onDrawFrame(PSurfaceGLES.java:264)
at android.opengl.GLSurfaceView$GLThread.guardedRun(GLSurfaceView.java:1571)
at android.opengl.GLSurfaceView$GLThread.run(GLSurfaceView.java:1270)
AndroidDevice: cannot find process id, console output will be disabled.
FATAL EXCEPTION: GLThread 3031
Process: processing.test.advancedeffect, PID: 32528
java.lang.NoSuchMethodError: No virtual method sketchPath()Ljava/lang/String; in class Lprocessing/core/PApplet; or its super classes (declaration of ‘processing.core.PApplet’ appears in /data/app/processing.test.advancedeffect-xaDK0dN4P43-YxRJ3b7j9Q==/base.apk)
at ch.bildspur.postfx.pass.BasePass.getLibPath(BasePass.java:79)
at ch.bildspur.postfx.pass.BasePass.(BasePass.java:21)
at ch.bildspur.postfx.pass.BrightPass.(BrightPass.java:19)
at processing.test.advancedeffect.AdvancedEffect.setup(AdvancedEffect.java:45)
at processing.core.PApplet.handleDraw(PApplet.java:1838)
at processing.opengl.PSurfaceGLES$RendererGLES.onDrawFrame(PSurfaceGLES.java:264)
at android.opengl.GLSurfaceView$GLThread.guardedRun(GLSurfaceView.java:1571)
at android.opengl.GLSurfaceView$GLThread.run(GLSurfaceView.java:1270)

type or paste code here
9

did you run the example like i did? does it work?

about android can not help ( but it is not in your topic header )

10

Ive built it for android.so these methods doesn’t work in android :confused:?

11

Does postfx doesn’t work with android?

12

@Yash === no, it does not.

13

:sleepy:…sad…

14

So is it impossible to create such effect in processing android?

15

You could use Gradient drawables in android but why not using p5 it self?
For instance using a blur filter.

PGraphics pg;
int size;
color c;

void setup() {
    background(0);
    size(300, 300);
    noStroke();
    imageMode(CENTER);
    size = 160;
    c = color(0, 0, 255);
    drawCircle();
    image(pg, 100, 100);
    size = 100;
    c = color(0, 255, 0);
    drawCircle();
    image(pg, 200, 200);
    size = 75;
    c = color(255, 255, 0);
    drawCircle();
    image(pg, 120, 230);
}

void drawCircle() {
    pg = createGraphics(200, 200);
    pg.beginDraw();
    pg.fill(c);
    pg.noStroke();
    pg.ellipse(100, 100, size, size);
    pg.filter(BLUR, 10);
    pg.endDraw();    
}