Building a skin from scratch - a tour - (1 Viewer)

[kiwijunglist]

agree, I wish there was a tag you could wrap around a set of controls

eg. ELEMENT TAG HAS

Xscale + Yscale for %multiplicative changing co-ords
Wscale + Hscale for %multiplicative changing width/height
ScaleX + ScaleY which %scales co-ords and dimensions.
Xshift + Yshift for non multiplicative changing co-ords
Wshift + Hshift for non multiplicative changing width/height

<ELEMENT>
img: 0,0 w=200 h=100
img: 300,0 w=200 h=100
</ELEMENT>

Then I can change element tag to <ELEMENT ScaleX="200"> and i get
img: 0,0 w=400 h=100
img: 600,0 w=400 h=100

<ELEMENT>
img: 100,100 w=200 h=100
img: 700,100 w=200 h=100
</ELEMENT>

If I use ScaleX=200 on this it would use relative co-ordinates so lowest x+y co-ords are 100,100 so that would be considered as 0,0 for scaling then readjusted back.
img: 100,100 w=400 h=100
img: 1300,100 w=400 h=100

 

[Pog]

Yes to all that! Actually a bit surprised as I've come to know the engine that these sort of things were not supported by now. Saying that, I do get the nature of open source projects with a long legacy and regression.

Anyhow I'm having a look at GEMA to see if it could be used for this sort of thing. It doesn't need to do much, define some variables, do some basic math, insert the results in various locations.

 

[Pog]

Gentlemen, I present Skinlets and a Skin Preprocessor for MediaPortal skining.

I'm a bit excited and tired so I'll let the proof of concept examples to the talking.

Add <import>skinlet-test.xml</import> to MyMusicPlayingNow.xml.
Run mp-pp.bat to process the skinlet.

You can edit $$skinlet-test.xml and have a mess with using the same bit of skin all over the shop. Rerun mp-pp.bat after changes.

This example handles all the painfully awkward timings for rotating animations using tweens/easing, which is nice and whole other story in itself.

 

[kiwijunglist]

to move my animation is a major pain in the ass .[DOUBLEPOST=1372608090][/DOUBLEPOST]to move my animation is a major pain in the ass .

 

[catavolt]

Here a small video (with CAMstudio - wrong framerate?) showing my implementation on NowPlaying screen

 

[kiwijunglist]

@mbuzina - are you using defines or styles throughout the skin to set the colour for all text? When you theme titan for colours it's quite hard because the colour codes are embedded a lot in individual xml files instead of referencing references.xml. Thought I should mention as this would be best practice and is easier to do proactively instead of retroactively.

 

[The_Stig]

Here a small video (with CAMstudio - wrong framerate?) showing my implementation on NowPlaying screen

Nice one. May I suggest to make the spinning CD a bit smaller? As in real life the CD is smaller as the case too ;-)

 

[mbuzina]

@mbuzina - are you using defines or styles throughout the skin to set the colour for all text? When you theme titan for colours it's quite hard because the colour codes are embedded a lot in individual xml files instead of referencing references.xml. Thought I should mention as this would be best practice and is easier to do proactively instead of retroactively.

Right now I still have hardcoded colors - but I will switch to defines (find & replace is your friend here). I also have Gfx with the Colors in them, so replacing them with a different color would mean creating a theme.

 

[Pog]

Did you add text info to the inside part, catavolt? Extra points for a shadow falling on the backdrop from the opening case

Got to be a better free video tool for showing off anims, a MS tool was mentioned earlier in the thread, anyone try it?

 

[catavolt]

Did you add text info to the inside part, catavolt?

Yes
Another hint: If you give the cover on top the spinning CD the ID 112, it will automatically change between artist image and cover image