Incorrect scale bar width after resizing map view

[datwelk]

Environment

• Xcode version: 12.5 (12E262)
• iOS version: 14.5.1
• Devices affected: N/A
• Maps SDK Version: 10.0.0-beta.20

Observed behavior and steps to reproduce

• Initialize a map inside viewDidLoad with a zero origin and fixed size 200 (height and width)
• Make sure the scaleBar position is topRight
• Change the frame of the map to the frame of the superview

The right half of the scale bar is partly positioned off-screen.

Expected behavior

The scale bar is positioned within the bounds of the map view.

Notes / preliminary analysis

In the view hierarchy inspector, we can see that the first subview of MapboxScaleBarOrnamentView, the staticContainerView, is correctly positioned within the map's bounds. Its subview dynamicContainerView however, is positioned partially off-screen.

If the map is initialized with a larger fixed with, and it is resized again thereafter, the scale bar is positioned too far from the right edge:

In this case the static container view is larger than its dynamically calculated content:

Most likely this is caused by this line calculating the maximum width of the static container. The map was initialized with a width of 200 points, so 50% of that results in a max width of 100 points. The max width constraint is never updated when the scale bar view changes size. I would suggest that the line above adds a constraint relative to the superview's width, as opposed to a fixed constant contraint:

staticContainerView.widthAnchor.constraint(equalTo: self.widthAnchor, multiplier: 0.5).isActive = true

However this will not fix the issue: the dynamic content is laid out from left-to-right, so we will still see a gap on the right side between the scale bar and the map edge, depending on the map's actual zoom level. The dynamic content layout logic needs to change to lay out the bars from right-to-left instead of LTR if the ornament's position is on the right side of the map instead of the left.

Additional links and references

[datwelk]

The positioning part of this issue is fixed by https://github.com/mapbox/mapbox-maps-ios/pull/436. That PR does not fix the width issue.

[ZiZasaurus]

@datwelk I've tried your recommendation with a modification and, while it seems to be part of the solution, there are other issues that have emerged and we will need to do a deeper dive to redesign this class.

[datwelk]

Hi @ZiZasaurus and @tyofemi - what's the status of this ticket?

[datwelk]

Hi @tyofemi @ZiZasaurus what is the status of this issue?