Hiển thị chỉ báo hoạt động bên trong UIButton

Question

Tôi muốn thay đổi nội dung của UIButton thành ActivityIndicator sau khi được nhấn.

Tôi biết các nút có một imageView và nhãn titleLabel, nhưng tôi không biết cách đặt chỉ báo hoạt động vào bất kỳ chỉ báo nào.

Đây là cách tôi có thể tạo các chỉ số hoạt động:

let aiView = UIActivityIndicatorView(activityIndicatorStyle: .Gray) 
aiView.startAnimating() 
aiView.center = CGPointMake(0,0) 
aiView.hidesWhenStopped = false 

Answer 1

Mã tìm thấy ở đây:

https://www.snip2code.com/Snippet/777050/iOS---Swift---UIButton-subclass-for-show/

import UIKit 

class LoadingButton: UIButton { 

    var originalButtonText: String? 
    var activityIndicator: UIActivityIndicatorView! 

    func showLoading() { 
     originalButtonText = self.titleLabel?.text 
     self.setTitle("", forState: UIControlState.Normal) 

     if (activityIndicator == nil) { 
      activityIndicator = createActivityIndicator() 
     } 

     showSpinning() 
    } 

    func hideLoading() { 
     self.setTitle(originalButtonText, forState: UIControlState.Normal) 
     activityIndicator.stopAnimating() 
    } 

    private func createActivityIndicator() -> UIActivityIndicatorView { 
     let activityIndicator = UIActivityIndicatorView() 
     activityIndicator.hidesWhenStopped = true 
     activityIndicator.color = UIColor.lightGrayColor() 
     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) 
    } 

} 

Answer 2

Cập nhật chọn câu trả lời (steve-Rosenberg) cho Apple Swift phiên bản 3.0.1 (swiftlang-800.0.58.6 clang-800.0.42.1) Xcode 8.1 (8B62)

import ObjectiveC 

private var originalButtonText: String? 
private var activityIndicator: UIActivityIndicatorView! 

extension UIButton{ 

    func showLoading() { 
     originalButtonText = self.titleLabel?.text 
     self.setTitle("", for: .normal) 

     if (activityIndicator == nil) { 
      activityIndicator = createActivityIndicator() 
     } 

     showSpinning() 
    } 

    func hideLoading() { 
     self.setTitle(originalButtonText, for: .normal) 
     activityIndicator.stopAnimating() 
    } 

    private func createActivityIndicator() -> UIActivityIndicatorView { 
     let activityIndicator = UIActivityIndicatorView() 
     activityIndicator.hidesWhenStopped = true 
     activityIndicator.color = UIColor.lightGray 
     return activityIndicator 
    } 

    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) 
    } 
} 

Answer 3

@ Boris: Đây không phải là tiện ích mở rộng.

Đây là trong 3 nhanh chóng, với mã cải tiến: nút vô hiệu hóa, hoạt động với hình ảnh và tiêu đề.

class LoadingButton: UIButton { 

    struct ButtonState { 
     var state: UIControlState 
     var title: String? 
     var image: UIImage? 
    } 

    private (set) var buttonStates: [ButtonState] = [] 
    private lazy var activityIndicator: UIActivityIndicatorView = { 
     let activityIndicator = UIActivityIndicatorView() 
     activityIndicator.hidesWhenStopped = true 
     activityIndicator.color = self.titleColor(for: .normal) 
     self.addSubview(activityIndicator) 
     activityIndicator.translatesAutoresizingMaskIntoConstraints = false 
     let xCenterConstraint = NSLayoutConstraint(item: self, attribute: .centerX, relatedBy: .equal, toItem: activityIndicator, attribute: .centerX, multiplier: 1, constant: 0) 
     let yCenterConstraint = NSLayoutConstraint(item: self, attribute: .centerY, relatedBy: .equal, toItem: activityIndicator, attribute: .centerY, multiplier: 1, constant: 0) 
     self.addConstraints([xCenterConstraint, yCenterConstraint]) 
     return activityIndicator 
    }() 

    func showLoading() { 
     activityIndicator.startAnimating() 
     var buttonStates: [ButtonState] = [] 
     for state in [UIControlState.disabled] { 
      let buttonState = ButtonState(state: state, title: title(for: state), image: image(for: state)) 
      buttonStates.append(buttonState) 
      setTitle("", for: state) 
      setImage(UIImage(), for: state) 
     } 
     self.buttonStates = buttonStates 
     isEnabled = false 
    } 

    func hideLoading() { 
     activityIndicator.stopAnimating() 
     for buttonState in buttonStates { 
      setTitle(buttonState.title, for: buttonState.state) 
      setImage(buttonState.image, for: buttonState.state) 
     } 
     isEnabled = true 
    } 

} 

Answer 4

Tuyệt vời @Steve,

có thể sử dụng dưới đây thực hiện thay vì dòng,

var activityIndicator: UIActivityIndicatorView!

sử dụng điều này, để nếu chúng ta định cấu hình chỉ báo hoạt động trước khi gọi showLoading(), ứng dụng sẽ không bị lỗi.

private var _activityIndicator:UIActivityIndicatorView! = nil 
var activityIndicator: UIActivityIndicatorView{ 
    set{ 
     _activityIndicator = newValue 

    } 
    get{ 
     if _activityIndicator == nil{ 
      _activityIndicator = createActivityIndicator() 
     } 
     return _activityIndicator 
    } 
} 

Answer 5

Swift 4.0 với một sửa đổi nhỏ

class LoadingUIButton: UIButton { 

    @IBInspectable var indicatorColor : UIColor = .lightGray 

    var originalButtonText: String? 
    var activityIndicator: UIActivityIndicatorView! 

    func showLoading() { 
     originalButtonText = self.titleLabel?.text 
     self.setTitle("", for: .normal) 

     if (activityIndicator == nil) { 
      activityIndicator = createActivityIndicator() 
     } 

     showSpinning() 
    } 

    func hideLoading() { 
     DispatchQueue.main.async(execute: { 
      self.setTitle(self.originalButtonText, for: .normal) 
      self.activityIndicator.stopAnimating() 
     }) 
    } 

    private func createActivityIndicator() -> UIActivityIndicatorView { 
     let activityIndicator = UIActivityIndicatorView() 
     activityIndicator.hidesWhenStopped = true 
     activityIndicator.color = indicatorColor 
     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) 
    } 

}