How do I place my activityIndicator programmatically?

Question

I want to place my activityIndicator where I want it programmatically, but I don´t know how.

I know how to put it in the center of the screen:

activityIndicator.center = self.view.center

But I want something like this:

activityIndicator.activityIndicator(frame: CGRect(x: 100, y: 100, width: 100, height: 50))

But I can´t seem to make it work.

@AhmadF I want to place my activityIndicator where I want it, more specifically than just putting it in the center of the screen. — user9123, Mar 06 '18 at 12:43
"But I can´t seem to make it work", why? what's the output? — Ahmad F, Mar 06 '18 at 12:45
Try this url maybe you get the answer https://stackoverflow.com/questions/28785715/how-to-display-an-activity-indicator-with-text-on-ios-8-with-swift — Wings, Mar 06 '18 at 12:45
Try this url maybe it should help https://stackoverflow.com/questions/28785715/how-to-display-an-activity-indicator-with-text-on-ios-8-with-swift — Wings, Mar 06 '18 at 12:46

score 26 · Accepted Answer · edited Jul 14 '22 at 11:05

26

Basically, you can do this in just a few lines of code:

 func showActivityIndicatory() {
    let activityView = UIActivityIndicatorView(style: .whiteLarge)
    activityView.center = self.view.center
    self.view.addSubview(activityView)
    activityView.startAnimating()
}

If you need more controll on activityView please set Origin of container view to place activityindicator anywhere on the screen.

func showActivityIndicatory() {
    let container: UIView = UIView()
    container.frame = CGRect(x: 0, y: 0, width: 80, height: 80) // Set X and Y whatever you want
    container.backgroundColor = .clear
    
    let activityView = UIActivityIndicatorView(style: .whiteLarge)
    activityView.center = self.view.center
    
    container.addSubview(activityView)
    self.view.addSubview(container)
    activityView.startAnimating()
}

edited Jul 14 '22 at 11:05

Vinoth Vino

9,166
3
66
70

answered Mar 06 '18 at 12:44

Usman Javed

2,437
1
17
26

Please check now – Usman Javed Mar 06 '18 at 12:57
is "actInd" typo? – Peggy Nov 15 '18 at 07:51
to start this showActivityIndicatory(uiView: self.view) how to stop the activity indicator ? – vamsi Jun 20 '19 at 07:01
@vamsi you can do `activityView.startAnimating()` to start the animation and `activityView.stopAnimating()` to stop the activity indicator animation. – Matic Jun 21 '19 at 12:47
You don't need `activityView.startAnimating()` twice. ;) Important: 1. `GCRect(...)` places the top left corner of the container, better move the center with e.g. `container.center = self.view.center`. 2. If you move the container to the middle, then move the indicator to `activityView.center = self.view.center`, it ends up at the bottom right because it moves relatively to the container (because it's a subview). To have both the container and the indicator in the middle, you have to place the container in the middle, then move the indicator to `widthOfContainer/2` & `heightOfContainer/2`. – Neph Jun 26 '19 at 08:43

score 10 · Answer 2 · edited Apr 01 '21 at 14:07

10

You can declare:

var activityView: UIActivityIndicatorView?

And, in your class, create the next methods for showing or hiding the indicator:

func showActivityIndicator() {
    activityView = UIActivityIndicatorView(style: .large)
    activityView?.center = self.view.center
    self.view.addSubview(activityView!)
    activityView?.startAnimating()
}

func hideActivityIndicator(){
    if (activityView != nil){
        activityView?.stopAnimating()
    }
}

This code works for me. Good luck!

edited Apr 01 '21 at 14:07

colin

761
1
11
24

answered Nov 25 '19 at 11:41

jframosg

129
1
5

1

you don't need this line: `if (activityView != nil){` :) – AydinAngouti Sep 09 '20 at 15:53
You should also check if there is a running instance before you create a new instance and either close the running instance first or skip creating the new one. – SkeletorFromEterenia Apr 30 '21 at 14:58

score 7 · Answer 3 · answered Jun 21 '19 at 13:05

7

Swift 5:

let activityIndicator = UIActivityIndicatorView(style: UIActivityIndicatorView.Style.gray)

    // Place the activity indicator on the center of your current screen
            myActivityIndicator.center = view.center

    // In most cases this will be set to true, so the indicator hides when it stops spinning
            myActivityIndicator.hidesWhenStopped = true

    // Start the activity indicator and place it onto your view
            myActivityIndicator.startAnimating()
            view.addSubview(myActivityIndicator)

    // Do something here, for example fetch the data from API


    // Finally after the job above is done, stop the activity indicator
            myActivityIndicator.stopAnimating()

answered Jun 21 '19 at 13:05

Matic

393
3
12

2

`// Do something here, for example fetch the data from API` - If this is something that's going to take a couple of seconds, you should always do it in a background thread (so you don't block the main one), then switch back to the main thread once you're done and stop the indicator with: `DispatchQueue.main.async {self.myActivityIndicator.stopAnimating()}`. – Neph Jun 25 '19 at 13:41
@Neph That is correct and I absolutely agree. Good point, it might help someone in the future. – Matic Jun 26 '19 at 00:12

score 3 · Answer 4 · answered Sep 02 '21 at 02:27

Swift 4, Swift 5

Here if you prefer my daily/favorite programmatic pattern

// MARK: - Component
lazy var indicatorView: UIActivityIndicatorView = {
  let view = UIActivityIndicatorView(style: .medium)
  view.color = .white
  view.startAnimating()
  view.translatesAutoresizingMaskIntoConstraints = false
  return view
}()

// MARK: - Life Cycle
override func viewDidLoad() {
  super.viewDidLoad()
  setupViews()
  setupLayouts()
}

func setupViews() {
  addSubview(indicatorView)
}

    
func setupLayouts() {
  NSLayoutConstraint.activate([
    indicatorView.centerXAnchor.constraint(equalTo: centerXAnchor),
    indicatorView.centerYAnchor.constraint(equalTo: centerYAnchor)
  ])
}

How do I place my activityIndicator programmatically?

4 Answers4