任务 - 收到一个包含图片和标题的数组,在屏幕上显示此数据:两张图片,两张图片,等等。(附上实现的截图)。
基本上 - 我已经编写了工作代码,但我不喜欢它 - 我将每张图片和标题放在 UIView 中,并告诉 UIView 在屏幕上显示的位置。如果数组中只有 4 个元素,这很好用,但是如果我想处理 100 个元素,那么提前手动规定每个 UIView 的位置是相当愚蠢的。
在 CSS 中,我会用 float: 将容器排成一排:每隔一秒,我就会换行……)但是如何在 Swift 中实现呢?
let catalogList = ["1.jpg": "Стена", "2.jpg": "Микрофон", "3.jpg": "Инструменты", "4.jpg": "Концерт"]
var currentItems = 0
override func viewDidLoad() {
super.viewDidLoad()
for i in catalogList {
currentItems += 1
if currentItems <= 2 {
if currentItems % 2 < 1 {
addNew(pic: i.key, text: i.value, x: 30, y: 65)
} else {
addNew(pic: i.key, text: i.value, x: 220, y: 65)
}
} else {
if currentItems % 2 < 1 {
addNew(pic: i.key, text: i.value, x: 30, y: 300)
} else {
addNew(pic: i.key, text: i.value, x: 220, y: 300)
}
}
}
}
func addNew(pic: String, text: String, x: Int, y: Int) {
let viewThing = UIView(frame: CGRect(x: x, y: y, width: 165, height: 220))
self.view.addSubview(viewThing)
let labelThing = UILabel(frame: CGRect(x: 5, y: 190, width: 165, height: 30))
labelThing.text = text
viewThing.addSubview(labelThing)
let imageThing = UIImageView(frame: CGRect(x: 0, y: 0, width: 165, height: 190))
imageThing.image = UIImage(named: pic)
viewThing.addSubview(imageThing)
}
UICollectionView
必要时使用FlowLayout
。根据截图,有条件地,对于每个单元格,将宽度设置为集合宽度的 1/2 减去单元格之间的缩进,将高度设置为单元格宽度的 3/2:链接到文档
raywenderlich.com 上的非常详细和详细的示例