やりたいこと
添付画像の右側のように、Alamofireを使って取得したJSONデータをコレクションビューに表示したいです。
困っていること
起動すると添付画像の左側のようにセルの枠のみ表示されている状態になります。
しかし、画面をスクロールして戻すと思ったような表示になってしまいます。
起動時から右側のように表示させるにはどうしたら良いでしょうか?
コード
swift
1//CatalogViewController.swift 2 3import UIKit 4import Alamofire 5import SwiftyJSON 6 7class CatalogViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout { 8 9 @IBOutlet weak var displayToken: UILabel! 10 @IBOutlet weak var collectionView: UICollectionView! 11 12 @IBAction func logout(_ sender: UIButton) { 13 UserDefaults.standard.removeObject(forKey: "token") 14 performSegue(withIdentifier: "returnToLogin", sender: nil) 15 } 16 17 var products: JSON = [] 18 19 override func viewDidLoad() { 20 if let _ = UserDefaults.standard.object(forKey: "token") { 21 displayToken.text = UserDefaults.standard.object(forKey: "token") as? String 22 } 23 24 let layout = UICollectionViewFlowLayout() 25 layout.sectionInset = UIEdgeInsets(top: 15, left: 15, bottom: 15, right: 15) 26 collectionView.collectionViewLayout = layout 27 28 getProducts() 29 } 30 31 override func didReceiveMemoryWarning() { 32 super.didReceiveMemoryWarning() 33 } 34 35 func getProducts() { 36 37 let url = "http://xxx.com/api/products" 38 let token = UserDefaults.standard.object(forKey: "token") as? String 39 let authorization = "Bearer " + token! 40 let headers: HTTPHeaders = ["Authorization": authorization, "Accept": "application/json"] 41 42 Alamofire.request(url, method: .get, headers: headers).responseJSON { 43 res in 44 if res.result.isSuccess { 45 if let returnValue = res.result.value { 46 self.products = JSON(returnValue) 47 print("取得成功") 48 print(self.products) 49 } 50 } else { 51 print("取得に失敗しました") 52 } 53 } 54 } 55 56 func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { 57 58 // 識別子("Cell")によって特定された再利用可能なセルオブジェクトを取り出す 59 let cell: ProductCell = collectionView.dequeueReusableCell(withReuseIdentifier: "Product", for: indexPath) as! ProductCell 60 61 if self.products[indexPath.row]["thumbnail"].string != nil { 62 let imageUrlString: String = "http://www.com/data/thumbnail/" + self.products[indexPath.row]["thumbnail"].string! 63 64 cell.productImage.image = getImageByUrl(url: imageUrlString) 65 } 66 67 cell.productName.text = self.products[indexPath.row]["name"].string 68 cell.productNumber.text = self.products[indexPath.row]["number"].string 69 70 cell.backgroundColor = .red 71 72 return cell 73 } 74 75 func getImageByUrl(url: String) -> UIImage { 76 let url = URL(string: url) 77 do { 78 let data = try Data(contentsOf: url!) 79 return UIImage(data: data)! 80 } catch let err { 81 print("Error: (err.localizedDescription)") 82 } 83 return UIImage() 84 } 85 86 func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize { 87 let horizontalSpace: CGFloat = 20 88 let cellSize: CGFloat = self.view.bounds.width / 3 - horizontalSpace 89 return CGSize(width: cellSize, height: cellSize * 1.618) 90 } 91 92 // セクションの数 93 func numberOfSections(in collectionView: UICollectionView) -> Int { 94 return 1 95 } 96 97 // セルの数 98 func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { 99 return 20 100 } 101}
回答1件
あなたの回答
tips
プレビュー