Thread Rating:
  • 6 Vote(s) - 4.17 Average
Skinning for Kodi
#1
Skinning for Kodi


nope, i am not going to teach you how to create a skin for Kodi,
but i'm going try to provide as much useful information as possible to get you going.

since there's so much great and helpful posts on skinning scattered across the forum,
the aim of this thread is to collect all of them in a single post.

if you feel anything is missing, please reply to this post and i'll add your suggestions.


Before you start
the first thing you need to realize is that creating a skin from scratch is not something you do overnight.
it's a job that's going to take you 3 to 6 months... if not a year or more.


How to get going
to get familiar with the Kodi skinning engine, we recommend you start with making small modifications to the Confluence skin.
the code of Confluence is well structured, not too complex, and should be relatively easy to follow for our junior skinners.

just open a few .xml files in your favourite text editor and change some parts of it. reload the skin in Kodi to see the effect of your changes.
The easiest way would be to map the reload command as well as several other helpful commands to your keymap file.

There are some editor plugins that can be useful:
- the skin editor plugin if you use notepad++
- the very advanced SublimeKodi to use with SublimeText

at all times, keep the Kodi Skinning Manual by your side.
this is the most complete piece of dedicated skinning info available!

if you feel comfortable with the skin xml code, it's time to let creativity flow....
as you may have figured out by now, all the tools you need are a text editor and an image editing tool (photoshop / the gimp / ..)

in case you're not a gifted graphic designer, there is a lot of open source artwork available you can include in your skin.
please remember, it is 'not ok' to just include whatever artwork you found on the internet that could be copyrighted.

the same applies to the font you are going to use in your skin. make sure you pick an open source fontfile.
one other thing to keep in mind when selecting a font is unicode support, not all users will run your skin in english.

Tips & tricks
some parts may not be easy to skin, as they require you to have certain hardware (pvr / peripherals).
here are some guides to make things easier for you:
- pvr
- peripherals

Presenting your skin
once you're well on your way, you may want to present your ideas to the outside world.
don't hesitate to start a thread in our [WIP] Skins area.

include some pictures with your post, or use a slideshow or youtube video
so users can get a clear view of what your skin will look like.


Ready for testing
like every piece of code, your skin will contain bugs. Kodi has a large and active userbase
who is willing to test drive your 'work in progress' skin and can help you identify those bugs.


Submitting your skin to the official Kodi.tv repo
to make it easy for all Kodi users (not just the forum-goers) to install your skin, we would appreciate it if you would submit your skin to the official Kodi repository.
that way, it will be installable right from within Kodi for everyone.
to make the submission process as easy as possible we're providing a detailed list of guidelines for you to follow.

there's one tool i like to recommend to everyone: the Skin XML Converter + Formatter.
this program can detect a large variety of skin problems and it is one of the things we use to test your skin before adding it to the Kodi.tv repository.


Keeping it up-to-date
Kodi development is an ongoing process and changes to the skinning engine will be made regularly.
the make sure your skin will keep working with the latest Kodi releases, we recommend you follow
the 'Changes to the skinning engine for Kodi' sticky posts made in the skin dev forum.


Last but not least
should you ever, at any time, get stuck (we all hit the brick wall before)
feel free to ask for help in the Skin Development forum.
Do not PM or e-mail Team-Kodi members directly asking for support.
Always read the Forum rules, Kodi online-manual, FAQ, Help and Search the forum before posting.
Reply
#2
I'm trying to learn to skin, so thanks for starting this.

(2013-03-17, 02:12)ronie Wrote: Skinning for XBMC

How to get going
to get familiar with the XBMC skinning engine, we recommend you download the Foundation skin.
this skin was especially designed for our junior skinners and provides you with a lot of information on how everything operates 'under the hood'.

Unless it's been recently updated, I don't think Foundation works out of the box with Frodo. addon.xml needs updating to 4.0.0? i.e.

Code:
<import addon="xbmc.gui" version="3.00"/>

Quote:just open a few .xml files in your favourite text editor (if you use notepad++ check the skin editor plugin)
and change some parts of it. reload the skin in XBMC to see the effect of your changes.

Adding the keymaps (for reload etc) as described in the Foundation skin is also a helpful tip.

I find it helpful to use a range of skins to see what works well, what might be improved on and just to spot useful (or coolSmile) features so that I can then examine the code to learn how they are done.
Reply
#3
(2013-03-17, 22:34)kristle Wrote: Unless it's been recently updated, I don't think Foundation works out of the box with Frodo. addon.xml needs updating to 4.0.0? i.e.

Code:
<import addon="xbmc.gui" version="3.00"/>

afaik it's not updated to frodo indeed. if you try the install from zip option, you'll most likely get an error.
but if you manually unzip the skin to the addons folder, you won't have this problem.

(2013-03-17, 22:34)kristle Wrote: Adding the keymaps (for reload etc) as described in the Foundation skin is also a helpful tip.

added to the post, thx!
Do not PM or e-mail Team-Kodi members directly asking for support.
Always read the Forum rules, Kodi online-manual, FAQ, Help and Search the forum before posting.
Reply
#4
I tried loading Foundation but got a dependency error and XBMC refused to load it. I downloaded the file into my downloads folder, and directed XBMC to load it, but it refused.
Reply
#5
(2014-09-12, 15:26)JJohnson Wrote: I tried loading Foundation but got a dependency error and XBMC refused to load it. I downloaded the file into my downloads folder, and directed XBMC to load it, but it refused.

yup the skin is outdated. i'll update the first post.
Do not PM or e-mail Team-Kodi members directly asking for support.
Always read the Forum rules, Kodi online-manual, FAQ, Help and Search the forum before posting.
Reply
#6
I am trying my first skin out by duplicating the AEON MQ5 skin. The reason I chose this is because the wall view is the closest to what my goal is to start with. I'm trying to replicate the Kaleidescape system. So far, I've gotten pretty great results! But I want to allow more space between the grid. Where do I adjust the space between the posters? I want it to be even on all sides. I can post what I have if you'd like as well.

Also functionality wise. I notice that disabling onup,ondown, etc. keys allow for wrapping both vertically and horizontally. However, I want this to happen but I want the gold bar to remain in the center while the poster move around when the user presses up,down,left,right. I would like to move the posters and keep the select right in the middle.

Can someone point me in the right direction? I have the manual in another tab. I've been doing this for 18 hrs straight to get where I am so far. Went to bed at 4am, so it's not the lack of trying to research my answers. thanks!
Reply
#7
the functionality you want is not possible with "normal" skinning methods (moving posters while focus remains in center). it would need some very tricky python work to get what you want, and that´s definitely nothing for newbies Wink the space can be adjusted by adjusting focused/itemlayout height/width.
Donate: https://kodi.tv/contribute/donate (foundation), 146Gr48FqHM7TPB9q33HHv6uWpgQqdz1yk (BTC personal)
Estuary: Kodis new default skin - ExtendedInfo Script - KodiDevKit
Reply
#8
The link for the skinning manual needs to be updated to XBMC_Skinning_Manual (wiki).
Thanks.
Reply
#9
(2014-12-27, 17:38)avenzel Wrote: The link for the skinning manual needs to be updated to XBMC_Skinning_Manual (wiki).

fixed, thx!
Do not PM or e-mail Team-Kodi members directly asking for support.
Always read the Forum rules, Kodi online-manual, FAQ, Help and Search the forum before posting.
Reply
#10
I want to convert my skin mode to KODi Helix (gotham => Kodi) and I wonder where I can find the information to change. thank you
Reply
#11
http://forum.kodi.tv/showthread.php?tid=...pid1866651
Reply
#12
Thank you very much, I could not understand where to find it.
Reply
#13
Edited you text to link to the SublimeKodi forum thread as well.
Reply
#14
Hi ronie,
Just wanted to clear some points about the official repo skin push. Since it's not precised in the first post, wich is the minimum state of skin dev to meet the requirements ? Of course an alpha is not to consider but is a Beta with everything working and some improvements pending admissible ? And can it be requested for a KODI alpha or nightly (I mean Jarvis) ? Thanks in advance.
[Skin] KOver - V1.1.0 Stable (Repo version)
[WIP] ReKOver - Skinning tool project

If I've been helpful or you like my work, hit "THANK USER" button ;) ...
Reply
#15
(2015-08-29, 13:34)Jayz2K Wrote: Since it's not precised in the first post, wich is the minimum state of skin dev to meet the requirements ?
if a skin is feature complete, meaning all required windows and dialogs are coded, then you're most welcome to submit your skin.
i will do some code check, as outlined here Add-on_rules#Requirements_for_skins (wiki), before pulling the skin into the repo.
(2015-08-29, 13:34)Jayz2K Wrote: And can it be requested for a KODI alpha or nightly (I mean Jarvis) ?
sure, we have a Jarvis repo set up and it's open to submissions.
Do not PM or e-mail Team-Kodi members directly asking for support.
Always read the Forum rules, Kodi online-manual, FAQ, Help and Search the forum before posting.
Reply



Skinning for Kodi4.176