Question

我是Swift和Firebase的新手，所以我有一个问题。我有一个数据模型。但是我需要从firebase检索数据并用此数据填充UICollectionViewCells。

这是数据模型：

 // MARK: - Public API
var title = ""
var description = ""
var ref = Database.database().reference()

init(withSnapshot: DataSnapshot) {
    self.description = withSnapshot.childSnapshot(forPath: "description").value as? String ?? "No Description"
   // self.featuredImage = withSnapshot.childSnapshot(forPath: "image").value as? String ?? "No Image"
    self.title = withSnapshot.childSnapshot(forPath: "title").value as? String ?? "No Title"
}

var programsArrayDataSource = [TrainingProgram]()

func fetchPrograms() {
    let programsRef = self.ref.child("programs")
    programsRef.observeSingleEvent(of: .value, with: { snapshot in
        let allPrograms = snapshot.children.allObjects as! [DataSnapshot]
        for programSnap in allPrograms {
            let aProgram = TrainingProgram(withSnapshot: programSnap)
            self.programsArrayDataSource.append(aProgram)
        }

       // self.programTableView.reloadData()
    })
}

UICollectionViewCell

import UIKit

class TrainingProgramCollectionViewCell: UICollectionViewCell {



    @IBOutlet weak var roundedView: UIView!
    @IBOutlet weak var bgView: UIView!
    @IBOutlet weak var viewForImage: UIView!

    @IBOutlet weak var buttonOutlet: UIButton!


    @IBOutlet weak var featuredImageView: UIImageView!

    @IBOutlet weak var descriptionLabel: UILabel!
    @IBOutlet weak var titleLabel: UILabel!

    var trainingPrograms: TrainingProgram? {
        didSet {
            self.updateUI()
        }
    }



    private func updateUI()
    {
        if let trainingProgram = trainingPrograms {

            featuredImageView.image = trainingPrograms!.featuredImage
            titleLabel.text = trainingPrograms!.title
            descriptionLabel.text = trainingPrograms!.description

            buttonOutlet.backgroundColor = UIColor(red: 0, green: 122/255, blue: 255/255, alpha: 1)
            buttonOutlet.layer.cornerRadius = 25
            buttonOutlet.layer.shadowColor = UIColor(red: 0, green: 0, blue: 0, alpha: 0.4).cgColor
            buttonOutlet.layer.shadowOffset = CGSize(width: 0, height: 5)
            buttonOutlet.layer.shadowRadius = 15
            buttonOutlet.layer.shadowOpacity = 1
            bgView!.layer.cornerRadius = 20
            featuredImageView.roundCorners(corners: [.topLeft, .topRight], radius: 20.0)
            viewForImage.roundCorners(corners: [.topLeft, .topRight], radius: 20.0)
            roundedView.layer.cornerRadius = 20



            featuredImageView.contentMode = .scaleAspectFill

            let view = UIView(frame: featuredImageView.frame)
            view.clipsToBounds = true



            featuredImageView.clipsToBounds = true



        } else {
            featuredImageView.image = nil
            titleLabel.text = nil
            descriptionLabel.text = nil
        }


    }

    override func layoutSubviews() {
        super.layoutSubviews()

        self.layer.cornerRadius = 3.0
        layer.shadowRadius = 10
        layer.shadowOpacity = 0.2
        layer.shadowOffset = CGSize(width: 5, height: 10)

        self.clipsToBounds = false
    }

    override func prepareForReuse() {
        super.prepareForReuse()


    }

}

UIViewController

class TrainingProgramViewController: UIViewController {

@IBOutlet weak var collectionView: UICollectionView!


  //    var trainingPrograms = TrainingProgram.fetchTrainingProgram()
var trainingPrograms = [TrainingPrograms]()
    let cellScale: CGFloat = 0.7


override func viewDidLoad() {
    super.viewDidLoad()

    let screenSize = UIScreen.main.bounds.size

    collectionView.dataSource = self
    collectionView.delegate = self

    let cellWidth = floor(screenSize.width * cellScale)
    let cellHeight = floor(screenSize.height * cellScale)

    let insetX = (view.bounds.width - cellWidth) / 3.0
    let insetY = (view.bounds.height - cellHeight) / 2.0

    let layout = collectionView!.collectionViewLayout as! UICollectionViewFlowLayout
    layout.itemSize = CGSize(width: cellWidth, height: cellHeight)
    collectionView?.contentInset = UIEdgeInsets(top: insetY, left: insetX, bottom: insetY, right: insetX)

}

}

扩展TrainingProgramViewController：UICollectionViewDataSource {

func numberOfSections(in collectionView: UICollectionView) -> Int {
    return 1
}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return trainingPrograms.count
}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell
{

    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "TrainingProgramCollectionViewCell", for: indexPath) as!  TrainingProgramCollectionViewCell
    let trainingProgram = trainingPrograms[indexPath.item]
    cell.trainingPrograms = trainingProgram

    return cell

}

}

extension TrainingProgramViewController : UIScrollViewDelegate, UICollectionViewDelegate
{
    func scrollViewWillEndDragging(_ scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer<CGPoint>)
    {
        let layout = self.collectionView?.collectionViewLayout as! UICollectionViewFlowLayout
        let cellWidthIncludingSpacing = layout.itemSize.width + layout.minimumLineSpacing

        var offset = targetContentOffset.pointee
        let index = (offset.x + scrollView.contentInset.left) / cellWidthIncludingSpacing
        let roundedIndex = round(index)

        offset = CGPoint(x: roundedIndex * cellWidthIncludingSpacing - scrollView.contentInset.left, y: -scrollView.contentInset.top)
        targetContentOffset.pointee = offset
    }
}

如何从Firebase检索数据到此数组？我需要检索两个标签和一张图像

Firebase结构。 “链接”-Firebase Storage的链接。这是将编程的结构的示例

program1
    description: 
      "Lorem"
    image: 
     "link"
    title: 
     "Workout1"
 program2
    description: 
     "Lorem"
    image: 
     "link"
    title: 
     "Workout2"

Answer 1

通读所有注释，您正在询问如何从Firebase读取数据。由于问题中没有Firebase代码，因此我不得不猜测您最终想要完成什么，因此我将首先指导您访问Firebase指南Reading and Writing Data，因为它涵盖了该主题。然后，请参阅Working With Lists

要振作起来，这是一种可能的解决方案。

由于具有tableView，因此通常将由tableView数据源支持。因此，概念是从Firebase读取数据，然后填充该数据源，然后刷新tableView，它将在UI中向用户显示对象。

让我们从一个类开始，以保存Firebase Realtime数据库中的数据

class ProgramClass {
    var description = ""
    var image = ""
    var title = ""

    init(withSnapshot: DataSnapshot) {
        self.description = withSnapshot.childSnapshot(forPath: "description").value as? String ?? "No Description"
        self.image = withSnapshot.childSnapshot(forPath: "image").value as? String ?? "No Image"
        self.title = withSnapshot.childSnapshot(forPath: "title").value as? String ?? "No Title"
    }
}

然后是一个var类来保存这些对象

var programsArrayDataSource = [ProgramClass]()

请记住，类var将充当支持表视图的数据源。当Firebase发生更改时，数据源将通过Firebase watch（.childAdded，.childChanged或.childRemoved）进行更新，然后重新加载tableView。

要实际阅读问题中介绍的Firebase结构，请使用以下代码。这将读取Firebase并填充tableView的dataSource。

func fetchPrograms() {
    let programsRef = self.ref.child("programs")
    programsRef.observeSingleEvent(of: .value, with: { snapshot in
        let allPrograms = snapshot.children.allObjects as! [DataSnapshot]
        for programSnap in allPrograms {
            let aProgram = ProgramClass(withSnapshot: programSnap)
            self.programsArrayDataSource.append(aProgram)
        }

        self.programTableView.reloadData()
    })
}

从那里您可以处理tableView代码；当某行需要刷新时，通过索引（行）从dataSource中获取该对象，从该对象中读取数据，并以所需的任何格式填充tableView单元格。

我应该如何从Firebase检索数据到UICollectionViewCell？

1 个答案: