My Gui
Monkey Archive Forums/Monkey Projects/My Gui
| ||
| I've been porting my gui over from BlitzMax and so far I am very pleased with the results. This is the same gui system that I used in my game New Star Soccer 5 with a few changes to help with touch controls. So far it handles labels, buttons, progress bars, panels, drop-down lists and tables. It just needs a text edit box now, oh and some sound. :) It runs fine in GLFW but it's very slow in HTML5. DrawImageRect(image:Image,x#,y#,srcX,srcY,srcWidth,srcHeight,frame=0) scaling the gadget images seems to be the culprit. I've yet to test it in iOS/Android but hopefully it will run smoothly. Anyway, check out the HTML5 version and let me know what you think... http://www.newstargames.com/test/html5/MonkeyGame.html |
| ||
| This is looking really good! As you say I did get terrible fps in html5 even on chrome! Is debug mode on by any chance? |
| ||
| I just ran the Chrome profiler and it appears to be "DrawImageTinted" that's using most of the CPU -- I would guess it's SetColor causing the slowdown in HTML5. Looks great though. |
| ||
| It's release mode, unfortunately. If I swap the DrawImageRect command to simply DrawRect it gives a solid 60fps as you can see here: http://www.newstargames.com/test/test2/MonkeyGame.html |
| ||
| Using SetColor() for images in Monkey target for HTML slows way down, it's even in the monkey docs. Note: Drawing images in any color other than 255,255,255 on the HTML5 target will incur a major runtime overhead. For best results on the HTML5 target, either use colored imaged sparingly, or consider using 'pre-colored' images stored in multiple image files. |
| ||
| I managed to speed things up massively by reducing the size of the gadget images. I can reduce them further to get 60fps but that means losing too much definition on the curved edges. The other option is to just go with sharp rectangular gadgets, like so... http://www.newstargames.com/test/test3/MonkeyGame.html |
| ||
| Looks good. But how exactly are the curve edges actually slowing down the rendering? |
| ||
| To have a nice curve the pngs need to be quite large - if they're too small the curved edges go all fuzzy for large gadgets. With square buttons the png can be a quarter of the size and still look sharp. |
| ||
| Hi, I really like your GUI any plans to release a module for it? |
| ||
| The updated version is significantly faster on my PC (~50fps instead of ~6fps) I must say though, the interface is a bit confusing -- the vertical up and down arrows disappear and re-appear at odd times. They aren't showing at all initially, so you have no idea that there are more than 5 list items until you select one first. Worse, if you want to select the 5th option by clicking on it, it instead toggles to the 'down' arrow. You then need to click this same field a second time to make the 5th option scroll up a line so you can click a third time before it's actually selected. |
| ||
| Hi, I really like your GUI any plans to release a module for it? I might do, although I've no idea how you create a module at the moment. I might work on the things xlsior mentioned first. :) |
   |