Name is required.
Email address is required.
Invalid email address
Answer is required.
Exceeding max length of 5KB

Positioning Control Bar Elements with Skin XML for JWPlayer 6

sample page: http://www.soundstrue.com/player/jwplayer6/

I am building a skin for the JWPlayer 6 and I am having some trouble with element display. Here are my issues:

1) I would like to change the order in which control bar elements appear. As you can see in my XML (http://www.soundstrue.com/player/jwplayer6/skin/player6.xml) I have defined the 'fullscreen' elements first, yet the 'fullscreen' button is still appearing on the far-right side of the control bar in the player. In v5, the order of elements in the xml defined them in the view. Is this no longer the case? Also, I cannot find any relevant information about this in the v6 documentation.

2) Can I add extra elements? I would like to put a number of extra dividers in to the control bar to extend the gap between only some elements. Is this possible?

3) Is it possible to define the width of the 'elapsed' and 'duration' elements?

Thanks you in advance for any help.

1 Community Answers

Up Down

JW Player

User  
0 rated :

SOLVED!

Well I found the answers to my questions and I thought I would share them incase others are in the same situation.

1) JWPlayer 6 uses the same skinning XML (mostly) as v5, but there is no mention of the 'layout' XML block in the v6 documentation, there is also no easy link to, or note about reading the v5 documentation to figure this out. So anyway, the default layout is used unless the 'layout' block is specified. The 'layout' block goes between the 'settings' and 'elements' block in the skin XML.

Here is a link to the v5 XML layout documentation (it's about half way down the page):
http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/14/building-skins

Also... because it was a bit confusing until I figured it out, and again, the documentation does not cover this...

When defining the 'name' attribute for the layout element, the first word of the camel-cased element name is used. For instance, if you would like to define the layout for the 'playButton' and 'playButtonOver' elements, the layout element's name should be 'play'.


2) Once I found the layout XML block, this was pretty self explanatory, however, during my testing I found that declaring multiple 'divider' elements did not expand the gap between elements. Also, using the width attribute '< divider width='10'>' broke the player entirely. I was finally able to solve this problem by defining a custom element (with a transparent image the width of the gap I needed to create) and using the 'element' attribute in the 'divider'.

3) See #2.

This question has received the maximum number of answers.