Set Activity Indicator in UIButton in Swift 3

Activity Indicator in UIButton

Some times we need to perform some action on clicking the button , and we have to wait for some time for respective result.Generally we use loader in middle of screen after data will come we close the loader. we can also show the loader on that where we have clicked and when the data will come we stop the loader and set the default text on UIButton which was previously set.

For this we need to follow some steps:

1: Take UIButton from StoryBoard.

2: Now select UIButton , and click on “Show the identity Inspector”

3: Now In Class write the custom class Name “LoadingButton”

4: Now Define This Class:

class LoadingButton: UIButton {
    
    var originalButtonText: String?
    var activityIndicator: UIActivityIndicatorView!
    
    func showLoading() {
        originalButtonText = self.titleLabel?.text
        self.setTitle("", for: UIControlState.normal)
        
        if (activityIndicator == nil) {
            activityIndicator = createActivityIndicator()
        }
        
        showSpinning()
    }
    
    func hideLoading() {
        self.setTitle(originalButtonText, for: UIControlState.normal)
        activityIndicator.stopAnimating()
    }
    
    private func createActivityIndicator() -> UIActivityIndicatorView {
        let activityIndicator = UIActivityIndicatorView()
        activityIndicator.hidesWhenStopped = true
        activityIndicator.color = UIColor.white
        return activityIndicator
    }
    
    private func showSpinning() {
        activityIndicator.translatesAutoresizingMaskIntoConstraints = false
        self.addSubview(activityIndicator)
        centerActivityIndicatorInButton()
        activityIndicator.startAnimating()
    }
    
    private func centerActivityIndicatorInButton() {
        let xCenterConstraint = NSLayoutConstraint(item: self, attribute: .centerX, relatedBy: .equal, toItem: activityIndicator, attribute: .centerX, multiplier: 1, constant: 0)
        self.addConstraint(xCenterConstraint)
        
        let yCenterConstraint = NSLayoutConstraint(item: self, attribute: .centerY, relatedBy: .equal, toItem: activityIndicator, attribute: .centerY, multiplier: 1, constant: 0)
        self.addConstraint(yCenterConstraint)
    }
    
}

class LoadingButton: UIButton {

var originalButtonText: String?

var activityIndicator: UIActivityIndicatorView!

func showLoading() {

originalButtonText = self.titleLabel?.text

self.setTitle("", for: UIControlState.normal)

if (activityIndicator == nil) {

activityIndicator = createActivityIndicator()

}

showSpinning()

}

func hideLoading() {

self.setTitle(originalButtonText, for: UIControlState.normal)

activityIndicator.stopAnimating()

}

private func createActivityIndicator() -> UIActivityIndicatorView {

let activityIndicator = UIActivityIndicatorView()

activityIndicator.hidesWhenStopped = true

activityIndicator.color = UIColor.white

return activityIndicator

}

private func showSpinning() {

activityIndicator.translatesAutoresizingMaskIntoConstraints = false

self.addSubview(activityIndicator)

centerActivityIndicatorInButton()

activityIndicator.startAnimating()

}

private func centerActivityIndicatorInButton() {

let xCenterConstraint = NSLayoutConstraint(item: self, attribute: .centerX, relatedBy: .equal, toItem: activityIndicator, attribute: .centerX, multiplier: 1, constant: 0)

self.addConstraint(xCenterConstraint)

let yCenterConstraint = NSLayoutConstraint(item: self, attribute: .centerY, relatedBy: .equal, toItem: activityIndicator, attribute: .centerY, multiplier: 1, constant: 0)

self.addConstraint(yCenterConstraint)

}

5: Now its time to use :

@IBOutlet weak var fetchLocationBtn: LoadingButton!

1	@IBOutlet weak var fetchLocationBtn: LoadingButton!

6: Crate the outlet as action of UIButton:

@IBAction func fetchLocationAction(_ sender: UIButton) {
         fetchLocationBtn.showLoading()
}

@IBAction func fetchLocationAction(_ sender: UIButton) {

fetchLocationBtn.showLoading()

}

7: Now In this function you can use any kind of call or function, and when the result will come

Simply

self.fetchLocationBtn.hideLoading()

1	self.fetchLocationBtn.hideLoading()

8: When it will stop , it will showing the default title in button.

kunal prasad 4 July 2023

. . .

Discuss on Helpdesk

Set Activity Indicator in UIButton in Swift 3

Activity Indicator in UIButton

Leave a Comment Cancel Reply

Message Sent!