Things to consider when making themes

In my attempts to making a nice new theme for the WD TV Live Hub, I’ve stumbled upon many issues that limit the theme design, don’t work, do not look nice, are puzzling, etc.

This thread is all about sharing your and my theme making knowledge.

Feel free to take part!

Call it a bug or call it a feature:

In the 2.03.24 firmware ALL thumbnails made by the Hub have a maximum size of 240 x 240 pixels. This restriction applies to folder thumbnails as well.

I’m working on something like a cover flow.
I noticed that ALL movie cover art the Hub got by using “Option\Get Content Info” have a width of 185 pixels. The height varies, but most images have a height of 278 pixels.

These images are nicely displayed when I use w=“185” h=“278” and scale them in height with scale=“100” scale_type=“pan” to make them all equally big on screen.

Then I made some images for the folders, all in the 185 x 278 format, put one in each folder, and named them all folder.jpg. When I checked, all show, but they just don’t look good. WHAT HAPPENED?!

Then it struck me: of all these folder.jpg images, thumbnails are made in the hidden thumbs directory. All were shrunken to a height of 240 pixels (and a width of 159), due to these thumbnail restrictions I mentioned above. As a result they had to be stretched again to make them fit, not looking nice at all.

Designing my theme I now have to choose. I can:

A: use a height of 240, have perfect folder icons, but don’t show cover art as good as I can, or

B: show the cover art as good as it gets, but have to stretch the folder images, making them look weird.

That’s all for now. Hope you theme makers can use this to your best advantage :slight_smile:

WhackTag

Finding out which images are used on a certain page can be hard.

(NOTE: For now, I’ll asume you know which *.xml files are used for that page. Figuring that out can be hard too, but that has to be covered in another post)

For some images, finding out is easy, as their full path is listed in the *.xml file of the part of the theme you’re working on. But a lot of the references to the images are variables.
All variables have names beginning with @@.

Example:

In the file used for the 3 x 3 video menu rv_large_video_browse_page.xml line 16 reads:

<image image="@@rv_browse_page_bg_0"  x=“56”  y=“172”/>

How to know which image file this references to?

Here’s the trick:

  1. Switch on your WD TV Live Hub and TV.
  2. Open your theme’s folder on the WD TV Live Hub in a file explorer on your computer…
  3. Open the file that puzzles you in a text or xml editor (I use Notepad++)
  4. Find the <image…> line of code you want to know more about
  5. Copy the following line of code and paste it directly under the line you want to know more about.
  1. Copy the image variable’s name you want to know more about, in this example @@rv_browse_page_bg_0
  2. Paste this over @@WhackTag. The line now looks like
  1. Save the *.xml file to the Hub.
  2. Using the Hub’s remote, go to the page the *.xml file describes.
  3. ET VIOLA! The full path and name of the image file is shown on the top of your screen!

In this case: image/LargeVideo/large_video_gallery_thumbnail_bg.png

This trick saved me a lot of time :slight_smile:

1 Like

Very nice WhackTag !

Working on rv_large_video_browse_page.xml I noticed the code about MPAA-ratings was commented out, with some info about it not working. But it does! It seems the 2.03.24 fixed this issue.

So if you want your theme to show MPAA-ratings, you now can!