I was writing a SearchBar component in SwiftUI and I needed to combine a magnifying glass with the text input to mimic the Discord search bar:
We have multiple potential solutions for this case.
ZStackto layer views on top of each other
TextFieldto parent a magnifying glass icon.
Views have the ability to overlay child components on top of them with specific alignments that are relative to the parent view. This means we can use
.overlay() and an alignment to show a magnifying glass at the end of the TextInput.
ZStack is another possible solution to this particular issue. We chose to not go with it here because .overlay conveys a more direct parent/child relationship between our components whereas a
ZStack is a set of siblings overlaid on each other.
.overlay also lets us set alignment to the bounds of the parent view.
.overlay accepts alignments that correlate to positions as such: