Help us understand the problem. What is going on with this article?

【Swift】UIActivityIndicatorViewを使う【ぐるぐる】

More than 1 year has passed since last update.

1.はじめに

 非同期の処理を行っていることをユーザーにお知らせするために使うぐるぐる。
 使い方とカスタマイズを簡単にまとめます。

2.環境

Xcode Version 9.2
Swift Version 4.0.3

3.プロパティ説明

 UIActivityIndicatorView のプロパティとその初期値をまとめます。

プロパティ 説明 初期値
isAnimating アニメーションしているかどうか false
hidesWhenStopped アニメーションしていない時に非表示にするかどうか true
activityIndicatorViewStyle アクティビティインディケータのスタイルを指定する。.whiteLarge, .white, .gray から選択 .white
color アクティビティインディケータの色を指定する。activityIndicatorViewStyle よりも後に設定しないと効果がない UIColor.white

4.使い方

  • グローバル変数にUIActivityIndicatorView のインスタンスを定義
var activityIndicatorView = UIActivityIndicatorView()
  • viewDidLoad などで初期設定
override func viewDidLoad() {
    super.viewDidLoad()

    activityIndicatorView.center = view.center
    activityIndicatorView.activityIndicatorViewStyle = .whiteLarge
    activityIndicatorView.color = .purple

    view.addSubview(activityIndicatorView)
}
  • activityIndicatorView.startAnimating() でアニメーション開始

  • activityIndicatorView.stopAnimating() でアニメーション終了

5.アニメーションの開始/終了はメインスレッドで

タイトルの通り。アニメーションの開始/終了はメインスレッドで行います。

// アニメーション開始
activityIndicatorView.startAnimating()

DispatchQueue.global(qos: .default).async {
    // 非同期処理などを実行(今回は5秒間待つだけ)
    Thread.sleep(forTimeInterval: 5)

    // 非同期処理などが終了したらメインスレッドでアニメーション終了
    DispatchQueue.main.async {
        // アニメーション終了
        self.activityIndicatorView.stopAnimating()
    }
}

6.コード全体

 例として、ボタンでアニメーションの開始/終了を制御するコードを載せます。
 紫色のアクティビティインディケータを表示しています。
 「スタート」ボタンをタップするとアニメーションが開始し、5秒後にストップします。
 アニメーション中に「ストップ」ボタンをタップすると、5秒待たずにストップします。

class ViewController: UIViewController {
    var activityIndicatorView = UIActivityIndicatorView()

    @IBAction func startActivityIndicator(_ sender: UIButton) {
        activityIndicatorView.startAnimating()

        DispatchQueue.global(qos: .default).async {
            // 非同期処理などを実行
            Thread.sleep(forTimeInterval: 5)

            // 非同期処理などが終了したらメインスレッドでアニメーション終了
            DispatchQueue.main.async {
                // アニメーション終了
                self.activityIndicatorView.stopAnimating()
            }
        }
    }
    @IBAction func stopActivityIndicator(_ sender: UIButton) {
        activityIndicatorView.stopAnimating()
    }
    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .lightGray
        activityIndicatorView.center = view.center
        activityIndicatorView.activityIndicatorViewStyle = .whiteLarge
        activityIndicatorView.color = .purple

        view.addSubview(activityIndicatorView)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}


シミュレータで実行。
スクリーンショット.png

間違っている点や改善点などありましたら、ぜひフィードバックをお願いします。

Why do not you register as a user and use Qiita more conveniently?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away