【Swift × cocoapods】0から学ぶライブラリ(SSSwiftUIGIFView)の使い方

# 目的
Swift でライブラリ(SSSwiftUIGIFView)を使い GIF画像 を表示させる

# 結果
![シンプソンズ_画面収録.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/63da207e-70cf-117f-320a-0fc96a5c018e.gif)

# 前提
ファイルの構成


![スクリーンショット 2021-10-30 1.37.14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/40453430-2ad4-ec92-0606-c595b0b85ac7.png)
↓
![スクリーンショット 2021-10-30 1.37.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/df19f994-4055-8e7a-d86b-63821d30095f.png)




# 流れ
⓪ : CocoaPods をインストール
① : Podfile を作成する
② : ライブラリ Podfile に記載する
③ : Podfile の実行
④ : ライブラリをプログラムに追加する
⑤ : 使用するGIF画像を取得
⑥ : GIF画像を表示するプログラムを作成
⑦ : プログラムを実行して動作確認


## ⓪ : CocoaPods をインストール

CocoaPods とは?
(参考 : )
```sudo gem update --system```

CocoaPods をMacにインストール

```sudo gem install cocoapods```

エラーが出る場合
```sudo gem install -n /usr/local/bin cocoapods```

インストール後
```pod setup```

## ① : Podfile を作成する

ターミナルでプロジェクトファイルがある場所へと移動
```cd ~~~/対象のプロジェクトファイル```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/175ccad5-d29c-0969-4080-cb3536838655.png)


Podfile を作成する
```pod init```

![スクリーンショット 2021-10-30 1.40.49.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/2795417f-6417-100c-b077-74f60684ef5d.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/a976c143-c0ac-ecd8-7397-4b9b540ad683.png)


## ② : ライブラリ(SSSwiftUIGIFView)を Podfile に記載する
=== おまけ ===
？ SSSwiftUIGIFView とは？
GIF画像を表示するためのライブラリ
https://github.com/SimformSolutionsPvtLtd/SSSwiftUIGIFView

==============

Podfile を開く
[右クリック] → [このアプリケーションで開く] → [テキストエディット.app]

![スクリーンショット 2021-10-30 1.44.58.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/03ce6ad5-e7fe-e0c0-4119-3c0f59b80b52.png)

![スクリーンショット 2021-10-30 1.50.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/bf9a1a1f-e2d5-08f8-b9ac-cf8a4977b1ae.png)

[# Pods for Music] の1行下に追加
```pod 'SSSwiftUIGIFView'```

(バージョン指定)
```pod 'SSSwiftUIGIFView' '~> 1.0.0'```

![スクリーンショット 2021-10-30 1.51.56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/20d702f9-10ae-3263-aa8d-480dd8c58c9c.png)

[Command + S]で Podfile を保存
編集済み が消えていれば大丈夫
![スクリーンショット 2021-10-30 1.52.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/067687e1-98eb-5f6e-f1de-bc61eaf29127.png)
↓
![スクリーンショット 2021-10-30 1.52.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/324909ba-633a-c64e-1134-8079cefb355d.png)


## ③ : Podfile の実行
実行
```pod install```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/ee121ae1-691d-dd57-acd2-70a0c38a68f5.png)

実行後のファイル
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/0ed293ee-2e82-351c-00f9-60b38f656a7c.png)


## ④ : ライブラリをプログラムに追加する

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/46f9e977-1431-da72-ddea-e0afe27091f2.png)


白色の 「Music.xcworkspace」 からプログラムを開く
[ ContentView.swift ] のプログラムを開く
![スクリーンショット 2021-10-30 2.13.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/1b78a6ac-e69e-0c7c-447f-28ad70e64415.png)


プログラムを1行追加
```import SSSwiftUIGIFView```
![スクリーンショット 2021-10-30 2.17.05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/c3f13ec6-9e04-2497-3ce5-3d32fd73fec9.png)


## ⑤ : 使用するGIF画像を取得
好きなGIFをインターネットから取得してください

↓例
![スクリーンショット 2021-10-30 2.23.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/4b5632b7-4c6d-27f6-b30f-54fe673a1e52.png)


## ⑥ : GIF画像を表示

ダウンロードした GIF画像 を確認
![スクリーンショット 2021-10-30 2.23.05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/73e0f2e7-6323-e4ce-0c5d-5d0f801ad702.png)

GIF画像を XCode にドラッグ&ドロップ
![スクリーンショット 2021-10-30 2.25.37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/a947545b-8cb3-4f3f-a964-9ae0f4ef1599.png)

GIF画像を取り込む際の設定 (デフォルトから変更は特になし)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/acf32da5-9a6a-e51e-ee0b-60e5ea3ad24a.png)

GIF画像 が XCode に取り込まれているか確認 (SoundPlayer.swift は自作のファイルです。無視してください)
![スクリーンショット 2021-10-30 2.28.59.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/5b6fea98-3979-4347-a0e0-090b05b1979d.png)

ライブラリ SSSwiftUIGIFView の SwiftUIGIFPlayerView を使い、GIF画像を表示する
```SwiftUIGIFPlayerView(gifName: "シンプソンズ")```
( ```SwiftUIGIFPlayerView(gifName: "GIF画像名")``` )
![スクリーンショット 2021-10-30 2.30.30.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/ba365a78-c75b-936e-ada7-13a47580b5e3.png)


## ⑦ : プログラムを実行して動作確認
XCode と 実機(iPhone12mini) を繋いで、ビルドを行い動作確認。
(ビルドの方法は各自調べてみてください。参考になる記事たくさんあります。シミュレーターでビルドしても良い。)
![シンプソンズ_画面収録.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/764557/63da207e-70cf-117f-320a-0fc96a5c018e.gif)