XUL + SVG: A quick demo

SVG icon in a XUL menu item

For a while I’ve been thinking about a desire to add SVG graphics to XUL Widgets. You might wonder why anyone would want to do that. My answer: SVG, like XUL, is XML markup. Verbosio will be able to edit XML. So it’ll be able to edit SVG and XUL. Why not?

One drawback: the SVG is included inline in the document, not as an external file. This is somewhat unavoidable, and violates the niceties of multiple skins in a XUL package. (XUL skins can’t have .xul files in them, and this has to be inline or inserted via overlay.) So I’m wondering if there’s a better way to do this.

6 thoughts on “XUL + SVG: A quick demo”

  1. An answer other than “Why not?” is the possibility of exploring such ideas as seamlessly mixing graphics and text and images. For example, in this screenshot
    http://people.csail.mit.edu/dfhuynh/research/ideas/Breaking%20Windows/Map.png
    we see how a textual spreadsheet-like formula is linked to a map through a line. Maps, normally shown as dead images, now carry semantics and support computations. The distance on the map needs not be named by a variable as in conventional programming languages; it can simply be linked from the map to wherever it is used.

  2. This may sound silly since I don’t know XUL at all, but… XSLT?
    (From Alex: Sorry, this is pretty useless for a chrome application. 🙂 )

  3. Well this sounds like Bug #231179 (SVG images in CSS) which realy would rock if it would be implemeneted. 😉
    (From Alex: Yep, only I’m cheating by not trying to load it as an image per se.)

  4. I love this mixing of XML languages. My special interest is XForms: XForms+XHTML or XForms+SVG or XForms+XUL+SVG, etc. — it’s all XML, and you can do so many interesting things when mixing it.

  5. Clicking on svg in a menu or button doesn’t fire oncommand, so it’s not usable yet.
    (From Alex: That’s not the point. The SVG is just artwork, and if I write the bindings right, it won’t matter – the oncommand will still fire.)

Comments are closed.