UI Mask not working on HoloLens

I am working on a custom slider control and have used a UI Mask to give the slider a gauge like appearance.

The mask seems to work fine and display correctly in the Game view in Unity:

But when I run the project in the emulator or on the device the mask does not seem to work:

Here is an example from one of the controls of the Inspector view of the mask:

To create the mask itself I started with a png that has transparency in the areas that should be masked and some color value in the areas that the control should show through (the arc shape). After adding the png to my unity project I then change the Texture Type to Sprite (2D and UI) and assign that sprite to the source image of the image element that has the mask.

The mask png basically looks like this:

Originally I used black as the color value and my first thought was that the HoloLens treats black in a special way in certain contexts, so I changed my png to use the color green instead but got the same results.

Is this a HoloLens bug?

Are masks just not supported on HoloLens?
(if not, then please consider this a feature request)

Or am I doing something wrong and if so what might that be?

Windows Holographic User Group Redmond

WinHUGR.org - - - - - - - - - - - - - - - - - - @WinHUGR
WinHUGR YouTube Channel -- live streamed meetings

Best Answer

Answers

  • @HoloSheep,
    I made a very simple (read: no code) version of your scenario and am seeing the proper image on both the emulator and the HoloLens.

    My inspector settings are:

    I'm thinking the issue may lie in the control code. What are you doing to recolor and set the size of the bar?

    Thanks!
    David

  • @HoloSheep - it might help if you're able to share with us a few details like what Rendering Path you're set to, depth buffers setting, etc. I've seen a lot of issues like this with AR (for platforms other than HoloLens) and it usually comes down to an odd clear flags setting or a depth buffer issue. While you're looking at those settings, you may even stumble onto the solution. (That's what usually happens for me)

  • @DavidKlineMS Thank you for your first experiment with this.

    There is a little problem however with your test... it is a little too simple :-) which may be my fault for not explaining things well enough.

    You have successfully displayed the mask image, but what are you masking?

    This short Unity video might help in clarifying the idea.

    In my case the thing that my "green" mask is partially hiding is the blue slider image.

    Alternatively for your test to keep it simple you might add a child image to your first image and set that child's SourceImage to some photographic .jpg or something that you drag into the project and set its texture type to Sprite(2D and UI).

    Without a parent mask (or if you turn off the Image component in the parent image control) you will see the full photographic image.

    With the mask (when it works correctly) you should see only the portion of the image that shows through the shape of the mask with the rest of the image hidden by the mask.

    I believe displaying the mask (with Show Mask Graphic) as you have done, is mostly irrelevant except for those cases where the content that you are masking has some transparent areas .

    For example this basic structure in the Hierarchy:

    If I reuse my green arch shaped mask from above for the mask layer:

    And as a child image I use our WinHUGR logo (which has transparency):

    The results should look something like they do in both the Unity Scene and Game views:

    But unfortunately the HoloLens and the Emulator are showing it like this:

    Windows Holographic User Group Redmond

    WinHUGR.org - - - - - - - - - - - - - - - - - - @WinHUGR
    WinHUGR YouTube Channel -- live streamed meetings

  • @EddieOffermann
    Here is a screen grab of Project Settings | Player | Other Settings

    Besides checking off the suggested:

    • Use 16-bit Depth Buffers
    • VR Supported
      options I have pretty much left the other settings in this section at their default values.

    Any suggestions on a setting change that might correct the way UI masking is handled on the HoloLens?

    Windows Holographic User Group Redmond

    WinHUGR.org - - - - - - - - - - - - - - - - - - @WinHUGR
    WinHUGR YouTube Channel -- live streamed meetings

  • @HoloSheep,
    Thanks for the clarification. I will make the changes and give it another go.

    Thanks!
    David

  • @HoloSheep,
    Sorry for the delay on this. I am seeing a similar behavior to your scenario. I will take a deeper look and forward to the correct folks on the team.

    Thanks for bringing it to our attention.
    Davod

  • @HoloSheep,
    This definitely looks like a bug with Unity's UI Mask behavior. To achieve the same effect on HoloLens, I would suggest the following work-around:

    1) Switch your image order (make the mask image the child)
    2) Reverse transparency on your mask image (set the area that you want visible to transparent, and set the masked region to black).
    3) Remove the 'Mask' component from your mask image.

    Here's a screenshot of my set-up. This gave me the desired effect in both Unity and on the HoloLens:

  • @ahillier busy week and just getting to testing out your suggested work around.
    Unfortunately, it doesn't seem to work so well for the original slider customization that I needed this for.

    In the simplified scenario if the background of a single masked target is black this might do the trick, but when trying to stylize a UI component like a slider that has multiple parts and is displayed on a canvas that contains a quad with a glass like material assigned to it to serve as the form's background... this workaround starts to fall apart quickly and it becomes clear as to the purpose for the UI Mask component.

    The slider has multiple parts, things like the background, fill area, handle. Potentially each of those could have child masking images as you have suggested or it also looks like it might work with the suggested masking image as a peer to those elements. But.. the background of the control then becomes see thru from the black.

    I have tried adjusting the color of the masked area to match the color of the quad's material but that doesn't seem to work correctly. I have also tried swaping out the quad for an image as the canvas background, but none of the various combinations seem to give me the desired UI control component masking that would help with customizing a slider to appear as a gauge on a form.

    Thank you for the suggestion, and for taking the time to come up with it.

    I hope the mask behavior bug gets resolved quickly.

    This is a good example of why it would be so nice to have solid XAML support and integration inside of 3D apps to make rich form and UI creation more productive and flexible.

    Windows Holographic User Group Redmond

    WinHUGR.org - - - - - - - - - - - - - - - - - - @WinHUGR
    WinHUGR YouTube Channel -- live streamed meetings

  • ahillierahillier mod
    edited June 2016

    Sadness :(
    I'm hoping that Unity can fix this soon too. UI Masking is a nice feature.

  • Hello, is there any update on that problem ? I cannot put a simple mask on a list, which makes it unusable for a user.
    Thanks in advance

  • @tlabet I filled a bug through the Unity IDE

    Help | Report A Bug

    it is still showing a status of (Open)

    I encourage others who feel this feature is important to also submit a bug to Unity on this which might get it more visibility and a higher ranking on their bug list.

    They seem to be pretty good about regular releases and bug fixes.

    With any luck it might slip into the release version of Unity for HoloLens or whatever comes after the HTP.

    Windows Holographic User Group Redmond

    WinHUGR.org - - - - - - - - - - - - - - - - - - @WinHUGR
    WinHUGR YouTube Channel -- live streamed meetings

  • FYI - I have come across this issue and tried to bring it to the attention on the HoloLens crew at Unity in their forum as well... http://forum.unity3d.com/threads/ui-mask-failing-on-hololens-works-on-preview-fine.424998/

  • I am still having problem with the UI Mask, for some reason, it works in the Editor,but not working in the Simulator? Any ideas, this is killing me!

  • hello, try building the project again with "use 16-bit depth buffer" unselected. I used the ui mask. It is working for me.

Sign In or Register to comment.