未分類

collectionViewCellにラベルを設置する2つの方法

投稿日:2020年7月29日 更新日:

collectionViewCellの中にLabelを配置したい。

1. StoryBoardで設置する方法

新たなファイルを作らず簡単に設置できる。

cell内にLabel配置→Tagを1にする→コードを書く

//セルに情報を入れる関数
    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        //表示するセルの登録
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath)
        cell.backgroundColor = .white //セルの色
        
        //境界線
        cell.layer.borderColor = UIColor.lightGray.cgColor
        cell.layer.borderWidth = 0.3
        
        //ラベル
        let label = cell.contentView.viewWithTag(1) as! UILabel
        label.text =  "hi"
        label.textColor = UIColor.red
        
        return cell
    }

参考:CollectionViewの使い方

2. collectionViewCellファイルを別に作ってコードで配置する方法

Storyboard上でラベルを設置しなくてよい。

サブクラスがcollectionViewCellのファイル「CollectionViewCell.swift」を作成
→storyboardのcellに対応するCustomClassをさっき作った「CollectionViewCell」に設定
→CollectionViewCell.swiftで以下のようにLabelを生成して必要なコードを書く

import UIKit

class CalendarCell: UICollectionViewCell {
    
    var textLabel: UILabel!
    
    required init(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)!
        
        // UILabelを生成
        textLabel = UILabel(frame: CGRect(x: 0, y: 0, width: self.frame.width / 6, height: self.frame.height / 5))
        textLabel.font = UIFont(name: "HiraKakuProN-W3", size: 13)
        textLabel.textAlignment = NSTextAlignment.center
        textLabel.text = "a"
        textLabel.backgroundColor = .lightGray
        textLabel.textColor = .black
        // Cellに追加
        self.addSubview(textLabel!)
    }
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        
    }
}

・補足:CollectionViewCell.swiftで生成したlabelをViewController.swiftで扱う方法

//表示するセルの登録
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: “cell”, for: indexPath) as! CalendarCell

最後にas! CalendarCellをつけることで、cell.textLabel.text = “b”みたいに使える。

//セルに情報を入れる関数
    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        //表示するセルの登録
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath) as! CalendarCell
        cell.backgroundColor = .white
        //境界線
        cell.layer.borderColor = UIColor.lightGray.cgColor
        cell.layer.borderWidth = 0.3
        
        //テキスト
        cell.textLabel.text = "b"
        return cell
    }

-未分類

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

エフェクトを組み合わせて集中線をつける

  「フラクタルノイズ」でストライプをつくる。 「極座標」で円状にする。 「ポスタリゼーション時間」で1秒間のフレームを変えてコマ送りのアニメっぽくする。 描画モードで集中線の色を変えれる。 …

no image

TextViewにPlaceholderを追加する簡単な方法

TextViewはTextFieldのようにPlaceholderを設定できないため、自分で実装する必要がある。 ここでは、TextViewの上にLabelを設置し、TextViewの入力判定を行い、 …

no image

画面遷移する時に値を渡す

1.遷移先で値を受け取るための変数を宣言しておく。 class NextViewController: UIViewController { @IBOutlet weak var label2: UI …

no image

datePickerModeでdatePickerの表示を変更する

datePickerModeプロパティを使うことで、datePickerの表記を変更することができる。 UIDatePicker.Mode.dateで設定する。 dateのところは、date,time …

no image

他ファイルの変数を使う

ViewControllerで宣言した変数を、NextViewControllewで使う方法。 let test = “テスト” let viewController = ViewController …