0
241
ViewsHow do I make an Image in Swift the same height as the text next to it?
I'm brand new to Swift and am making an iOS Minesweeper app. At the top of the screen I want to have an image of a bomb next to a Text() object displaying the number of bombs remaining.
I'd like to have the image and/or HStack resize to whatever the height of the adjacent text is without having to hard-code it's dimensions.
Can/how this be achieved?
The code so far looks like this:
HStack(alignment: .center, spacing: 10) {
Image("top_bomb")
.resizable()
.aspectRatio(contentMode: .fit)
Text(String(game.bombsRemaining))
.font(.system(size: 30, weight: .bold, design: .monospaced))
}
.frame(width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height * 0.1, alignment: .trailing)
And it looks like:
·
Santiago Trujillo
2 answers
Answer question0
@State var labelHeight = CGFloat.zero
HStack(alignment: .center, spacing: 10) {
Image("top_bomb")
.resizable()
.aspectRatio(contentMode: .fit)
.frame(maxHeight: labelHeight)
Text(String(game.bombsRemaining))
.font(.system(size: 30, weight: .bold, design: .monospaced))
.overlay(
GeometryReader(content: { geometry in
Color.clear
.onAppear(perform: {
self.labelHeight = geometry.frame(in: .local).size.height
})
})
)
}
.frame(width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height * 0.2, alignment: .trailing)
·
Santiago Trujillo
Report
0
You just need to fix it by size, like
HStack(alignment: .center, spacing: 10) {
Image("top_bomb")
.resizable()
.aspectRatio(contentMode: .fit)
Text(String(game.bombsRemaining))
.font(.system(size: 30, weight: .bold, design: .monospaced))
}
.fixedSize() // << here !!
.frame(maxWidth: .infinity, alignment: .trailing) // << !!
Note: also pay attention that you don't need to hardcode frame to screen size
·
Santiago Trujillo
Report
Answer question