facebook twitter hatena line email

Ios/swift/TableView/API画像連動スクロール読み込み

提供: 初心者エンジニアの簡易メモ
移動: 案内検索

事前準備

以下を事前に見ておく

ios/swift/TableView/画像付き [ショートカット]

ios/swift/外部ライブラリ/Alamofire [ショートカット]

ios/swift/TableView/API画像連動 [ショートカット]

サンプル

一番下までスクロールすると次を読み込む

-ViewController.swift

import UIKit
import Alamofire
class ViewController: UIViewController ,UITableViewDataSource, UITableViewDelegate {
   @IBOutlet weak var imgTableView: UITableView!
   private var _imgs: Array<ImgInit> = []
   private var isLoading: Bool = false
   private var _page: Int = 1
   private var _noScroll: Bool = false // スクロールしないように
   override func viewDidLoad() {
       super.viewDidLoad()
       imgTableView.registerClass(UITableViewCell.self, forCellReuseIdentifier: "Cell")
       imgTableView.delegate = self
       imgTableView.dataSource = self
       execApi()
   }
   private func execApi() {
       Alamofire.request(.GET, "http://localhost/api/testimgs", parameters: ["page": String(self._page)]).responseJSON { response in
           if response.result.isSuccess {
               let jsonDic = response.result.value as! NSDictionary
               let imgs = jsonDic["imgs"] as! NSArray
               let cnt = jsonDic["cnt"] as! Int
               print(cnt)
               for img in imgs {
                   let name:String = img["name"] as! String
                   let thumbnail:String = img["thumbnail"] as! String
                   let _img = ImgInit(name: name, thumbnail: thumbnail) as ImgInit
                   self._imgs.append(_img)
               }
               if imgs.count == 0 {
                   self._noScroll = true
               }
               self.imgTableView.reloadData() // 更新
               self.isLoading = false
           }
       }
   }
   override func didReceiveMemoryWarning() {
       super.didReceiveMemoryWarning()
   }
   func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
       return self._imgs.count
   }
   func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
       print(self._imgs[indexPath.row].thumbnail)
       let cell =
           tableView.dequeueReusableCellWithIdentifier("CustomCell") as! CustomTableViewCell
       cell.setCell(self._imgs[indexPath.row].thumbnail, text: self._imgs[indexPath.row].name)
       return cell
   }
   func scrollViewDidScroll(scrollView: UIScrollView) {
       if _imgs.count == 0 || self._noScroll {
           return;
       }
       var contentOffsetWidthWindow = self.imgTableView.contentOffset.y + self.imgTableView.bounds.size.height * 10; // 通常は1。上げればスクロールが滑らかに
       let eachToBottom = contentOffsetWidthWindow >= self.imgTableView.contentSize.height
       if (!eachToBottom || self.isLoading) {
           return;
       }
       self.isLoading = true
       self._page = self._page + 1
       execApi()
   }
}

phpのapi

   $ret = array(
     'cnt' => 2,
     'imgs' => array(
       array(
         'thumbnail' => "https://pbs.twimg.com/media/ClupGSKWEAAeOuy.jpg",
         'name' => "オバマさんですね。アメリカの大統領です。",
       ),
       array(
         'thumbnail' => "https://pbs.twimg.com/media/ClfZX4sWEAEeJzB.jpg",
         'name' => "ドロイド君",
       ),
       array(
         'thumbnail' => "https://pbs.twimg.com/media/ClFgRKtXIAAcm-R.jpg",
         'name' => "マウス",
       ),
     ),
   );
   if ($this->_request->page == 2) {
     $ret = array(
       'cnt' => 2,
       'imgs' => array(
         array(
           'thumbnail' => "https://pbs.twimg.com/media/Ck7LQnzW0AITBE4.jpg",
           'name' => "Gマーク",
         ),
         array(
           'thumbnail' => "https://pbs.twimg.com/media/CkxaDvYXAAAImMg.jpg",
           'name' => "虹",
         ),
         array(
           'thumbnail' => "https://pbs.twimg.com/media/CknM9DfW0AAzarB.jpg",
           'name' => "たこ",
         ),
       ),
     );
   } elseif ($this->_request->page == 3) {
     $ret = array(
       'cnt' => 2,
       'imgs' => array(
         array(
           'thumbnail' => "https://pbs.twimg.com/media/Ckhj0RoVAAAsEsq.png",
           'name' => "鳥です",
         ),
         array(
           'thumbnail' => "https://pbs.twimg.com/media/CkCTWXaWsAAKj_i.jpg",
           'name' => "ドーナツ",
         ),
       ),
     );
   }
   echo json_encode($ret);

参考

http://kimagureneet.hatenablog.com/entry/2015/05/16/120917