[XCODE] クルクルっと回るUIActivityIndicatorViewの使い方、カスタマイズ

今日は、UIActivityIndicatorViewの使い方やカスタマイズ方法を記載したいと思います。
処理中にクルクルって回って、処理を行っている事をアピールするあいつです。簡単で便利に使えるので、 少し詳しく調べてみました。

UIActivityIndicatorViewとは

このViewは、処理を行っていたり、待ち中に表示されたりするUIです。
以下のようなものでクルクルと回って、「処理中だよー」「アプリがフリーズしたわけじゃないよー」と言った 内容を表現することが出来ます。

（UIActivityIndicatorViewの例）

UIActivityIndicatorViewの使い方

使い方はとっても簡単で、UIActivityIndicatorViewのインスタンスを作成して、 追加したいViewの上にサブビューとして追加すればOKです。
また、クルクル回したり、止めたりするのも簡単なメソッド呼び出しで実現出来ます。

（作るところ）

// インスタンスを作成する。
// initで指定するスタイルは、カスタマイズのところで説明を書きます。
UIActivityIndicatorView *indicator = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhiteLarge];

// 現在のサブビューとして登録する
[self.viewaddSubview:indicator];

（動き始めたり、止めたりするところ）

// 動き始める
[indicator startAnimating];

// 停止させる
[indicator stopAnimating];

以上で、使えるようになります。

UIActivityIndicatorViewをカスタマイズする

ここでは、何個か利用パターンに合わせてカスタマイズする方法を記載したいと思います(・∀・)

表示位置を画面の中央にしたい

表示位置を変更する場合には、viewのframeプロパティを変更すればOKです。
画面中央に表示する例を記載します。

// インスタンスを作る
UIActivityIndicatorView *indicator = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhiteLarge];
    
// 画面の中央に表示するようにframeを変更する
float w = indicator.frame.size.width;
float h = indicator.frame.size.height;
float x = self.view.frame.size.width/2 - w/2;
float y = self.view.frame.size.height/2 - h/2;
indicator.frame = CGRectMake(x, y, w, h);
        
// クルクルと回し始める
[indicator startAnimating];
    
// サブビューに追加する
[self.view addSubview:indicator];

大きさを変更する

大きさは２種類用意されているようです。インスタンス作成時のスタイル指定で、大きさを指定できます。

// 通常サイズのUIActivityIndicatorViewを作成する
UIActivityIndicatorView *indicator = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhite];

// 大きなUIActivityIndicatorViewを作成する
UIActivityIndicatorView *indicator = [[UIActivityIndicatorViewalloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhiteLarge];

色を変更する

色は自由に変更できるようです。colorプロパティに、好きな色のUIColorオブジェクトを設定します。

// 赤色にしてみる
indicator.color = [UIColorredColor];

クルクル停止時に非表示にしたい

処理が終了して、クルクルと回していたUIActivityIndicatorViewを止めた際に、 ついでに非表示にする設定があるようです。便利かも(*ﾟ▽ﾟ)ﾉ

indicator.hidesWhenStopped = YES;

参考資料

今回は、以下のクラスリファレンスを参照しました。詳細は以下をご参照ください。
UIActivityIndicatorView Class Reference

最後に

この便利なUIにもっと早く気付けば良かった。 前にUIImageを切り替えるアニメーションで、同様のものを自作してしまいました。
知識があるのと無いのとでの、作業効率の違いってこーゆうところからも生まれるんだなぁと感じた機能でした。
最後までご覧頂きましてありがとうございました(*ﾟ▽ﾟ)ﾉ