在 iOS 中使用 Swift 3 的 CollectionView 动态高度 [英] CollectionView dynamic height with Swift 3 in iOS
问题描述
最近,我正在尝试做一些项目来练习.所以我看了课程Developing Apps for iOS",斯坦福大学,CS193P,2017.
现在,我正在做Smashtag"项目,但我在其中遇到了一些问题.我想使用带有两个 UICollectionViewFlowLayout 的 CollectionView 来通过 SegmentedControl 在 CollectionView 的每个 xib 中显示两种类型(一种类似于 tableView,另一种是显示方形图像).
我的问题如下:
<块引用>如何让 CollectionViewCell 像 TableView 的 UITableViewAutomaticDimension 一样以动态高度显示?
这就是我刚刚在下面尝试的:
我尝试使用 UICollectionViewFlowLayoutAutomaticSize 将 CollectionView 的 autoResize 设置设置为类似于 TableView 的 autoDimension.(@available(iOS 10.0, *))
enum CollectionViewType {案例推文案例图片}//MARK: - 决定什么样的 FlowLayoutfunc决定FlowLayout(类型:CollectionViewType)->UICollectionViewFlowLayout {//仅用于 .image 类型var howManyImageShowing = 3var imageShowingWidth:双{返回双(self.view.frame.width)/双(howManyImageShowing)}//.tweet 是一种类似 TableViewCell 的显示类型 ->这让我很困惑!!//另一种类型只是在正方形中显示图像 ->我这里没有问题让estimatedItemSize = type == .tweet ?CGSize(宽度:self.view.frame.width,高度:155.0):CGSize(宽度:imageShowingWidth,高度:imageShowingWidth)让 collectionViewLayout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()collectionViewLayout.sectionInset = UIEdgeInsets(顶部:0,左侧:0,底部:0,右侧:0)//--------- 像 TableView 一样进行此设置 ---------//------------ 像下面这样的东西------------/*tableView.estimatedRowHeight = 155.0tableView.rowHeight = UITableViewAutomaticDimension*/collectionViewLayout.estimatedItemSize = EstimatedItemSizecollectionViewLayout.itemSize = UICollectionViewFlowLayoutAutomaticSize//-------------------------------------------------------collectionViewLayout.minimumLineSpacing = 0collectionViewLayout.minimumInteritemSpacing = 0返回集合视图布局}
我的 CollectionViewCell xib 的约束在这里:但是当我运行这个应用程序时它有错误
我不知道我错过了什么或误解了什么.
<块引用>为什么这个解决方案会奏效?
我已经在 Stack Overflow 中搜索了很多这个问题的解决方案,但我只是找到了这个,让我很困惑:(
此解决方案为视图提供了一个 宽度约束,该约束位于 CollectionViewCell xib 中,并将此约束的常量设置为一个值,然后它就可以工作了!我无法配置为什么 Width Constraint 会使单元格的高度动态化?这让我真的很困惑,我觉得这很奇怪......
class Cell: UICollectionViewCell {@IBOutlet 弱变量 headerLabel:UILabel!@IBOutlet 弱变量 descriptionLabel:UILabel!@IBOutlet 弱 var widthConstraint: NSLayoutConstraint!覆盖 funcawakeFromNib() {super.awakeFromNib()//初始化代码self.contentView.translatesAutoresizingMaskIntoConstraints = false让 screenWidth = UIScreen.main.bounds.size.widthwidthConstraint.constant = screenWidth - (2 * 12)}}
<块引用>
如何在不使用 UICollectionViewFlowLayoutAutomaticSize 的情况下实现 CollectionViewCell 动态高度.(@available(iOS 10.0, *)) ?
因为我不仅要在 iOS 10 中处理不同的 iOS 版本,还要在 iOS 10 以下.
我真的很想成为 iOS 开发专家和优秀的开发人员,但我仍在学习和尝试.任何答复我将不胜感激.
谢谢!!
使用以下代码根据显示的文字改变高度:
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) ->CGFloat {返回 0}func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) ->CG尺寸{返回 CGSizeMake(view.frame.width , 64)}覆盖 func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) ->CG尺寸{让approximateWidthOfContent = view.frame.width - x//x 是左边标志的宽度让大小 = CGSize(宽度:approximateWidthOfContent,高度:1000)//1000 是较大的任意值,在内容量非常大的情况下应采用让属性 = [NSFontAttributeName: UIFont.systemFont(ofSize: 15)]让estimatedFrame = NSString(string: user.bioText).boundingRect(with: size, options: .usesLineFragmentOrigin, attributes: attributes, context: nil)返回CGSize(宽度:view.frame.width,高度:estimatedFrame.height + 66)}
Recently, I'm trying to do some projects for practicing. So I watched the course "Developing Apps for iOS", Stanford University, CS193P, 2017.
And now, I'm doing "Smashtag" project but I have some problems in it. I want to use a CollectionView with two UICollectionViewFlowLayout to show two types in each xib (one is like tableView, another is showing a image in square) of CollectionView by SegmentedControl.
My problems below :
How to make CollectionViewCell showing in dynamic height just like TableView's UITableViewAutomaticDimension?
And this is what I just tried below :
I tried to make CollectionView's autoResize setting as like TableView's autoDimension with using UICollectionViewFlowLayoutAutomaticSize. ( @available(iOS 10.0, *) )
enum CollectionViewType {
case tweet
case image
}
// MARK: - Decide What Kind Of FlowLayout
func decideFlowLayout(type: CollectionViewType) -> UICollectionViewFlowLayout {
// just for .image type
var howManyImageShowing = 3
var imageShowingWidth: Double {
return Double(self.view.frame.width) / Double(howManyImageShowing)
}
// .tweet is a type showing like TableViewCell -> this make me confused !!
// another type is just showing a image in square -> I have no problem here
let estimatedItemSize = type == .tweet ? CGSize(width: self.view.frame.width, height: 155.0) :
CGSize(width: imageShowingWidth, height: imageShowingWidth)
let collectionViewLayout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
collectionViewLayout.sectionInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
// --------- Make this setting as TableView does ---------
// ------------ Somethis just like this below ------------
/*
tableView.estimatedRowHeight = 155.0
tableView.rowHeight = UITableViewAutomaticDimension
*/
collectionViewLayout.estimatedItemSize = estimatedItemSize
collectionViewLayout.itemSize = UICollectionViewFlowLayoutAutomaticSize
// -------------------------------------------------------
collectionViewLayout.minimumLineSpacing = 0
collectionViewLayout.minimumInteritemSpacing = 0
return collectionViewLayout
}
Constraint of my CollectionViewCell xib here : But it has bug when I run this app
I don't know what I miss or misunderstand.
Why this solution will work ?
I already search so many solutions of this problem in Stack Overflow but I just find this and make me really confused :(
This solution give the view a Width Constraint which is in CollectionViewCell xib and set this constraint's constant a value and it works! I can not configure out why Width Constraint will make the cell's height in dynamic? This make me really confused, I think this is weird...
class Cell: UICollectionViewCell {
@IBOutlet weak var headerLabel: UILabel!
@IBOutlet weak var descriptionLabel: UILabel!
@IBOutlet weak var widthConstraint: NSLayoutConstraint!
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
self.contentView.translatesAutoresizingMaskIntoConstraints = false
let screenWidth = UIScreen.main.bounds.size.width
widthConstraint.constant = screenWidth - (2 * 12)
}
}
How to do CollectionViewCell dynamic height without using UICollectionViewFlowLayoutAutomaticSize. ( @available(iOS 10.0, *) ) ?
Because I want to handle different iOS Versions not only in iOS 10 but also below iOS 10.
I really want to be pro in iOS development and a great developer but I'm still learning and trying. Any replies I will be greatly appreciated.
Thank you !!
Use the following code to change the height according to the text displayed:
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
return 0
}
func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
return CGSizeMake(view.frame.width , 64)
}
override func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize
{
let approximateWidthOfContent = view.frame.width - x
// x is the width of the logo in the left
let size = CGSize(width: approximateWidthOfContent, height: 1000)
//1000 is the large arbitrary values which should be taken in case of very high amount of content
let attributes = [NSFontAttributeName: UIFont.systemFont(ofSize: 15)]
let estimatedFrame = NSString(string: user.bioText).boundingRect(with: size, options: .usesLineFragmentOrigin, attributes: attributes, context: nil)
return CGSize(width: view.frame.width, height: estimatedFrame.height + 66)
}
这篇关于在 iOS 中使用 Swift 3 的 CollectionView 动态高度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!