WIP Animated diffuse colors
#1
Recently, I've been busy diving down our GUI rendering pipeline. After analyzing some skins and the way they are rendered, I've found some places for improvement.

One thing that stands out is the usage of featureless textures spanning the whole screen, just to apply a color filter for fanart and similar assets. This can be achieved with diffuse coloring, but this is static.

So I figured, animating the diffuse color would be a nice addition. It works almost like the normal fading, except it accepts AARRGGBB values at its input. This filters the logo in Estuary between red and green:
xml:
<control type="group">
  <depth>DepthBars</depth>
  <animation effect="slide" end="0,-90" time="300" tween="sine" easing="inout" condition="$EXP[infodialog_active]">conditional</animation>
  <animation effect="fadediffuse" start="FFFF0000" end="FF00FF00" time="300">WindowOpen</animation>
  <animation effect="fadediffuse" start="FF00FF00" end="FFFF0000" time="200">WindowClose</animation>
  <top>30</top>
  <left>90</left>
  <control type="image">
    <left>4</left>
    <top>0</top>
    <aspectratio>keep</aspectratio>
    <width>192</width>
    <height>56</height>
    <texture>special://xbmc/media/vendor_logo.png</texture>
  </control>
</control>

Using this, I would advice not to have any other diffuse color on the image, as stacked effects are detrimental to the output.

Here is a build for Win64: http://mirrors.kodi.tv/test-builds/windo...ng-x64.exe
For other systems, you need to build it yourself: https://github.com/sarbes/xbmc/tree/advancedfading

Feedback is highly appreciated.
Reply
#2
I tested it and it works as you explained.

Thanks!
If I have helped you or increased your knowledge, please click the 'thumbs up' button to give thanks :)
Reply
#3
@manfeed: Is there anything that could be improved? Would you use this in your skin? I want this to be ready for Nexus, so I would like to get some more feedback.

It would be awesome if you could provide two or three screenshots showing off this feature. I'm not too versed with the skinning side of things.
Reply
#4
(2022-06-03, 19:51)sarbes Wrote: @manfeed: Is there anything that could be improved? Would you use this in your skin? I want this to be ready for Nexus, so I would like to get some more feedback.

It would be awesome if you could provide two or three screenshots showing off this feature. I'm not too versed with the skinning side of things.
I only did a quick test, but everything seems to work well so far.

I tested it with the 'pulse' animation option and that way I got an image changing from one colour to another and back, non-stop.

It's a nice addition, but I haven't thought where to use it just yet. Anyway, a screenshot wouldn't make it justice, since the effect would go unnoticed in a static image.

Thanks again!
If I have helped you or increased your knowledge, please click the 'thumbs up' button to give thanks :)
Reply
#5
Hi @sarbes this is great, and it's huge for my skin Copacetic, which makes heavy use of transparency layers. Excited to test this out!
Reply
#6
The PR is in and should be build in the next nightly. Please test it as much as you can.
Reply
#7
@sarbes - Are there any performance considerations when using this as a conditional animation? I currently use two image controls for ListItem.Icon to palette switch white DefaultFoo.png using a visibility condition. Using a conditional colordiffuse animation would allow me to use one instead but I'm wondering if it would give me better or worse performance generally

So my current approach is:
xml:

<control type="image">
<colordiffuse>white</colordiffuse>
<texture background="true">$INFO[ListItem.Icon]</texture>
<visible>!String.StartsWith(ListItem.Icon,Default)</visible>
</control>
<control type="image">
<colordiffuse>dimgrey</colordiffuse>
<texture background="true">$INFO[ListItem.Icon]</texture>
<visible>String.StartsWith(ListItem.Icon,Default)</visible>
</control>


But a fadediffuse animation allows me to replace this block with a single image control like in the following, which is a massive plus in terms of cleaner and simpler skin code:

xml:

<control type="image">
<texture background="true">$INFO[ListItem.Icon]</texture>
<animation effect="fadediffuse" start="white" end="dimgrey" time="0" condition="String.StartsWith(ListItem.Icon,Default)">Conditional</animation>
</control>


My intuition is that reducing the number of controls would give better performance; and even if performance is essentially the same, the code simplification benefit is reason enough to switch to this new approach. But I just wanted to check before I make the leap that I'm not going to make performance worse!
Arctic Fuse - Alpha now available. Support me on Ko-fi.
Reply
#8
I would not expect a considerable performance difference.
Reply

Logout Mark Read Team Forum Stats Members Help
Animated diffuse colors0