Search Unity

Bug [2021.2.0b11] Background-color transition doesn't start from opacity=0 when no background-color set

Discussion in 'UI Toolkit' started by Midiphony-panda, Sep 9, 2021.

  1. Midiphony-panda

    Midiphony-panda

    Joined:
    Feb 10, 2020
    Posts:
    243
    Hello ! ^^

    This might not be considered a bug but that's something a UI designer in my team noticed.

    When adding a class with a background-color and a defined transition animation, the transition doesn't start with a transparent background. See the following gif :
    black-background-at-transition-start.gif

    In this case, the transition starts with a black background (when the warning icon appears) before easing into the final background color.

    Is it normal ?
    (I told them they should first set an initial background color but it's not as intuitive as they'd like)
     
  2. AlexandreT-unity

    AlexandreT-unity

    Unity Technologies

    Joined:
    Feb 1, 2018
    Posts:
    375
    It seems like a bug, could you submit a repro through the bug reporter please? Go to Help > Report a bug... and don't forget to add this forum link to the case and post the case number here for easier cross referencing. Thanks!
     
    Midiphony-panda likes this.
  3. Midiphony-panda

    Midiphony-panda

    Joined:
    Feb 10, 2020
    Posts:
    243
    Case 1365085, thanks ! :)
     
    AlexandreT-unity likes this.
  4. martinpa_unity

    martinpa_unity

    Unity Technologies

    Joined:
    Oct 18, 2017
    Posts:
    479
    Looking at the repro project from the bug report, I believe it is doing what it's supposed to do.

    When the background color is not set at all on the element, it will be resolved as rgba(0, 0, 0, 0), so transparent black. So in this case, the transition will go from transparent black to opaque white, so as the alpha is getting from 0 to 1, so will the actual color, giving the darker to lighter transition. If they want only the opacity to transition, they will need to have a selector setting the "default" color to rgba(255, 255, 255, 0).

    Note also that when using the rgba function, the alpha should be clamped between 0 and 1.

    However, I'm noticing that the transition is occurring in the Builder outside of the Preview mode, which it is not supposed to, so we'll go ahead and fix that.

    Hope this helps!