2D HUD in 3D game

Caramazula

Hello folks,

I started making my 2D game a 3D game and everything works fine so far, but there is one problem with the HUD. At first I draw all 3D stuff with this settings: camera(/* settings */); hint(ENABLE_DEPTH_TEST); and then I draw the 2D stuff with this settings: camera(); hint(DISABLE_DEPTH_TEST); the result looks like this: as you can see the font is very bloated. If I drawit without the camera(); option it looks like this: Very smooth but the HUD lies on the ground somewhere in the middle of the game. Can someone of you help me with this problem?

Chrisir

I do it like this

// demo for HUD
// http://en.wikipedia.org/wiki/Head-up_display

// PGraphics canvas;
float angle = 0;


void setup() {

  size(800, 800, P3D);

  // canvas = createGraphics(width, height, P3D);
}


void draw() {

  angle += 0.01;


  background(#000000);

  // 3D part --------------------------------------------- 
  noStroke();
  pointLight(255, 0, 25, mouseX, mouseY, 800);
  translate(width / 2, height / 2);
  rotate(angle, 1.0, 1.0, 0.5);
  box(width / 3);


// 2D part / HUD  ---------------------------------------------
  // image(canvas, 0, 0);
  camera();
  //  hint(DISABLE_DEPTH_MASK);
  hint(DISABLE_DEPTH_TEST);
  noLights();
  textMode(MODEL);
  text(frameRate, 10, 10 + textAscent());
  text(mouseX + ", " + mouseY, mouseX, mouseY);
  hint(ENABLE_DEPTH_TEST);
}
//

Chrisir

maybe this helps:

  noLights();
  textMode(MODEL);

amnon

I can suggest three options:

1. Take your first solution as a starting point and further tweak it through text settings: textFont, textSize, making sure that created and displayed font size are equal etc.

2. Use the P2D renderer for the main canvas. Draw your game world in a P3D PGraphics and display it as an image, then draw the 2D HUD elements on top.

3. Create (another) PGraphics that uses the JAVA2D renderer, draw the 2D HUD elements inside this PGraphics, then display the resulting image in the main canvas.

Chrisir

did you try OPENGL instead of P3D in size() ?

Chrisir

you could also make a version of your program that shows only a sphere and the HUD and post it, so we can take a look

please see also:

http://forum.processing.org/two/discussion/2533/p2d-over-p3d-into-p3d-sketch/p1

GoToLoop

Did you try OPENGL instead of P3D in size()?

In Processing 2+, it's the same as P3D! @-)

Chrisir

it just occured to me that when you use text in the 3D part, the text in the 2D part suddenly looks greasy / no sharp - I dunno why.

just change the text line in the 3D part with //

// demo for HUD
// the Hud-part must come after the 3D-part 
// http://en.wikipedia.org/wiki/Head-up_display

float angle = 0;

void setup() {
  size(800, 800, OPENGL );
  //     textMode(SHAPE);
}

void draw() {

  // 3D part ---------------------------------------------
  // textMode(SHAPE);
  background(#000000);
  hint(ENABLE_DEPTH_TEST); 
  // textMode(MODEL);
  noStroke();
  // lights();
  pointLight(255, 0, 25, mouseX, mouseY, 800);
  translate(width / 2, height / 2);
  rotate(angle, 1.0, 1.0, 0.5);
  box(width / 3);
  text ("Box", 0, height / 2); 
  angle += 0.01;

  // 2D part / HUD  ---------------------------------------------
  camera();
  //  hint(DISABLE_DEPTH_MASK);
  hint(DISABLE_DEPTH_TEST);
  noLights();
  textMode(MODEL);
  //  textMode(SHAPE);
  textSize(66);
  text("fps "+round(frameRate), 10, 10 + textAscent());
  text(mouseX + "," + mouseY, mouseX+7, mouseY-7);
  //
}
//

Caramazula

Thank you all for the quick replys! Everything works now and it even looks smooth. I draw all 3D stuff into a canvas and draw the 2D stuff on top of it. I also had to define serveral fonts for different sizes.

Chrisir

the game looks really cool

Chrisir

can anyone explain why I have that bug?

Is it a processing bug?

When I use text, the rest (the HUD) shouldn't change because of that...