Jump to content
  • Advertisement
Sign in to follow this  

interactive ui on the gpu

This topic is 2175 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

Hey all,


Just after some idea's really regarding ui rendering on the GPU. Specifically, methods/ideas to keep draw calls batched while being interactive.


The problem:

A batch of say 20 items in a list, all grouped in one draw call. What are my options for interactivity, say rollover effects.

Let us say for example 1 texture will be shown in the normal state and when selected or interacted with, another texture is displayed.


Hear are my current thoughs:

Just render the offending item again on top of itself ignoring depth.

   This would add only one draw call and would allow for alpha based transitions,

   It may lead to issues if the over state were smaller than the original though.

Somehow stencil/mask out the old item then redraw the new one:

    I guess this would add 2 draw calls but the original item would be completely hidden.

    No way to transition though?

Lerp between the 2 textures (1 texture atlas) for every item and update constants to drive the distinction between the 2 textures:

    All still done in 1 draw call and could animate the lerp float on the cpu no probs. 

    This would waste a texture read most of the time but probably not a performance issue at all, 128 constants allowed so it would limit the list size.



Right, so that was might thinking of the top of my head, now smash me with better ideas of brilliance!!! (or just critique the ideas I had above)

I am looking for the right balance of flexibility and performance. Never really done UI stuff on the GPU so don't be angry if I am approaching this like drunk 6 year old!




In summary, how to draw interactive UI efficiently on the GPU assuming a shader model 2 environment?

Thanks for your time!

Share this post

Link to post
Share on other sites

Making a couple extra draw calls isn't going to kill your performance.  Making a couple hundred unneeded draw calls will have an impact, so if you only need to manage a few, then it should be fine.  If you want to have a batched rendering of the UI, I would follow the method that you indicated for alpha blending the new texture over the old one in a follow up draw call.  That would work until the transition is complete, when you would then just update your batch render to indicate the new texture (and make the second draw call unneeded).


Really it would be best to get an implementation up and running, then see what you like about it or don't like about it.  Then you can make updates accordingly, and learn about what's important and what isn't along the way.

Share this post

Link to post
Share on other sites

For me, 3d approach looks good. One or two extra texure reads cost nothing. Especially on desktop.

P.S. I'm also trying to implement GUI for my needs in stage3d. And I've chosen fully programmatic approach, i.e. all skins are drawing runtime in shader.

Share this post

Link to post
Share on other sites
Sign in to follow this  

  • Advertisement

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

GameDev.net is your game development community. Create an account for your GameDev Portfolio and participate in the largest developer community in the games industry.

Sign me up!