Ever wanted to display XHTML content in JME? Well, now you can! The following is a TonegodGUI renderer for Flying Saucer, a pure java XML/XHTML+CSS 2.1 engine.
The core class is the TGXHTMLRenderer. This is a TonegodGUI “Element” and so is treated the same as all other controls. Some key features …
- Styles XML/XHTML content.
- Fairly complete CSS 2.1 compliance.
- ALMOST no AWT involved (apart from image loading and scaling).
- Based on ScrollPanel, AnimText and the core Flying Saucer library.
- Intercept links.
- Intercept form submissions.
- Abstracted “User Agent”. Loaded stuff from the net, the classpath, whereever.
- Use as either a traditional browser type panel with a background, or remove the background and overlay XHTML on your scene.
It is not …
- Able to render any old web page, it needs to be fully compliant XHTML, so you really need to be in control of the content you display.
- Complete and bug free, yet. I’ll detail what’s missing below.
I based this on Tonegod for a few reasons. Firstly of course TonegodGUI provides all the required form controls. It also has “Content Paging” which takes care of keeping non-visible elements out of the scene (BIG help on large documents). It also has AnimText which amongst other things should make some cool stuff possible later.
Here is a quick video showing all the demo pages Flying Saucer comes with (here is a link to the Swing version of this, you can use it for comparing the possible level of support).
The test app shown in the Video (also use this for now to get the libraries if you want to try it out yourself) …
So what doesn’t work properly? Probably the biggest thing is ‘targeted repaints’. This is repainting of only the elements that have changed. I haven’t yet worked out how best to do this, but it’s usable without on relatively small documents. The Hamlet example was removed from the demo because it is pretty large. Another symptom of this missing feature is css positioning doesn’t work correctly with elements that are supposed to stay at fixed positions as the page is scrolled.
Also some drawing primitives are only partially implemented. For example filled circles (and ovals) and filled paths. This defiency is visible in the borders test page. I am open to suggestions how best to paint shapes such as filled circles and paths without using BufferedImage and AWT drawing. I found some code on the forum for a custom circle mesh that is a line, I presume this needs to be expanded upon to get filled meshes.
Note this required some hacks to the Tonegod source, and the demo app here is using that hacked version. It won’t work with standard Tonegod GUI currently. I had the following issues, please feel free to ask for more details on any of them. Some I can supply patches for.
- Content paging - awesome, but can there be a way to manually call it, or maybe call it when content is added. When adding content, until you scroll, you can end up with lots of stuff in the scene.
- Needed a Element.setColorMap(Image) method. Image objects are passed around, but Element only takes string paths.
- Clipping needs fixing on AnimText. Also TextElement has a clipping layer added by default, I have to remove this or fonts that descend beyond baseline get chopped. This may be the vertical alignment issue below.
- Need option to turn off anim text tag parsing. I don’t really need any of the tags (except maybe as a fallback when no style specific fonts are available).
- Rounding in ScrollPanel (was causing 1 pixel out problems for borders) and blurring of text.
- ComboBox and SelectList both caused lots of headaches. It’s hard to set font / font size of items in a combo box, or in a selectlist. Also have to get at menuItemHeight via and set it via reflection so highlighting works. The also both act very stangely when resizing. I REALLY look forward to these getting some attention
- No way of ‘disabling’ combobox items or list items. (for optiongroups, also indenting). Presumably currently this won’t be possibly without some controls.
- There are some issues will scroll panel sizing. It’s possible for content to start moving down when it shouldn’t. I also find that calling reshape() always messes up.
- Some vertical alignment issues with AnimText. The font in use and the font size seems to have an impact on alignment. I intend to produce a test app to show these issues.
There is a little more work to do before I can make the source available, but feel free to have a play with the demo apps. If you want to try to include it in your own app now, the example source should help. Just add all the libraries included in the above downloads.