I’m trying to make a UI bar (sort of like an exp or hp bar) using a frame with UIGradient instead of just a flat colour. The problem is that, if I resize the frame with the gradient, the colors shift along with the frame size, which is expected behavior.
This is what it looks like: Bar with gradient resizing normally.
The red and black keep stretching accordingly.
What I’d like it make is a bar that gradually expands, revealing the black as it gets longer, using the following set-up:
The Bar frame is what actually grows in size and has ClipDescendants set to true, while the background actually have its size directly changed, it stays always the same. To keep it the same size the whole time, I’m using these 2 constraints:
UIAspectRatio constraint keep the background frame a rectange, while UISizeConstraint should prevent the background Y size from shrinking when the Bar frame is resized, due to the AspectRatio influence.
However, this happens instead:
The background Y size shrinks too, revealing the Bar frame underneat (the white).
PROPERTIES:
- Bar Frame:
- Background Frame:
- UIAspectRatio (the 44.64 aspect ratio is the background’s width divided by the height)
- UISizeConstraint (giving it a minimum of 100px in height so it doesn’t shrink, but for some reason it still does shrink)
How can i prevent the frame from shrinking vertically, while keeping the whole thing adaptable on different device sizes? Am I doing something wrong?
