Versa 2 only mask rendering issue

[sGerli]

Hi, I'm using masks in one of my clockfaces (Proficient Clock). They work on Versa 1 and Ionic so I supposed it should just work on Versa 2 (because the screen size is the same as Versa 1), but it turns out it doesn't. This is really frustrating because I don't have a Versa 2 to test possible fixes.

(Thanks to Gregoire for providing the image in the dev Discord.)
In that image you can see the issue on the big complication.
This clockface has been tested to work on Versa 1 and Ionic hardware.

Code sample:
Complication symbol on .gui

    <symbol id="complication-details">
      <mask id="mask">
        <rect width="155" height="60" />
        <circle cx="155" cy="30" r="30"/>
      </mask>
      <svg mask="#mask" width="185" height="60">
        <g id="detailAnimation" transform="translate(125,0)" pointer-events="visible">
          <circle cx="30" cy="30" r="30" fill="#ffffff"/>
          <rect x="30" width="155" height="60" fill="#ffffff" />
          <text x="168" y="44" id="text"
            font-family="Colfax-Medium" fill="black"
            font-size="40" font-weight="bold"
            text-anchor="end" text-length="6" />

          <animateTransform attributeType="translate" from="0,0" to="125,0" begin="disable" dur="0.5" final="keep" easing="ease-out" />
          <animateTransform attributeType="translate" from="125,0" to="0,0" begin="enable" dur="0.5" final="keep" easing="ease-out" />
        </g>
      </svg>
    </symbol>

That example is provided with the purpose of diagnosing and hopefully fixing that issue. You may use it as inspiration for your Fitbit SDK App, but please don't include an exact copy in your Fitbit SDK app without permission.

[JonFitbit]

This is a known issue with circle elements inside masks which only affects Versa 2. There's a fix coming in a future update, but for now you'll need to find a workaround, perhaps using images?

[sGerli]

Ok, thanks for your response.

I just submitted an update removing the mask and instead using a png to mask it.

[morningReign]

I'm afraid my solution is to skip the Versa 2 build.

...looking forward to this being fixed.

[morningReign]

After putting some thought into your comment, I shifted from masking to using images and I gotta say I really like the result:

I did go ahead and make a build for the Versa 2. It is in for review now.

That is one really sharp watch.

[AidanBlack]

Looks like it's not just circles - I tried substituting an arc and a rectangle, and the mask appears for a split second, then the entire background becomes visible until the display turns off again.

[AidanBlack]

Also I am on the Versa 3, not 2

[JasminS]

Issue appears on Sense too now, I've had reports from clockface users.