A note about configuration

The first version of HaxeUI uses xml to configure everything. I should probably note that i think XML is a great mark up language - I've aways liked it, its inherent hierarchy and self descriptive manner - to me its clean simple and pretty robust.

That said, I know that isnt the case for everyone, and in an effort to make HaxeUI version 2 as helpful as possible Ive decided to allow configuration and UI creation to be flexible. To that end the various parts of HaxeUI2 that allow configuration or markup Ive made flexible. Currently there is support for the three "big ones": XML, JSON and YAML, but there is scope of course to dynamically create your own. So for example, it would be possible to create your own parsing adapter and allow you to build HaxeUI2 user interfaces from some type of custom markup in pretty much any format you want.

Below are some examples that are functionally identical:

  • Backends - this configuration is used to confugure the backend and framework HaxeUI2 will work with
  • Modules - modules define components, themes (and theme extensions) and resources that will be compiled into the application as haxe resources (note: haxeui-core is itself a module)
  • UI Definitions - mark up that will be turned into a HaxeUI2 user interface

Its worth noting, that with a single exception, this change has had no effect on my personal opinion. I still think that XML is by far the clearest and simplest method here. The single exception is YAML, though i feel its cumbersome for UI markup, it is nice and clear for module configuration. However, many may disagree with me, and thats fine, you can use the markup of your preference with zero impact (everything ends up as a typed haxe object anyway). 

Fun with HaxeUI CSS!

Its important that version 2 of HaxeUI is just as customisable as version 1, if not more. To that end, I took a little step back and had a little fun changing styles of components to make sure that the resulting UI was visually flexible.

Every single visible aspect of a components appearance is achieved using as CSS type language. Its not a fully W3C compliant version of CSS as certain things dont apply, and there are others that arent easily achievable using standard CSS, an example would be an icon for a button, it would be possible to use "standard" set of css as in:

.button .icon {
    src: "...";
}

However, its actually a lot simpler and straight forward to just use:

.button {
    icon: "...";
}

Anyways, here are a few experiments with CSS to change the visual lookout of various components

Dark buttons / checkboxes using only css (no images):

Custom buttons using 9-slice images: 

Progress bars and sliders

Ill be updating the demos on the site soon once all the backends support the same features. At the moment full support for custom fonts, 9 slice and background images is for:

  • OpenFL
  • Flambe
  • Luxe
  • NME
  • HTML5