Twitter APIで取得したツイートをiOSアプリ上で表示

この記事の内容

この記事は, 以前自分が書いた記事
Twitter APIを初めて触ってみる(ツイートを取得)
の続きとなります.

内容としては,
- Twitter APIで取得したツイートをTableView形式で表示する.
ことを行います.

環境

Swift5
Xcode 11.3.1

1. アプリの構成

アプリは以下の2つのViewControllerlクラスで成り立ちます.
- InitialViewController
(ユーザ名と取得するツイート数を入力してTimeLineViewControllerへ遷移)
- TimeLineViewController
(ツイートを取得, 取得したツイートを表示)

この記事の最後にコード全文をのせたリンクを載せておくので, この記事だけで分からなければ参照ください.

以下が, storyboardとなります. (本当に簡単なものです...)

実際にツイートを取得するとこんな感じになります.(完成図)
リプライの場合は, 相手のユーザネームを隠しています.

2.APIでツイートを取得, 表示

この記事のメインはAPIでツイートを取得し, それを表示することなので主にTimeLineViewControllerの処理を中心に書いていきます.

今回のアプリでは以下のライブラリを使用しました.(Cocoapodsでインストール)
- Alamofire
- SwiftyJSON
- SDWebImage

Cocoapodsのセットアップは以下を参照ください.
【Swift】CocoaPods導入手順

2-1.TwitterAPIでツイートを取得

Alamofireを用いて, HTTPリクエストを行います.

AF.request(urlText, method: .get, parameters: nil, encoding: 
JSONEncoding.default, headers: headers).responseJSON { (response) in

URL, ヘッダーは前記事でGETメソッドを行ったに使用したものと同じです.

AlamofireではHTTPリクエストをした後, responseに応じた処理をクロージャーで記述します.
クロージャ内では
- JSONをパース
- ツイートのテキストデータを配列に格納
- プロフィール画像のURLを取得
を行っています.

Twiiter APIで取得できるツイートのJSON形式に関しては, 以下をご覧ください.
Introduction to Tweet JSON

ヘッダーの" "の中には, 前回入手した自分のべアラトークンを入れてください.

$ curl -H "Authorization: Bearer AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA%2FAAAAAAAAAAAA
AAAAAAAA%3DAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA" 
'https://api.twitter.com/1.1/statuses/user_timeline.json?screen_name=twitterapi&count=100'

こちらは前回の記事の, curlでツイートを取得する際のコマンドです.
Bearerの部分から入れてください.

以下はツイートを取得するメソッドの全体です.

TimeLineViewController.swift

func getTweets(){
       let urlText = "https://api.twitter.com/1.1/statuses/user_timeline.json?screen_name=
                      \(screenName)&count=\(tweetCount)"
       let headers:HTTPHeaders = ["Authorization": ""]

        //Getメソッドでツイート取得
        AF.request(urlText, method: .get, parameters: nil, encoding: JSONEncoding.default, headers: headers).responseJSON { (response) in

            switch response.result{

            //リクエスト成功
            case .success:
                for i in 0..<self.tweetCount{
                    let json:JSON = JSON(response.data as Any)

                    //JSONをパースしてツイートを取得
                    let text = json[i]["text"].string!
                    //取得したツイートを配列に格納
                    self.tweetArray.append(text)

                    //JSONをパースしてプロフィール画像のURLを取得
                    let profileImageUrl = json[i]["user"]["profile_image_url_https"].string
                    //プロフィール画像のURLを取得
                    self.urlString = profileImageUrl!

                }
                break

            //リクエスト失敗
            case .failure(let error):
                print(error)
                break
            }

            self.tableView.reloadData()
        }
    }

2-2. 取得したツイートをTableViewで表示

tableViewの機能を使ってツイートを表示します.
cellForRowAtの中で, 取得したデータをセルに反映させます.

以下が, 主な機能のコードです.

TimeLineViewController.swift

    //セクションの数
    func numberOfSections(in tableView: UITableView) -> Int {
        return 1
    }

    //セルの数
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return tweetArray.count
    }

    //セルの構成
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
        let profileImageURL = URL(string: urlString as String)!

        //セルにプロフィール画像を表示させる
        cell.imageView?.sd_setImage(with: profileImageURL, completed: { (image, error, _, _) in

            if error == nil{
                print("Not error")
                cell.setNeedsLayout()
            }
            else{
               print(error)
            }
        })

        //セルにツイートを表示させる
        cell.textLabel?.text = self.tweetArray[indexPath.row]
        cell.textLabel?.adjustsFontSizeToFitWidth = true

        return cell
    }

    //セルが選択された時
    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        print("didSelectRowAt", indexPath.row)
        print("NSindexPath.row: ", (indexPath as NSIndexPath).row)
    }

最後に

以下は, コード全体を載せたレポジトリのリンクです.
https://github.com/MasakiSakai0305/TwitterAPIApp

SwiftとAPIの勉強のために, 今回ツイート取得をAPIで行い, それを表示するところまでまとめました.
自分と同じような勉強を始めたての方の理解の手助けになれたら幸いです.