私はあなたと同様のことをするためにUITableViewControllerを使うことができると思います。
考え方は次のとおりです。
- は2つの部分、左と右のように、細胞をカスタマイズします。
- セクションの最初の項目の左側がセクションヘッダーに使用されます。が
CellView
とContentView
の場合はチェックを外す必要があります。
- セクションの最後の項目の高さは、オーバーラップしないように調整する必要があります。ここで
サンプルコードです:
class ViewController: UITableViewController {
struct Item {
var height: CGFloat = 0
}
var itemDic: [Int: [Item]]!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
itemDic = [0 : [Item(height: 10), Item(height: 30), Item(height: 50)],
1 : [Item(height: 20), Item(height: 10)],
2 : [Item(height: 40), Item(height: 30), Item(height: 20)]]
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
override func numberOfSectionsInTableView(tableView: UITableView) -> Int {
return itemDic.count
}
override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return itemDic[section]!.count
}
let sectionHeaderHeight: CGFloat = 100
override func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
let section = indexPath.section
let row = indexPath.row
let items = itemDic[section]!
var height = items[row].height
if (row == items.count - 1) {
var total: CGFloat = 0
for i in items {
total += i.height + 10
}
if(sectionHeaderHeight + 10 > total){
height += (sectionHeaderHeight + 10 - total)
}
}
return height + 10
}
override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
let section = indexPath.section
let row = indexPath.row
let items = itemDic[section]!
let cell = tableView.dequeueReusableCellWithIdentifier("Cell")!
let orangeView = cell.viewWithTag(100)!
let yellowView = cell.viewWithTag(101)!
if(row == 0){
let orangeFrame = orangeView.frame
orangeView.frame = CGRect(origin: orangeFrame.origin, size: CGSize(width: orangeFrame.width, height: sectionHeaderHeight))
}
let yellowFrame = yellowView.frame
let height = items[row].height
yellowView.frame = CGRect(origin: yellowFrame.origin, size: CGSize(width: yellowFrame.width, height: height))
return cell
}
override func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) {
let orangeView = cell.viewWithTag(100)!
let yellowView = cell.viewWithTag(101)!
let orangeFrame = orangeView.frame
print(orangeFrame)
let yellowFrame = yellowView.frame
print(yellowFrame)
}
}
更新:最初のセクションが消えるまでトップにスクロールしたとき が実際にバグが、上記の溶液中に存在し、その後、あなたはそれを取得し表示されます再レンダリングされ、レイアウトが破損します。
これを行うより良い方法があります。
headerViewに内部ビュー(橙色)を追加します。これはtableCells上にレンダリングされます。ヘッダー> 0の高さを設定することを忘れないでください。この場合、セルには右部分(黄色)のみが必要です。 まだ、最後のアイテムの高さを調整する必要があります。
サンプルコード:
class ViewController: UITableViewController {
struct Item {
var height: CGFloat = 0
}
var itemDic: [Int: [Item]]!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
itemDic = [0 : [Item(height: 10), Item(height: 30), Item(height: 50), Item(height: 20)],
1 : [Item(height: 20), Item(height: 10)],
2 : [Item(height: 40), Item(height: 30), Item(height: 20), Item(height: 30)]]
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
override func numberOfSectionsInTableView(tableView: UITableView) -> Int {
return itemDic.count
}
override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return itemDic[section]!.count
}
let sectionHeaderHeight: CGFloat = 100
let innerViewOffset: CGFloat = 10
override func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
// Must > 0
return innerViewOffset
}
override func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let view = UIView(frame: CGRect())
view.backgroundColor = UIColor.blueColor()
let innerView = UIView(frame: CGRect(x: 0, y: innerViewOffset, width: 100, height: 100))
innerView.backgroundColor = colorForSection(section)
view.addSubview(innerView)
return view
}
func colorForSection(section: Int) -> UIColor {
let colors = [UIColor.greenColor(), UIColor.redColor(), UIColor.purpleColor()]
return colors[section]
}
override func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
let section = indexPath.section
let row = indexPath.row
let items = itemDic[section]!
var height = items[row].height
if (row == items.count - 1) {
var total: CGFloat = 0
for i in items {
total += i.height + 10
}
if(sectionHeaderHeight + 10 > total){
height += (sectionHeaderHeight + 10 - total)
}
}
return height + 10
}
override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCellWithIdentifier("Cell")!
return cell
}
}
私がよく理解すれば...セクションの最後のセルの高さを決定するために、セクション内のセルの高さを推定しようとすると、私にとってこの唯一の問題が発生します。私は正しい? –
実際にはこのように処理する方法がわからないバグがあります。上にスクロールすると、最初のセクションが再レンダリングされ、最初のアイテムが覆われるのが見えます。私はあなたのためのより良い解決策を見つけ出す。編集を参照してください。 – dichen