I'm designing a screen of friends list that have animation
like this:
I started with collectionview
but I don't understand how to change position of cells
.
I take two uicollectionviewcell
one for image, name and second for all details like the list.
I also managed to change for collection to list but for animation
i don't know how to do it.
Here it's my Code:
//MARK: - Collection view setUp -
extension CollViewAnimate {
fileprivate func setUpCollView() {
self.delegate = self
self.dataSource = self
self.register(UINib(nibName: "NameCollCell", bundle: nil), forCellWithReuseIdentifier: "NameCollCell")
self.register(UINib(nibName: "DetailCollCell", bundle: nil), forCellWithReuseIdentifier: "DetailCollCell")
}
func reloadTblData() {
self.isList = !self.isList
self.reloadData()
}
}
//MARK: - Collection view Deleagtes & DataSources -
extension CollViewAnimate: UICollectionViewDelegate, UICollectionViewDataSource {
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return self.arrFriendList.count
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
if self.isList {
if let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "DetailCollCell", for: indexPath) as? DetailCollCell {
cell.setUserDetails(self.arrFriendList[indexPath.row])
return cell
}
} else {
if let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "NameCollCell", for: indexPath) as? NameCollCell {
cell.setUserDetails(self.arrFriendList[indexPath.row])
return cell
}
}
return UICollectionViewCell(frame: .zero)
}
}
//MARK: - Collection view FlowLayout Deleagtes -
extension CollViewAnimate: UICollectionViewDelegateFlowLayout {
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
if self.isList {
return CGSize(width: (collectionView.frame.width), height: (collectionView.frame.width / 5))
}
return CGSize(width: (collectionView.frame.width / 3), height: (collectionView.frame.width / 2.5))
}
}
Here I used separate collection view file, my all code for collectionview
is returned here, and .xib
file for collectionviewcell
.
please guide me to achieve this task, also give your suggestion for a suitable controller
.
Thank you