Artwork: Difference between revisions

From Official Kodi Wiki
Jump to navigation Jump to search
(Undo revision 37338 by Ned Scott (talk))
Line 178: Line 178:
== Thumbnails for Sources ==
== Thumbnails for Sources ==
You can change the thumbnail displayed for a source by editing '''UserData\sources.xml'''.<br />
You can change the thumbnail displayed for a source by editing '''UserData\sources.xml'''.<br />
'''Note:''' Source thumbnails have to be in a folder on the local Xbox harddrive!
'''Note:''' Source thumbnails have to be in a folder on the local XBMC device harddrive!


Simply modify your source as shown:
Simply modify your source as shown:
Line 189: Line 189:
</source>
</source>
</nowiki></pre>
</nowiki></pre>


== Icons used in XBMC skins ==
== Icons used in XBMC skins ==

Revision as of 19:03, 12 February 2012

Template:XBMC wiki toc Inline An impressive feature of XBMC is its ability to display custom thumbnails (also known as an "icon") on most items displayed. You can assign thumbnails to folders, programs, music, videos, bookmarks, and of course pictures. You can choose to let XBMC automaticly download thumbnails for music-albums and video/movies from the internet or you can create your very own custom thumbnails, (or you can download custom thumbnails that others have created).

Custom Thumbnails

You can easily create your very own user-defined thumbnails on your computer with image tools like Adobe PhotoShop or Paint Shop Pro (or even Paint in Windows). You can alternatively downloaded thumbnails that others have created from the internet. Then you simply have to rename those thumbnails and transfer/copy them to the right location and XBMC will display them. Use JPG or PNG (with transparancy) image-format, and size of the picture to anything from 128x128 to 256x256 in pixel size, (the larger the image is the better it will look on a good display but at the same time large thumbnails loads slower). On a non-HDTV displays a image that is approx 100x140 is recomended for video/movies thumbnails (which is the size that is most common on IMDb), and approx 75x75 for music-albums (which is the default size on allmusic.com). For 720p/1080i HDTV displays a size of approx 182x256 for video/movies thumbnails, and approx 200x200 for music-albums (such music-albums can be found on allmusic.com).

Thumbnail Cache

XBMC will cache all Thumbnails to UserData\Thumbnails\ using the CRC of the path of the file or folder as a filename. That is the first location XBMC will generally look for a thumbnail for a given item.

See here for a thorough description of the thumbnail cache

In order for your custom thumbnail to show, you may have to delete the cached thumbnail.

Wide Icons

Library.videos.tvshowwide.WSCR.jpg

Some of the most visually appealing forms of thumbnails are Wide Banner Icons. They were added in XBMC on the 1st. of January 2007 and are now an integral part of the application. With different adjustments to the skin xml files, you may disable title names, or stack one icon on top of another.
To show big Icons, switch to one of the new views, Big Wide or Wide Icons.

Remember View: XBMC Will now remember what view you have for each folder. (Thus you can keep your TV Shows in Wide, and your Movies in Icon)

Thumbnailing Individual Items in a Single Directory

Name the icon file the same as the file you would like it to display for with a .tbn extension ie: Transformers.avi, Transformers.tbn. This is particularly useful for using custom thumbnails for movies.

Example:

Movies\path\moviename.avi
Movies\path\moviename.tbn

Folder Thumbnails

If you store each of your media files in separate subfolders to keep things organized, you can also make the folder have a custom thumbnail image. To do this you either need to save your JPG/PNG thumbnail as folder.jpg and place it inside your movie/album folder, or you can save it as <foldername>.tbn and place it at the same level as the folder in the directory tree.

  • Remember, XBMC first checks for <foldername>.tbn before checking for folder.jpg.
  • Some documentation suggests that folder.tbn can be used. In general folder.jpg is superior as it is detected during a scan i.e. XBMC will correctly use folder.jpg but not folder.tbn.
  • Note that folder.jpg MUST be named .jpg, even if it is a .png format image.


Examples:

Movies\path\foldername\
Movies\path\foldername.tbn

or

Movies\path\moviename\folder.jpg
Music\path\album\folder.jpg

Now your media folder will have a lovely custom thumbnail-image.

You can via advancedsettings.xml change the default filename of the image that XBMC uses for music folders. See the <musicthumbs> tag. for more information.

Files.myvideos.jpg

Program Thumbnails

In order to display the image displayed for a game, emulator or application, simply rename the desired image default.tbn and place it in the folder where the corresponding default.XBE is located.

Music Thumbnails

Music Thumbnails are assigned as part of a multitier process. First, the Tag Reader runs and caches any embedded art using the album name and album artist (or song artist, if that is all that is available). If the album name or artist is unavailable, it is cached using the path name of the song. This assumes, of course, that you have tag reading enabled.
You can also use "Get Thumb" to download the album thumbnail from allmusic.com (AMG) for a specific album/folder or do a scan of all your music files in all shares.
Thumbnails also get downloaded when you rip AudioCD's to your XBMC device (which is described in the Ripping CDs section).
Recomended is that you store each of your music-albums or artists in a separate subfolder to keep things organized. You can also of course make the folder have a custom thumbnail image.

Notes: Running a scan automatically enables 'tag reading' so everything can be cached. Once a scan is run, all your files and their associated thumbnails are stored in the database.
The Album Information dialog (available from the context menu) will allow you to choose between the cover art available for download from allmusic.com and any user-defined thumbnail you may have.
Press the "Get Thumb" button to bring up a choice of the local thumbnails you have, the currently assigned thumbnail and the allmusic.com thumbnail.

The code which assigns thumbnails to files runs and assigns thumbnails in the following order:

1) Cached Album Thumbnail
This is all the embedded album art read by the tag reader and cached using the album name and album artist.
2) Cached filename.tbn
This includes an embedded thumbnail cached with the fully qualified name.
3) Remote filename.tbn
This is a filename.tbn on a remote share/folder which is then cached.
4) Cached folder.jpg
This is a folder.jpg which is cached based off the folder path.
5) Remote folder.jpg
This is a folder.jpg on a remote share/folder which is then cached.
6) Remote foldername.tbn
This is a foldername.tbn on a remote share/folder which is then cached.

Examples:

In this example audiofilename.mp3 will use audiofilename.tbn as thumbnail:

Music\path\audiofilename.mp3
Music\path\audiofilename.tbn

The same goes for playlists, cue-sheets, SHOUTcast, and internet-stream files, example:

Music\path\audioplaylistname.m3u
Music\path\audioplaylistname.tbn
Music\path\cuelistname.cue
Music\path\cuelistname.mp3
Music\path\cuelistname.tbn
Music\path\shoutcastlinkname.pls
Music\path\shoutcastlinkname.tbn
Music\path\audiostreamname.strm
Music\path\audiostreamname.tbn

Video Thumbnails

You can either use your own custom thumbnails or XBMC can retrieve video thumbnails from the internet via scrapers and cache them locally.
XBMC applies thumbnails to video files in the following order:

1) Cached Thumbnail
Thumbnails are cached to UserData\Thumbnails\Video using the CRC of the path of the file or folder.
2) User-Defined Thumbnail
For files: XBMC checks for <filename>.tbn and uses that if it exists.The thumbnail is cached the first time it is read.

For movies, movie.tbn will override any other thumb.

For folders: XBMC first checks for <foldername>.tbn in the same directory as the folder is in. If no <foldername>.tbn exists XBMC then checks for folder.jpg inside the movie-folder. In either case the first found thumb of those is cached.
Files.videos.thumbnails.WSCR.jpg

Examples for User-Defined Video Thumbnails

Single Video File

The following example "videofilename.avi" will now use the thumbnail "videofilename.tbn".

Videos\path\videofilename.tbn
Videos\path\videofilename.avi
Multi Part (Stacked) Video Files

You can either use the filename of the first file in the stack or the name of the stack, so for:

Movies\path\moviename-CD1.avi
Movies\path\moviename-CD2.avi

Either of the below would work:

Movies\path\moviename-CD1.tbn
Movies\path\moviename.tbn
Movie

If content has been set to Movies, movie.tbn will override any other thumbs for media in that folder. In he following example "videofilename.avi" will now use the thumbnail "movie.tbn".

Videos\path\movie.tbn
Videos\path\videofilename.avi
TV Shows
TV\showfolder\folder.jpg
TV Show Season Thumbnails

In the following example, the thumbnail will be used for the appropriate season in the Video Library season node. Where xx is 01, 02 etc.

TV\showfolder\seasonxx.tbn
TV Show Specials
TV\showfolder\season-specials.tbn
For the all seasons item
TV\showfolder\season-all.tbn
Fanart
Videos\path\fanart.jpg
TV\showfolder\fanart.jpg
Playlist and internet-stream file examples
Playlists\path\videoplaylistname.pls
Playlists\path\videoplaylistname.tbn
Streams\path\videostreamname.strm
Streams\path\videostreamname.tbn
Actor thumbnails

You can add actor thumbnails to any movie or TV show by adding an '.actors' folder in the corresponding movie / TV show / Epsiode directory. You may need to use the command line to create this directory in Windows.
The folder can then contain actor images using the following naming convention:

Videos\path\.actors\actor_name.tbn (spaces replaced with underscores)

Picture Thumbnails

XBMC applies thumbnails to picture files in the following order:

1) Cached Thumbnail
Thumbnails are cached to UserData\Thumbnails\Pictures using the CRC of the path of the file or folder.
2) Images
EXIF thumbnail in JPEG images are then read. If no EXIF thumbnail is available, XBMC will load the image and generate a thumbnail from the image. These are then cached.
3) Folders
<MyHolidayPictures>\folder.jpg is checked first. If that file doesn't exist, XBMC will generate a thumbnail from up to 4 random images inside that folder.

Thumbnails for Sources

You can change the thumbnail displayed for a source by editing UserData\sources.xml.
Note: Source thumbnails have to be in a folder on the local XBMC device harddrive!

Simply modify your source as shown:

<source>
   <name>Music</name>
   <path>xbms://192.168.1.100:1400/Music/</path>
   <thumbnail>F:\Apps\XBMC\thumbs\shares\thumb.png</thumbnail>
</source>

Icons used in XBMC skins

The filenames of the default icons are as follows:

Add-ons

DefaultAddon.png

DefaultAddonAlbumInfo.png

DefaultAddonArtistInfo.png

DefaultAddonLyrics.png

DefaultAddonMovieInfo.png

DefaultAddonMusic.png

DefaultAddonMusicVideoInfo.png

DefaultAddonNone.png

DefaultAddonPicture.png

DefaultAddonProgram.png

DefaultAddonRepository.png

DefaultAddonScreensaver.png

DefaultAddonService.png

DefaultAddonSkin.png

DefaultAddonSubtitles.png

DefaultAddonTvInfo.png

DefaultAddonVideo.png

DefaultAddonVisualization.png

DefaultAddonWeather.png

DefaultAddonWebSkin.png

Music

DefaultAlbumCover.png

DefaultArtist.png

DefaultAudio.png

DefaultMusicAlbums.png

DefaultMusicArtists.png

DefaultMusicCompilations.png

DefaultMusicGenres.png

DefaultMusicPlaylists.png

DefaultMusicPlugins.png

DefaultMusicRecentlyAdded.png

DefaultMusicRecentlyPlayed.png

DefaultMusicSearch.png

DefaultMusicSongs.png

DefaultMusicTop100.png

DefaultMusicTop100Albums.png

DefaultMusicTop100Songs.png

DefaultMusicVideos.png

DefaultMusicVideoTitle.png

DefaultMusicYears.png

Videos

DefaultActor.png

DefaultCountry.png

DefaultDirector.png

DefaultGenre.png

DefaultMovies.png

DefaultMovieTitle.png

DefaultRecentlyAddedEpisodes.png

DefaultRecentlyAddedMovies.png

DefaultRecentlyAddedMusicVideos.png

DefaultSets.png

DefaultStudios.png

DefaultTVShows.png

DefaultTVShowTitle.png

DefaultVideo.png

DefaultVideoCover.png

DefaultVideoPlaylists.png

DefaultVideoPlugins.png

DefaultYear.png

Generic

DefaultAddSource.png

DefaultCDDA.png

DefaultDVDEmpty.png

DefaultDVDRom.png

DefaultFile.png

DefaultFolder.png

DefaultFolderBack.png

DefaultHardDisk.png

DefaultNetwork.png

DefaultPicture.png

DefaultPlaylist.png

DefaultProgram.png

DefaultRemovableDisk.png

DefaultScript.png

DefaultShortcut.png

DefaultVCD.png

DefaultXboxDVD.png

Auto Switch to Icon Mode

XBMC tries to automatically switch to Large Icon view when the View Mode is set to Auto in the Settings. It first checks if the skin has Large Icon view, failing that switches to Icon view. If neither is available it goes for List View.
The rules are as follows:

Programs

Auto switches to Icon view when 50% of all the items (files and folder) have thumbs.

Pictures

Auto switches to Thumbs view when the list contains more than 25% files. (In the case of Pictures, all items have thumbs as they are generated upon entering the folder.)

Videos

Auto switches to Thumb view when 50% of all the items (files and folder) have thumbs.

Music

Auto switches to Thumb view when the list contains at least 75% folders and at least 50% of them have thumbs. (Remember that playlist files like m3u, pls, etc, are treated as folders by default)

Hashing

The thumbnail .tbn file is created via a hashing function. As explained earlier, the hash is based off the CRC32 of the pathname (plus filename) in lowercase. Files which are local are hashed using their drive letter. Remote files are hashed using the smb:// protocol designation and optional username and password.

Examples

  • 123456789 returns 0376e6e7
  • F:\Videos\Nosferatu.avi returns 2a6ec78d
  • smb://user:pass@server/share/directory/ returns c5559f13
  • smb://user:pass@server/share/directory/file.ext returns 8ce36055

Remember:

  • When hashing remote shares, use the path as displayed in the sources.xml file, which can include the username and password.
  • When hashing directories for thumbnails, include the final slash.

Sample Code

The following code is written in C# and produces the same output as the XBMC hashing function.

public string Hash(string input)
{
   char[] chars = input.ToCharArray();
   for (int index = 0; index < chars.Length; index++)
   {
       if (chars[index] <= 127)
       {
          chars[index] = System.Char.ToLowerInvariant(chars[index]);
       }
   }
   input = new string(chars);
   uint m_crc = 0xffffffff;
   byte[] bytes = System.Text.Encoding.UTF8.GetBytes(input);
   foreach (byte myByte in bytes)
   {
       m_crc ^= ((uint)(myByte) << 24);
       for (int i = 0; i < 8; i++)
       {
           if ((System.Convert.ToUInt32(m_crc) & 0x80000000) == 0x80000000)
           {
               m_crc = (m_crc << 1) ^ 0x04C11DB7;
           }
           else
           {
               m_crc <<= 1;
           }
       }
   }
   return String.Format("{0:x8}", m_crc);
}