Margin Values calculated without considering shadow around button in developer link.

[ravishankarravindranath]

Issue Background :

Created a Button in XD with rectangle (wxh : 240dp x 56dp).

Added Shadow Effect. Some pixels added around the button to create the shadow.

These shadow pixels are not accounted into the overall width and height of the button in the shared Developer Link.

But these shadow pixels get added to the exported png assets.

There by making the button size 300px x152px.

Observation:

The size of the button in the developer link is 240 x 56 dp. (OK)

The size of the button, when exported as png is 300 x 152 px. (OK)

The margin values to the button are shown in the developer link are based on the (240x56)dp without considering the shadow pixels. (Not OK)

Using the above margin values with exported png for UI Development results in a mismatch with the design spec. (Not OK)

Example:

Button Size : 240dp x 56dp

Button Exported as PNG Size : 300 x 152px

Button Left Margin:  214 dp

When this left margin of 214dp is applied to the exported png an additional 60dp(300-240) gets into the margin. (Not Ok)

Issue :

The developer link gets the margin values to the button based on (240x56).

But these margin values fail when used with exported PNG (300x152).

Expected Result:

Once the shadow is added the margin values to the button should be updated considering the shadow pixels.

Request: Is there any existing solution for this? 

Thank You

[HARSHIKA_VERMA]

Hi Ravishan,

Thank you for reaching and elaborating on the issue. In order to escalate the issue further for investigation. We would like to know the OS and XD versions of your machine. Is it possible for you to create a video as well for the issue so that our team gets better clarity on it?

We will try our best to investigate the issue.

Thanks,

Harshika