未分類

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

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

関連記事

no image

NavigationControllerを用いた画面遷移(コードのみ)

NavigationControllerの画面遷移で、ストーリーボードの黄色丸からドラックする方法ではなく、コードのみを用いて遷移する方法。 準備 ・遷移元Viewcontroller、遷移先Next …

no image

テキストアニメ、モーションのフリーテンプレート使い方

【商用利用OK】Premiere Proのテキストアニメーション・テンプレート100種類 .mogrtのフォントがpremiere proで変更できない時の対処法

no image

StaticCellでコードから特定のセルを選択状態にしたい時

セルを選択したいタイミングに以下のコードを書く。 sectionとrowでセルを指定する。 tableView.selectRow(at: IndexPath(row: 0, section: 1), …

音声をフェードイン、フェードアウト、トランジションさせる

フェードインする方法 エフェクトの[オーディオトランジション] → [クロスフェード] → [指数フェード]をドラッグして、タイムライン上にある音声の頭の部分に持っていく。 指数フェードの範囲は変えら …

XMLパースで使うRSSのURLの調べ方

各サイトのRSS用URLを調べたい。 //XMLパース let urlString = “https://assets.wor.jp/rss/rdf/sankei/affairs.rdf” //←この …