Jump to content

Skinning: Difference between revisions

From Official Kodi Wiki
Zag (talk | contribs)
No edit summary
Ned Scott (talk | contribs)
caps on links, switch to some creative-commons images, minor adjustments
Line 3: Line 3:
XBMC is noted as having a very flexible and robust framework for its GUI, making theme-skinning and personal customization very accessible. Users can create their own skin (or modify an existing skin) and share it with others. "Confluence" is the official skin;
XBMC is noted as having a very flexible and robust framework for its GUI, making theme-skinning and personal customization very accessible. Users can create their own skin (or modify an existing skin) and share it with others. "Confluence" is the official skin;


{{-}}
== General ==
----
{{huge|'''[[General topics|{{color|black|General}}]]'''}}
{| width="100%"
{| width="100%"
|- valign="top"
|- valign="top"
| width="25%" align="center" | {{Main page icon|image=Nuvola apps kthememgr.png|link=Skin development introduction}}
| width="25%" align="center" | {{Main page icon|image=Nuvola apps kthememgr.png|link=Skin development introduction}}
| width="25%" align="center" | {{Main page icon|image=Applications-development.svg|link=Skin structure|title=Skin Structure}}
| width="25%" align="center" | {{Main page icon|image=Applications-development.svg|link=Skin structure|title=Skin structure}}
| width="25%" align="center" | {{Main page icon|image=Book icon 1.png|link=XBMC Skinning Manual}}
| width="25%" align="center" | {{Main page icon|image=Book icon 1.png|link=XBMC Skinning Manual}}
| width="25%" align="center" | {{Main page icon|image=Administration.png|link=Skin Development Tools}}
| width="25%" align="center" | {{Main page icon|image=Administration.png|link=Skin development tools}}
|}
|}
----
 
{{huge|'''[[Tutorials|{{color|black|Tutorials}}]]'''}}
 
== Tutorials ==
{| width="100%"
{| width="100%"
|- valign="top"
|- valign="top"
| width="25%" align="center" | {{Main page icon|image=Theme_Stuff_Icon.png|link=1st Skin Tutorial}}
| width="25%" align="center" | {{Main page icon|image=Theme_Stuff_Icon.png|link=First skin tutorial}}
| width="25%" align="center" | {{Main page icon|image=Edit-icon.png|link=Modifiying a Skin Tutorial}}
| width="25%" align="center" | {{Main page icon|image=Pencil clipart.svg|link=Modifiying a skin tutorial}}
| width="25%" align="center" | {{Main page icon|image=Home-icon.png|link=HOW-TO_edit_the_Main_Menu_(Home_Screen)_via_skinning|title=Home Screen Tutorial}}
| width="25%" align="center" | {{Main page icon|image=Home-icon.png|link=HOW-TO:Edit the home screen skin files|title=Home screen tutorial}}
| width="25%" align="center" | {{Main page icon|image=Full-screen-128.png|link=HOW-TO make a dialog popup automatically with another one via skinning|title=Popup Tutorial}}
| width="25%" align="center" | {{Main page icon|image=Full-screen-128.png|link=HOW-TO:Make a dialog popup automatically with another one via skinning|title=Popup tutorial}}
|}
{| width="100%"
|- valign="top"
|- valign="top"
| width="25%" align="center" | {{Main page icon|image=Sunny-Rain-weather-128.png|link=HOW-TO enable weather info display for the home screen via skinning|title=Weather Info Tutorial}}
| width="25%" align="center" | {{Main page icon|image=Weather-sun-clouds-some-rain.svg|link=HOW-TO:Enable weather info display for the home screen via skinning|title=Weather info tutorial}}
| width="25%" align="center" | {{Main page icon|image=Screen-128.png‎|link=HOW-TO add a new window or dialog via skinning|title=New Dialog Tutorial}}
| width="25%" align="center" | {{Main page icon|image=Crystal Project window list.png‎|link=HOW-TO:Add a new window or dialog via skinning|title=New dialog tutorial}}
| width="25%" align="center" | {{Main page icon|image=Font-Book-128.png|link=HOW-TO add a new true type font to the skin|title=Adding Fonts Tutorial}}
| width="25%" align="center" | {{Main page icon|image=Font-Book-128.png|link=HOW-TO:Add a new true type font to the skin|title=Adding fonts tutorial}}
| width="25%" align="center" | {{Main page icon|image=Home-icon.png|link=Testing Skin Tutorial|title=Testing Skin Tutorial}}
| width="25%" align="center" | {{Main page icon|image=Home-icon.png|link=Testing skin tutorial|title=Testing skin tutorial}}
|}
|}



Revision as of 22:22, 26 February 2014

  ▶ Development ▶ Add-on development ▶ Skinning

XBMC is noted as having a very flexible and robust framework for its GUI, making theme-skinning and personal customization very accessible. Users can create their own skin (or modify an existing skin) and share it with others. "Confluence" is the official skin;

General

icon
icon
Skin development introduction
icon
icon
Skin structure
icon
icon
XBMC Skinning Manual
icon
icon
Skin development tools


Tutorials

icon
icon
First skin tutorial
icon
icon
Modifiying a skin tutorial
icon
icon
Home screen tutorial
icon
icon
Popup tutorial
icon
icon
Weather info tutorial
icon
icon
New dialog tutorial
icon
icon
Adding fonts tutorial
icon
icon
Testing skin tutorial