为什么自定义导航栏按钮图像被拉伸？

Question

我试图添加带有自定义图像的导航栏按钮。但是，无论我使用哪种方法，图像总是看起来被拉伸。

方法1：

    let barbuttonitem = UIBarButtonItem(image: UIImage(named: "apps_small"), style: .plain, target: self, action: nil)
    navigationItem.leftBarButtonItem = barbuttonitem

看起来像这样：

方法2：

    let button = UIButton(type: .custom)
    button.setImage(UIImage(named: "apps_small"), for: .normal)
    button.addTarget(self, action: #selector(TeachingRootViewController.appsTouched), for: .touchUpInside)
    button.frame = CGRect(x: 0, y: 0, width: 10, height: 10)
    button.bounds = CGRect(x: 0, y: 0, width: 10, height: 10)
    navigationItem.leftBarButtonItem = UIBarButtonItem(customView: button)

看起来像这样：

方法3：

    let button = UIButton(type: .custom)
    button.setImage(UIImage(named: "apps_small"), for: .normal)
    button.setTitle("Button", for: .normal)
    button.frame = CGRect(x: 0, y: 0, width: 10, height: 10)
    button.bounds = CGRect(x: 0, y: 0, width: 10, height: 10)
    button.imageEdgeInsets = .init(top: 5, left: 5, bottom: 5, right: 300)
    navigationItem.leftBarButtonItem = UIBarButtonItem(customView: button)
    navigationItem.leftBarButtonItem?.imageInsets = .init(top: 5, left: 5, bottom: 5, right: 300)

看起来像这样：

如您所见，标题消失了。

在UI层次结构中，它看起来像这样：

该按钮似乎占据了导航栏中的所有空格。

但是，带有系统项目的按钮没有问题：

有谁知道这个问题的原因吗？我想我已经没主意了。

Answer 1

上面的答案是一种解决方法，而不是适当的解决方法。正确的答案是您应该以正确的尺寸生成照片

• 资产@ 1x：22x22px
• 资产@ 2x：44x44px
• asset @ 3x：66x66px