Kodi Community Forum
[GUI] Elements to style User Interface - Printable Version

+- Kodi Community Forum (https://forum.kodi.tv)
+-- Forum: Development (https://forum.kodi.tv/forumdisplay.php?fid=32)
+--- Forum: Add-ons (https://forum.kodi.tv/forumdisplay.php?fid=26)
+--- Thread: [GUI] Elements to style User Interface (/showthread.php?tid=128422)



[GUI] Elements to style User Interface - swehsos - 2012-04-10

Hello everyone,

I'm desperately searching for a good guide to create a User Interface
in XBMC. As far as I understand, Gui's are created via XML files - more
or less like a website.

Is there any good overview of style elements which can be used? Or does
any of you know a homepage with a good Tutorial? We are planning to
create a plugin for WebTV and need to present GUI mockups - kinda
difficult to create without any XML reference...

Is XML the way to go anyways? I found some documentation from 2006
which explains GUI Design in Python directly - seems outdated to me
though.

Any help will be highly appreciatedSmile

Thanks in advance, guys Smile


RE: [GUI] Elements to style User Interface - Bstrdsmkr - 2012-04-10

This should get you started: http://wiki.xbmc.org/index.php?title=XBMC_Skinning_Manual

For all intents and purposes, you can use any of the information found on creating skins (same engine). If you're not a fan of xml, you can also create your gui programatically:

1. Create an instance of xbmcgui.Window() or xbmcgui.WindowDialog
2. Create an instance of the control you want
3. Add the control to your window/dialog instance via the window's .addControl() method
4. Show the window by calling one of it's methods, .show() or .doModal()

PHP Code:
mywindow xbmcgui.WindowDialog()
myimage xbmcgui.ControlImage(50,50,1024,768,'C:\myimage.png')
mywindow.addControl(myimage)
mywindow.show()