UIBarButtonItem image change for the Play / Pause button

Question

I am trying to make a play / pause button that toggles between custom images when clicked. Here is a snippet of code.

Everything works fine, but the button does not change. I also tried using the .image property instead of the .setBackGroundImage method, but then the button is just empty on click.

Here is the code

import UIKit import AVFoundation class ViewController: UIViewController { var audioPlayer = AVAudioPlayer() var pauseImage:UIImage? var playImage:UIImage? @IBOutlet weak var btnPlayPause: UIBarButtonItem! @IBOutlet weak var sldVolume: UISlider! @IBAction func sldVolumeChanged(sender: AnyObject) { audioPlayer.volume = sldVolume.value } @IBAction func actPressedPlayPause(sender: AnyObject) { if audioPlayer.playing { audioPlayer.pause() btnPlayPause.setBackgroundImage(playImage, forState: .Normal, barMetrics: .Default) } else { audioPlayer.play() btnPlayPause.setBackgroundImage(pauseImage, forState: .Normal, barMetrics: .Default) } } @IBAction func actStopPressed(sender: AnyObject) { audioPlayer.stop() audioPlayer.currentTime = 0 } override func viewDidLoad() { super.viewDidLoad() var pauseImagePath = NSBundle.mainBundle().pathForResource("pause", ofType: "png") pauseImagePath = pauseImagePath!.stringByAddingPercentEscapesUsingEncoding(NSUTF8StringEncoding) pauseImage = UIImage(contentsOfFile: pauseImagePath!) var playImagePath = NSBundle.mainBundle().pathForResource("play", ofType: "png") playImagePath = playImagePath!.stringByAddingPercentEscapesUsingEncoding(NSUTF8StringEncoding) playImage = UIImage(contentsOfFile: pauseImagePath!) var audioPath = NSBundle.mainBundle().pathForResource("minuetcminor", ofType: "mp3") audioPath = audioPath!.stringByAddingPercentEscapesUsingEncoding(NSUTF8StringEncoding) var error : NSError? = nil audioPlayer = AVAudioPlayer(contentsOfURL: NSURL(string: audioPath!), error: &error) } override func didReceiveMemoryWarning() { super.didReceiveMemoryWarning() // Dispose of any resources that can be recreated. } } 

Answer 1

had the same problem! If the two of us were confused why this does not work, I think this is a change in the Swift 2 / Xcode 7 beta version p>

Just do the following:

 btnPlayPause.image = UIImage(named: "myImage.png") 

Hope this helps!

Answer 2

Try the following line of code:

 btnPlayPause.setImage(image, forState: .Normal) 

it works for me.

Answer 3

@IBAction should use sender as UIButton instead of AnyObject or Any . Also, once this is done, the button can be directly accessed from within the function using sender . (This is Swift 3)

 @IBAction func actPressedPlayPause(sender: UIButton) { if audioPlayer.playing { audioPlayer.pause() sender.setBackgroundImage(UIImage(named: "playimage.png"), for: .normal) } else { audioPlayer.play() sender.setBackgroundImage(UIImage(named: "pauseimage.png"), for: .normal) } } 

Answer 4

This question seems to have a lot of strange answers. The truth is that there is no hacker way to change the image in an existing UIBarButtonItem. Instead, unfortunately, you need to recreate it. I made a helper method for this:

 func changeBarButtonItemImage(_ item: UIBarButtonItem, image: UIImage, navItem: UINavigationItem) -> UIBarButtonItem? { let buttonItem = UIBarButtonItem(image: image, style: item.style, target: item.target, action: item.action) buttonItem.isEnabled = item.isEnabled if let leftIndex = navItem.leftBarButtonItems?.index(of: item) { var items: [UIBarButtonItem] = navItem.leftBarButtonItems! items[leftIndex] = buttonItem navItem.leftBarButtonItems = items return buttonItem } if let rightIndex = navItem.rightBarButtonItems?.index(of: item) { var items: [UIBarButtonItem] = navItem.rightBarButtonItems! items[rightIndex] = buttonItem navItem.rightBarButtonItems = items return buttonItem } return nil } 

Using:

 if let image = UIImage(named: showingFilter ? "icon_filter_active.png" : "icon_filter.png") { if let buttonItem = changeBarButtonItemImage(self.filterButton, image: image, navItem: navigationItem) { self.filterButton = buttonItem } } 

Please note that I also copy the isEnabled property, because in my case, in some situations, I changed the button icon in the disabled state.