program Layers and nodes

Started by
2 comments, last by Scourage 13 years, 2 months ago
Hi

I'm new at this. I would like to know how to program Layers and nodes. For instance If I have an OpenGL application I would like to have different layers with graphics on top.
This way I can easily manipulate the whole layer making all the graphics on that layer affected by my commands.

Look at photoshop or other graphics programs. They work with layers.

I think it's called 2 1/2-D graphics programming.

Are there any good tutorials, books or info on this topic?

Please guide me in the right direction

Thanks
Advertisement
The term "layers" in not totally clear...

... For instance If I have an OpenGL application I would like to have different layers with graphics on top...

This sounds like graphical overlays. E.g. there is a background rendering showing the street, visible through the windows of a car, in front of which a rear-view mirror is mounted. This can be realized by compositing: A layer S (showing the car chassis from the inside and having partial transparency / translucency for the windows) is blended with the full opaque background layer B (showing the street), using the transparency information of the former layer:
B' := a * S + ( 1 - a ) * B
A layer with the rear-view will be composed on the former result using the same mechanism.

This is called source-alpha blending. OpenGL supports this. You can either render each layer for itself into its own FBO and compose the FBOs, or do the compose during rendering the objects of each layer directly.


...This way I can easily manipulate the whole layer making all the graphics on that layer affected by my commands...

This may mean that you want to render the objects belonging to a particular layer, then apply some image processing to the entire layer, and then use it for compositing. If so, then you simply have to render the objects into a separate FBO, as mentioned above. On the other hand, it may also mean to manipulate the objects that are rendered into a particular layer. In this case, "layer" may be a mechanism of grouping objects for the purpose of applying the same command to each one (e.g. the object layers of blender).


Look at photoshop or other graphics programs. They work with layers.

AFAIK Photoshop handles both possibilities in 1 mechanism, what may or may not be what you want.


I think it's called 2 1/2-D graphics programming.

IMHO, 2.5D means that depth is simulated in a 2D solution. E.g. a background image showing a room interior in isometric projection, and a sprite that is shifted in the area of the room's floor, can be used to let the sprite look like moving in 3 directions. Parallax scrolling of background images also gives some illusion of depth, although the avatar still is moved (and looks like so) in 2D only; don't know whether this also counts to 2.5D. However, all these techniques can be implemented using compositing of graphical layers.


Are there any good tutorials, books or info on this topic?

For sure. Use the keywords from above, and you'll find stuff here in the forums as well as in any search engine. I personally have no good source at hand.


But, what do you exactly mean with "nodes"?
Thanks so much for the fast reply.

My problem is that I don't know exactly what to call this kind of feature. What I really want to do is to render stuff on the screen with OpenGL. In the middle of the screen on top of the other graphics stuff I should be able to have a list that I can scroll horizontally. I don't really know exactly how to do this??

With node I was thinking of building something with node trees. To be honest I don't know how to create the above feature. If you have any suggestions please help.

I would like to have some kind of simple UI library, that I can use to add Lists, text etc.





The term "layers" in not totally clear...
[quote name='Hachaso77' timestamp='1297855239' post='4774917']
... For instance If I have an OpenGL application I would like to have different layers with graphics on top...

This sounds like graphical overlays. E.g. there is a background rendering showing the street, visible through the windows of a car, in front of which a rear-view mirror is mounted. This can be realized by compositing: A layer S (showing the car chassis from the inside and having partial transparency / translucency for the windows) is blended with the full opaque background layer B (showing the street), using the transparency information of the former layer:
B' := a * S + ( 1 - a ) * B
A layer with the rear-view will be composed on the former result using the same mechanism.

This is called source-alpha blending. OpenGL supports this. You can either render each layer for itself into its own FBO and compose the FBOs, or do the compose during rendering the objects of each layer directly.


...This way I can easily manipulate the whole layer making all the graphics on that layer affected by my commands...

This may mean that you want to render the objects belonging to a particular layer, then apply some image processing to the entire layer, and then use it for compositing. If so, then you simply have to render the objects into a separate FBO, as mentioned above. On the other hand, it may also mean to manipulate the objects that are rendered into a particular layer. In this case, "layer" may be a mechanism of grouping objects for the purpose of applying the same command to each one (e.g. the object layers of blender).


Look at photoshop or other graphics programs. They work with layers.

AFAIK Photoshop handles both possibilities in 1 mechanism, what may or may not be what you want.


I think it's called 2 1/2-D graphics programming.

IMHO, 2.5D means that depth is simulated in a 2D solution. E.g. a background image showing a room interior in isometric projection, and a sprite that is shifted in the area of the room's floor, can be used to let the sprite look like moving in 3 directions. Parallax scrolling of background images also gives some illusion of depth, although the avatar still is moved (and looks like so) in 2D only; don't know whether this also counts to 2.5D. However, all these techniques can be implemented using compositing of graphical layers.


Are there any good tutorials, books or info on this topic?

For sure. Use the keywords from above, and you'll find stuff here in the forums as well as in any search engine. I personally have no good source at hand.


But, what do you exactly mean with "nodes"?
[/quote]

Thanks so much for the fast reply.

My problem is that I don't know exactly what to call this kind of feature. What I really want to do is to render stuff on the screen with OpenGL. In the middle of the screen on top of the other graphics stuff I should be able to have a list that I can scroll horizontally. I don't really know exactly how to do this??

With node I was thinking of building something with node trees. To be honest I don't know how to create the above feature. If you have any suggestions please help.

I would like to have some kind of simple UI library, that I can use to add Lists, text etc.




[quote name='haegarr' timestamp='1297859671' post='4774930']
The term "layers" in not totally clear...
[quote name='Hachaso77' timestamp='1297855239' post='4774917']
... For instance If I have an OpenGL application I would like to have different layers with graphics on top...

This sounds like graphical overlays. E.g. there is a background rendering showing the street, visible through the windows of a car, in front of which a rear-view mirror is mounted. This can be realized by compositing: A layer S (showing the car chassis from the inside and having partial transparency / translucency for the windows) is blended with the full opaque background layer B (showing the street), using the transparency information of the former layer:
B' := a * S + ( 1 - a ) * B
A layer with the rear-view will be composed on the former result using the same mechanism.

This is called source-alpha blending. OpenGL supports this. You can either render each layer for itself into its own FBO and compose the FBOs, or do the compose during rendering the objects of each layer directly.


...This way I can easily manipulate the whole layer making all the graphics on that layer affected by my commands...

This may mean that you want to render the objects belonging to a particular layer, then apply some image processing to the entire layer, and then use it for compositing. If so, then you simply have to render the objects into a separate FBO, as mentioned above. On the other hand, it may also mean to manipulate the objects that are rendered into a particular layer. In this case, "layer" may be a mechanism of grouping objects for the purpose of applying the same command to each one (e.g. the object layers of blender).


Look at photoshop or other graphics programs. They work with layers.

AFAIK Photoshop handles both possibilities in 1 mechanism, what may or may not be what you want.


I think it's called 2 1/2-D graphics programming.

IMHO, 2.5D means that depth is simulated in a 2D solution. E.g. a background image showing a room interior in isometric projection, and a sprite that is shifted in the area of the room's floor, can be used to let the sprite look like moving in 3 directions. Parallax scrolling of background images also gives some illusion of depth, although the avatar still is moved (and looks like so) in 2D only; don't know whether this also counts to 2.5D. However, all these techniques can be implemented using compositing of graphical layers.


Are there any good tutorials, books or info on this topic?

For sure. Use the keywords from above, and you'll find stuff here in the forums as well as in any search engine. I personally have no good source at hand.


But, what do you exactly mean with "nodes"?
[/quote]
[/quote]

So this is actually how I designed my GUI. I have a Layer class which holds a bunch of widgets. Widgets can handle events, render themselves and have child or sibling wigets. The GUI object owns a list of Layers. The layers are kept in a list, which is the order that they are to be presented. Rendering is done from bottom to top (or in order) and event processing is processed from top to bottom (or reverse order). Seems to work well for my simple GUIs.

Cheers,

Bob

[size="3"]Halfway down the trail to Hell...

This topic is closed to new replies.

Advertisement