如何用swift设置条形按钮的图像?

Dha*_*esh 51 uiimage uibarbuttonitem ios swift

我正在尝试设置一个图像为条形按钮项目,我有一个像这样的图像:

在此输入图像描述

分辨率30*30,但我将此图像分配给条形按钮它看起来像:

在此输入图像描述

我这样分配了图像:

在此输入图像描述

如果我尝试这样的方式就像为按钮创建一个IBOutlet并以编程方式设置Image形成这个问题和代码:

 // Outlet for bar button
 @IBOutlet weak var fbButton: UIBarButtonItem!

// Set Image for bar button
var backImg: UIImage = UIImage(named: "fb.png")!
fbButton.setBackgroundImage(backImg, forState: .Normal, barMetrics: .Default)
Run Code Online (Sandbox Code Playgroud)

但没有任何事情发生在这,

谁能告诉我我做错了什么?

或者哪种方式可以做到这一点?

Dha*_*esh 88

我用这段代码以编程方式实现了:

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        //create a new button
        let button: UIButton = UIButton.buttonWithType(UIButtonType.Custom) as! UIButton
        //set image for button
        button.setImage(UIImage(named: "fb.png"), forState: UIControlState.Normal)
        //add function for button
        button.addTarget(self, action: "fbButtonPressed", forControlEvents: UIControlEvents.TouchUpInside)
        //set frame
        button.frame = CGRectMake(0, 0, 53, 31)

        let barButton = UIBarButtonItem(customView: button)
        //assign button to navigationbar
        self.navigationItem.rightBarButtonItem = barButton
    }

    //This method will call when you press button.
    func fbButtonPressed() {

        println("Share to fb")
    }
}
Run Code Online (Sandbox Code Playgroud)

结果将是:

在此输入图像描述

同样的方法你也可以这样设置左侧的按钮:

self.navigationItem.leftBarButtonItem = barButton
Run Code Online (Sandbox Code Playgroud)

结果将是:

在此输入图像描述

如果您想要返回默认后退按钮时导航控制器具有相同的事务,那么您可以使用此代码使用自定义后退按钮实现此操作:

func backButtonPressed(sender:UIButton) {
    navigationController?.popViewControllerAnimated(true)
}
Run Code Online (Sandbox Code Playgroud)

对于swift 3.0:

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        //create a new button
        let button = UIButton.init(type: .custom)
        //set image for button
        button.setImage(UIImage(named: "fb.png"), for: UIControlState.normal)
        //add function for button
        button.addTarget(self, action: #selector(ViewController.fbButtonPressed), for: UIControlEvents.touchUpInside)
        //set frame
        button.frame = CGRect(x: 0, y: 0, width: 53, height: 51)

        let barButton = UIBarButtonItem(customView: button)
        //assign button to navigationbar
        self.navigationItem.rightBarButtonItem = barButton
    }

    //This method will call when you press button.
    func fbButtonPressed() {

        print("Share to fb")
    }
}
Run Code Online (Sandbox Code Playgroud)

对于swift 4.0:

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        //create a new button
        let button = UIButton(type: .custom)
        //set image for button
        button.setImage(UIImage(named: "fb.png"), for: .normal)
        //add function for button
        button.addTarget(self, action: #selector(fbButtonPressed), for: .touchUpInside)
        //set frame
        button.frame = CGRect(x: 0, y: 0, width: 53, height: 51)

        let barButton = UIBarButtonItem(customView: button)
        //assign button to navigationbar
        self.navigationItem.rightBarButtonItem = barButton
    }

    //This method will call when you press button.
    @objc func fbButtonPressed() {

        print("Share to fb")
    }
}
Run Code Online (Sandbox Code Playgroud)

  • 好的解决方案 我不认为你需要将它作为UIButton` let按钮:UIButton = UIButton.buttonWithType(UIButtonType.Custom)投射为!UIButton`实际上,在Swift 2.1中我们有这个:`let button:UIButton = UIButton(type:UIButtonType.Custom)` (8认同)
  • 对于swift 4,您还需要向`button`添加宽度和高度约束锚点,并将其`translatesAutoresizingMaskIntoConstraints`设置为false.例如.`button.widthAnchor.constriant(equalToConstant:53).isActive = true``button.heightAnchor.constraint(equalToConstant:51).isActive = true` (3认同)

小智 34

一个简单的解决方案可能如下

barButtonItem.image = UIImage(named: "image")
Run Code Online (Sandbox Code Playgroud)

然后转到Assets.xcassets选择图像并转到Attribute Inspector并在Reder中选择"Original Image"作为选项.

  • 此外,如果图像不在资产目录中,您可以使用 UIImage 扩展名 .withRenderingMode(.alwaysOriginal) 来实现相同的目的。UIImage(named: "image").withRenderingMode(.alwaysOriginal) (2认同)

jun*_*dev 21

类似于公认的解决方案,但您可以替换

let button: UIButton = UIButton.buttonWithType(UIButtonType.Custom) as! UIButton
Run Code Online (Sandbox Code Playgroud)

let button = UIButton()
Run Code Online (Sandbox Code Playgroud)

这是完整的解决方案,享受:(它比公认的解决方案更清洁)

let button = UIButton()
button.frame = CGRectMake(0, 0, 51, 31) //won't work if you don't set frame
button.setImage(UIImage(named: "fb"), forState: .Normal)
button.addTarget(self, action: Selector("fbButtonPressed"), forControlEvents: .TouchUpInside)

let barButton = UIBarButtonItem()
barButton.customView = button
self.navigationItem.rightBarButtonItem = barButton
Run Code Online (Sandbox Code Playgroud)

  • 对于Swift 4,您还需要在按钮上添加宽度和高度约束锚点,并将其translatesAutoresizingMaskIntoConstraints设置为false。例如。`button.widthAnchor.constriant(equalToConstant:51).isActive = true``button.heightAnchor.constraint(equalToConstant:31).isActive = true` (2认同)

Jov*_*vic 15

这是一个简单extensionUIBarButtonItem:

extension UIBarButtonItem {
    class func itemWith(colorfulImage: UIImage?, target: AnyObject, action: Selector) -> UIBarButtonItem {
        let button = UIButton(type: .custom)
        button.setImage(colorfulImage, for: .normal)
        button.frame = CGRect(x: 0.0, y: 0.0, width: 44.0, height: 44.0)
        button.addTarget(target, action: action, for: .touchUpInside)

        let barButtonItem = UIBarButtonItem(customView: button)
        return barButtonItem
    }
}
Run Code Online (Sandbox Code Playgroud)

  • 对于swift 4,您还需要向`button`添加宽度和高度约束锚点,并将其`translatesAutoresizingMaskIntoConstraints`设置为false.例如.`button.widthAnchor.constriant(equalToConstant:44).isActive = true``button.heightAnchor.constraint(equalToConstant:44).isActive = true` (5认同)

BSh*_*oks 12

我使用最新的swift(2.1)和答案(Dharmesh Kheni和jungledev)对我不起作用.图像颜色关闭(在IB中设置时,它是蓝色的,当直接在UIButton中设置时,它是黑色).事实证明我可以用以下代码创建相同的条形项:

let barButton = UIBarButtonItem(image: UIImage(named: "menu"), landscapeImagePhone: nil, style: .Done, target: self, action: #selector(revealBackClicked))
self.navigationItem.leftBarButtonItem = barButton
Run Code Online (Sandbox Code Playgroud)


小智 9

这只需要两行代码

Swift 3.0

let closeButtonImage = UIImage(named: "ic_close_white")
        navigationItem.rightBarButtonItem = UIBarButtonItem(image: closeButtonImage, style: .plain, target: self, action:  #selector(ResetPasswordViewController.barButtonDidTap(_:)))

func barButtonDidTap(_ sender: UIBarButtonItem) 
{

}
Run Code Online (Sandbox Code Playgroud)


apa*_*rna 5

您的问题是因为图标的制作方式 - 它不符合Apple的自定义标签栏图标规格:

To design a custom bar icon, follow these guidelines:

Use pure white with appropriate alpha transparency.
Don’t include a drop shadow.
Use antialiasing.
Run Code Online (Sandbox Code Playgroud)

从指南:

https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/BarIcons.html#//apple_ref/doc/uid/TP40006556-CH21-SW1

可能的东西看起来像这样.您可以在大多数免费标签栏图标网站上找到此类图标.

在此输入图像描述


Mr.*_*ani 5

您可以将此代码用于带有自定义图像的多个条形按钮:

self.navigationItem.leftBarButtonItem = nil

let button = UIButton(type: .custom)
button.setImage(UIImage (named: "ChatTab"), for: .normal)
button.frame = CGRect(x: 0.0, y: 0.0, width: 35.0, height: 35.0)
//button.addTarget(target, action: nil, for: .touchUpInside)
let barButtonItem = UIBarButtonItem(customView: button)

let button2 = UIButton(type: .custom)
button2.setImage(UIImage (named: "ActivityTab"), for: .normal)
button2.frame = CGRect(x: 0.0, y: 0.0, width: 35.0, height: 35.0)
//button.addTarget(target, action: nil, for: .touchUpInside)

let barButtonItem2 = UIBarButtonItem(customView: button2)
self.navigationItem.rightBarButtonItems = [barButtonItem, barButtonItem2]
Run Code Online (Sandbox Code Playgroud)

结果将是这样的:

在此处输入图片说明


小智 5

像下面这样初始化 barbuttonItem:

let pauseButton = UIBarButtonItem(image: UIImage(named: "big"),
                                  style: .plain,
                                  target: self,
                                  action: #selector(PlaybackViewController.pause))
Run Code Online (Sandbox Code Playgroud)