2013-03-17, 02:12
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 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
- games
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.
(update: this tool is now slightly outdated and not 100% functional anymore)
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.
Further reading
skinning engine internals / skin optimization
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 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
- games
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.
(update: this tool is now slightly outdated and not 100% functional anymore)
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.
Further reading
skinning engine internals / skin optimization
) features so that I can then examine the code to learn how they are done.
the space can be adjusted by adjusting focused/itemlayout height/width.
