3d-Model over the Gui

Hello,

is it possible to render a 3d-Model over the Gui (for inventar, character-image etc)?

Why use 3D models? Why not use simple images of a 3D model instead.



I’m not saying you shouldn’t do it, just wondering why a 3D model.

@madjack : It seems like he want to say “character-image” = "character avartar - a 3d animated one "

@atomix

I know but as I said, I’m wondering why. The engine can do multiple viewports, that’s not a problem, but if he wants to put a 3D inventory item for EACH item plus the character, that’ll make a LOT of viewports and performance will be abysmal.



Then again, maybe I’m misunderstanding things.

i maybe being naive, but could he not just add the 3d model directly to the guiNode?

I guess scaling would work.



I understand the interest to have the character model showing, but the whole inventory? I’m not against it mind you, I actually think it would be pretty nice. But ask yourself if this is really needed. Besides, I don’t know many games that implement such a thing. It’s always a matter of rendering power.



Of course if the inventory consist of 3-4 items, it shouldn’t be a big deal.

@madjack:

IMO I like the idea of 3D inventory



3D inventory item for EACH item plus the character <= no, not really , just the selected one but it must be on the GUI node …



@wezrule: I really think it’s impossible( 3D in GuiNode) :stuck_out_tongue:

1 Like

@atomix apparently it is possible http://hub.jmonkeyengine.org/groups/gui/forum/topic/attach-mesh-to-guinode/, i had a go at it, but couldn’t get it to work, but i guess the orthographic nature might inversely affect its appearance anyways, i’m not sure. So it appears that additional viewports are the way to go, at least i know because i also require a similar effect :P, thx for the info guys.

atomix said:
@madjack:
IMO I like the idea of 3D inventory

Honestly I'd love to see that. IIRC Dead Space do this or similar.

wezrule said:
So it appears that additional viewports are the way to go, at least i know because i also require a similar effect :P, thx for the info guys.

I use two additional viewports to render previews of suns and planets in my game. I know it's possible. The only thing is, for now, post processes on additional viewports is broken at the moment. Doing it anyway will yield weird results. I made a thread not that long ago about that with a test case.

ahh, ok lucky i didn’t plan to use post processes on my extra viewport, but thx for the warning, much appreciated

wezrule said:
ahh, ok lucky i didn't plan to use post processes on my extra viewport, but thx for the warning, much appreciated

I would suggest you do it anyway to prepare things out so that it'll be working as intended when it's fixed. The most glaring issue is when you try to move the viewport around to different coordinates it won't work. Those new coordinates will only be applied after the viewport is reenabled. I'm not entirely sure which way it is but just search the forums all the info is there.

@wezrule:

Oh, I already read the topic you link. I just think It’s much better use:



a real 3D Node attached to

a viewport which have

an “unmove” cam (perspective one).



It fits the situation that the question’s owner talking about!

1 Like

@madjack

ah, thx again for info :], im gonna test out using an additional viewport now



@atomix

agreed

wezrule said:
i maybe being naive, but could he not just add the 3d model directly to the guiNode?

That was what I want, I hoped there would be some nifty-gui function.
madjack said:
Why use 3D models? Why not use simple images of a 3D model instead.
I'm not saying you shouldn't do it, just wondering why a 3D model.

I want to inform me about the possibilities. (Only Icons/Images, Rotating, Animations etc.)
Thanks for the answers I tried it out, but how can I hide the model in the main-viewport? (ok, I forgot the geom.updateLogicalState(tpf);
geom.updateGeometricState(); )
And i there a possibilty to use only one viewport for all items? (setViewPort(0.0f, 1.0f, 0, 1.0f);) But how do I get the needed positions of the meshes?
mainclain said:
That was what I want, I hoped there would be some nifty-gui function.

Nifty doesn't do that kind of thing. Only the engine can do this.


Thanks for the answers I tried it out, but how can I hide the model in the main-viewport?

What do you mean?


And i there a possibilty to use only one viewport for all items? (setViewPort(0.0f, 1.0f, 0, 1.0f);) But how do I get the needed positions of the meshes?

Using setViewport(...) like you wrote above would take the whole screen. As for the mesh location, that's a trial and error thing. Since additional viewports are generated at the same size of the main screen (then squeezed to its proper size), having many viewports will kill your FPS (just remember that). What you can do is make a scene with the preview the normal way and move the camera around until the model is where you want it (remember to place the model at 0, 0, 0). Once you've found the perfect framing, hit C and that should dump the camera's coordinates on the console.

That should get you started.

Okay thank you, I will think about it :stuck_out_tongue:

madjack said:
What do you mean?

It's okay. I attached the Node to the rootNode. I had to remove that and to use
geom.updateLogicalState(tpf);
geom.updateGeometricState();
for that :D

@mainclain

Here is the code for the method “render-to-texture” 3D Scene then display in NiftyImage :



It’s a modified TestNiftyGui.java in JMETests



[java]

package jme3test.niftygui;



import com.jme3.app.SimpleApplication;

import com.jme3.asset.DesktopAssetManager;

import com.jme3.asset.TextureKey;

import com.jme3.material.Material;

import com.jme3.math.Vector3f;

import com.jme3.niftygui.NiftyJmeDisplay;

import com.jme3.renderer.Camera;

import com.jme3.scene.Geometry;

import com.jme3.scene.shape.Box;

import com.jme3.texture.Texture;

import de.lessvoid.nifty.Nifty;

import de.lessvoid.nifty.elements.Element;

import de.lessvoid.nifty.elements.render.ElementRenderer;

import de.lessvoid.nifty.elements.render.ImageRenderer;

import de.lessvoid.nifty.render.NiftyImage;

import de.lessvoid.nifty.screen.Screen;

import de.lessvoid.nifty.screen.ScreenController;

import java.net.URL;



public class TestNiftyGui extends SimpleApplication implements ScreenController {



private Nifty nifty;



public static void main(String[] args) {

TestNiftyGui app = new TestNiftyGui();

app.setPauseOnLostFocus(false);

app.start();

}

private ScreenCaptureHelper helper;

private ImageRenderer imageRenderer;



public void simpleInitApp() {

Box b = new Box(Vector3f.ZERO, 1, 1, 1);

Geometry geom = new Geometry(“Box”, b);

Material mat = new Material(assetManager, “Common/MatDefs/Misc/Unshaded.j3md”);

mat.setTexture(“ColorMap”, assetManager.loadTexture(“Interface/Logo/Monkey.jpg”));

geom.setMaterial(mat);

rootNode.attachChild(geom);



NiftyJmeDisplay niftyDisplay = new NiftyJmeDisplay(assetManager,

inputManager,

audioRenderer,

guiViewPort);

nifty = niftyDisplay.getNifty();

nifty.fromXml(“jme3test/niftygui/HelloJme_1.xml”, “start”, this);



// attach the nifty display to the gui view port as a processor

guiViewPort.addProcessor(niftyDisplay);



// disable the fly cam

// flyCam.setEnabled(false);

flyCam.setDragToRotate(true);

Camera cam2 = cam.clone();

cam2.setLocation(new Vector3f(10f, 10f, 10f));

cam2.lookAt(geom.getWorldTranslation(), Vector3f.UNIT_X);

helper = new ScreenCaptureHelper(cam, geom, renderManager);

imageRenderer = getRenderer(ImageRenderer.class, “start/windows/window1/image1”);

}



@Override

public void simpleUpdate(float tpf) {

helper.captureScreen();

setNiftyImage(helper.getTexture(),“Texture1”,imageRenderer);



}



void setNiftyImage(Texture tex, String textureName, ImageRenderer iR) {



((DesktopAssetManager) assetManager).addToCache(new TextureKey(“pippo”), tex);

NiftyImage img = nifty.getRenderEngine().createImage(“pippo”, false);

iR.setImage(img);



}



public void bind(Nifty nifty, Screen screen) {

System.out.println(“bind( " + screen.getScreenId() + “)”);

}



public void onStartScreen() {

System.out.println(“onStartScreen”);

}



public void onEndScreen() {

System.out.println(“onEndScreen”);

}



public void quit() {

nifty.gotoScreen(“end”);

}



public <T extends ElementRenderer> T getRenderer(Class<T> aClass, String path)

throws IllegalArgumentException {

String[] array = path.split(”/");



if (array.length < 2) {

throw (new IllegalArgumentException(" This path is wrong : " + path));

}

Element thisElement, parent;

Screen thisScene = nifty.getScreen(array[0]);

thisElement = thisScene.findElementByName(array[1]);



for (int i = 1; i < array.length; i++) {

String thisName = array;

parent = thisElement;

thisElement = parent.findElementByName(thisName);

}

return thisElement.getRenderer(aClass);

}

}

[/java]



ScreenCaptureHelper.java from Snippet

[java]

package jme3test.niftygui;



import com.jme3.renderer.Camera;

import com.jme3.renderer.RenderManager;

import com.jme3.renderer.ViewPort;

import com.jme3.scene.Spatial;

import com.jme3.texture.FrameBuffer;

import com.jme3.texture.Image;

import com.jme3.texture.Texture;

import com.jme3.texture.Texture2D;

public class ScreenCaptureHelper {

private ViewPort offScreenView;

private Texture2D texture;

private Camera mainCamera;

private Spatial scene;

private RenderManager renderManager;

public ScreenCaptureHelper(Camera mainCamera, Spatial scene, RenderManager renderManager) {

this.mainCamera = mainCamera;

this.scene = scene;

this.renderManager = renderManager;

offScreenView = new ViewPort(“Offscreen View”, mainCamera.clone());

offScreenView.setClearColor(true);

texture = new Texture2D(mainCamera.getWidth(), mainCamera.getHeight(), Image.Format.RGB8);

texture.setMinFilter(Texture.MinFilter.Trilinear);

FrameBuffer offScreenBuffer = new FrameBuffer(mainCamera.getWidth(), mainCamera.getHeight(), 0);

offScreenBuffer.setDepthBuffer(Image.Format.Depth);

offScreenBuffer.setColorTexture(texture);

offScreenView.setOutputFrameBuffer(offScreenBuffer);

offScreenView.attachScene(this.scene);

}

/**

  • Captured data will be available in {@link #getTexture()} and can be applied to Picture.
  • Other ways of using derived texture may result unexpected behavior

    */

    public void captureScreen() {

    offScreenView.getCamera().setLocation(mainCamera.getLocation());

    offScreenView.getCamera().setRotation(mainCamera.getRotation());

    scene.updateGeometricState();

    renderManager.renderViewPort(offScreenView, 0);

    }

    public Texture2D getTexture() {

    return texture;

    }

    }

    [/java]

    HelloJME_1.xml



    [xml]<?xml version=“1.0” encoding=“UTF-8”?>

    <nifty xmlns=“http://nifty-gui.sourceforge.net/nifty.xsd” xmlns:xsi=“http://www.w3.org/2001/XMLSchema-instance” xsi:schemaLocation=“http://nifty-gui.sourceforge.net/nifty.xsd http://nifty-gui.sourceforge.net/nifty.xsd”>

    <useStyles filename=“nifty-default-styles.xml” />

    <useControls filename=“nifty-default-controls.xml” />

    <screen id=“start” controller=“jme3test.niftygui.TestNiftyGui”>

    <layer id=“windows” childLayout=“absolute”>

    <control id=“window1” name=“window” title=“Please Drag Me Too!” width=“500px” height=“400px” x=“400px”>

    <image id=“image1” height=“100px” width=“100px” align=“center” valign=“center” >

    </image>

    </control>

    </layer>

    </screen>

    <screen id=“end”>

    </screen>

    </nifty>

    [/xml]



    Give it a run, here I got a weird result, and if you know how to fix, tell me, I’m glad to know!!

I doubt that the ScreenCapture code got some issues when duplicate the screen’s Camera … I will try to it figure out!

Okay thank you :slight_smile: How does your result looks like?

I had to change some points but get this after it:

Did you try to move the camera around … ??



It’s kind of weird thing happens in my test, look like Z-Fight… Here is the screen shot :



http://farm7.static.flickr.com/6132/6002724066_20534dacf9_z.jpg