导航视图中带有图像的按钮缩放不正确

Question

当我用作系统映像时，一切正常，但是我有一个大小为 512x512 的 png 图像，我想让它适合导航栏项。图像仅使用以下代码接管几乎所有屏幕：

var body: some View {
NavigationView {
Text("Main")            
.navigationBarTitle("Title", displayMode: .inline)
.navigationBarItems(leading:
Button(action: {
print("button pressed")
})
{
Image("menu")
.renderingMode(.template)
.resizable()
.aspectRatio(contentMode: .fit)
.scaledToFit()
}
)
.navigationViewStyle(StackNavigationViewStyle())
}
}

Answer 1

GeometryReader为您提供父级指定的区域。我发现指定的空间很小，但如果你把它扩大三倍，它就很合适。

import SwiftUI
struct NavItemImage: View {
var body: some View {
NavigationView {
Text("Main")
.navigationBarTitle(Text("Title").font(.largeTitle), displayMode: .inline)
.navigationBarItems(leading:
GeometryReader{geo in
Button(action: {
print("button pressed")
})
{
Image("menu")
.renderingMode(.original)
.resizable()
.aspectRatio(contentMode: .fit)
.scaledToFit()
.frame(width: geo.size.width * 3, height: geo.size.height * 3, alignment: .leading)
}
}
)
.navigationViewStyle(StackNavigationViewStyle())
}
}
}