Nifty GUI to display HTML? Possible?

Hi all,

Can Nifty GUI to display HTML?

Why? I want to use Nifty to display a lot of formatted Text and Picture, cause the library has too damn cool features.

This time I want to integrate CSS or just making simple CSS and HTML tag display in Nifty context.

This idea is in my mind for months and I still think about it every day.

I already seen a browser run in JME3. It’s not what I want. I want a pure HTML Boxes renderer, which can transform into Nifty 's element in no time.

Searching through the web :

Anyone need this or know a better approach?

Well, thanks to Tygron Nifty got basic HTML-support last year. It’s pretty limited in what it can do and there is no CSS support. But it works quite well. it takes simple HTML-elements and generates Nifty elements for them and adds them to a parent Element you provide.

You can find the documentation in the Nifty Wiki and the source at github Nifty-GUI HTML-Module

1 Like

@void256 :
Thank a lot, this is very nice indeed. it’s all I need for now. But as far as I remember you once mentioned your interests in doing Nifty’s layout the same as CSS does for HTML Elements. I have done some basic tests in CSSBox which it’s pretty raw but promising… We CAN read HTML, including the computed cascaded style sheet styles, and display in JME. I dont really has clear view of what this feature can come up? Just think it will be great :stuck_out_tongue:

indeed. When I started with Nifty I did some research into HTML/CSS parsers and renderers.

There was a project called xhtmlrenderer which I’ve used to actually display a website in OpenGL :slight_smile: The problem with xhtmlrenderer was that it didn’t allow any modification to the DOM-Tree at runtime so any dynamic changes like moving stuff around were not possible. I took a deep look into CSSBox at that time as well. Iirc I’ve spent some time with its code base but I can’t remember the exact problem I’ve run into. It looked promising at first but a lot of it’s code was kinda hard wired to AWT or so? So there was no clean interface to add a Nifty or OpenGL-renderer to it. And I remember the part that did the actual CSS layout and it was pretty, erm, complicated :slight_smile:

So in the end I’ve dropped the idea to use HTML/CSS as Niftys data structure and instead used the childLayout="" thing.

Looking at a modern browser and what you can do with javascript and CSS that idea still appeals to me. On the other hand CSS layout has a lot of cumbersome rules, exceptions and corner cases. Which might make sense if you need to layout a lot of text as you do in a browser most of the time but for a general GUI I’m not so sure. And doing a fully CSS compatible layout manager on your own is, well, IMHO actual quite involved :wink:

I don’t know if CSSBox can be used more easily now. If it’d fit our purpose a bit better I’d try it again probably. But at the moment I see HTML/CSS as an additional feature, like a special panel that can actually display HTML/CSS directly. That would be pretty cool indeed!

For a general GUI layout I’d stick with the layout managers Nifty already provides and add some new ones. JavaFX 2.0 has a pretty flexible Grid layout which works really well if you have some kind of form data like lots of input fields and label. It’s pretty easy to layout such things with it. So that would be something interesting to have available in Nifty as well :wink: … and it shouldn’t be that hard to fit into the current layout manager mechanism Nifty uses.

Yes, It still sticks with AWT. But it’s not that bad. The most valuable feature I considered in CSSBox is it compute CSS styles into Boxes Models, the integrating part is ours if we want to.
The layout system of Nifty now it’s very clean and nice, but with CSS, it opens a whole new posibilities of things can come up. OK, I will spend some time playing with it.

Recently, the ImagePainter let us paint into a texture. I’ve made a simple chart library out of it and display in Nifty Panel. Not sure where these fancy thing could go :stuck_out_tongue_winking_eye: , an additions for Nifty or a normal JME3 libs.

What about creating your own project for it on github then? :slight_smile:

And if you can understand CSSBox well enough to make any sense out of it I’d be eager to help in integrating it into Nifty! Maybe we can integrate it into the existing HTML module and make that more usable? That’d be pretty cool!