HTML5 - Some UMG images are flipped

Development Programming & Scripting UI
, , , , ,
1

I’ve encountered a few images in UMG where the images are flipped compared to the Editor. The most notable and easily reproduced example is including the Victory ColorPicker plugin. This ColorPicker plugin uses the Engine’s ColorPicker in a wrapper so I think it’s fair to address UE devs vs the plugin’s creator (I don’t think he maintains it anymore anyway). This might be related to [UE-40051][1] that couldn’t be reproduced.

ColorPicker in Editor/Windows64:

212925-colorwindows.png

ColorPicker in HTML5:

212926-colorhtml5.png

Notice how in HTML5 the blue and red are swapped and yellow and cyan are swapped compared to Windows but the default selected color is still Red. Just the image is flipped. This behavior is consistent in the latest versions of Chrome and Firefox.

Steps to reproduce:

  1. Create a new project
  2. Download the ColorPicker plugin [ New UMG Widget ] Color Picker UMG Widget, The Same Color Picker You Know and Love! - Community Content, Tools and Tutorials - Unreal Engine Forums . I chose the last official version (4.14) [ New UMG Widget ] Color Picker UMG Widget, The Same Color Picker You Know and Love! - #60 by Rama - Community Content, Tools and Tutorials - Unreal Engine Forums .
  3. Put the plugin folder inside your UE4 project’s Plugins folder.
  4. Make sure “HTML5” is whitelisted in the ColorPicker’s .upugin
  5. Make a simple UMG UI with the color picker.
  6. Compare the color wheel image in the Editor vs Windows Build vs HTML5
2

I think what happens here is that the image is not flipped (geometrically), but for some reason, RGB texture color channels are being misinterpreted as BGR order. That kind of issue causes red and blue to switch up with each other.

I have not heard this occur in HTML5 builds elsewhere, so not sure where the fix would be in. Perhaps the author of the plugin might have a clue, as he knows the code there. Or I wonder if there is a way to reproduce this outside plugins?