NavigationView 中带有图像的按钮缩放不正确答案

【问题标题】：Button with Image inside NavigationView scales incorrectlyNavigationView 中带有图像的按钮缩放不正确
【发布时间】：2020-02-08 23:10:47
【问题描述】：

当我用作系统图像时，一切正常，但我有一个大小为 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())
    }

}

【问题讨论】：

标签： swift swiftui navigationbar swift5 navigationview

【解决方案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())
        }

    }
}

【讨论】：