如何使用Swift创建在半横幅视图上显示的UITableview第一个索引单元格?

时间:2019-02-10 18:07:01

标签: ios swift uitableview storyboard

我的情况是,我尝试使用UITableview和顶部横幅创建card effects。我已经添加了它将像stretchable表视图header一样工作。我通过使用storyboard完成了所有工作,但是我坚持只在half头上展示tableview中的index cellbanner。我尝试了multiple个想法,但没有完成。提供一些实现此design的想法。

当前输出:

Current output screen

预期输出:

Expected output screen

1 个答案:

答案 0 :(得分:3)

在您的演示项目HERE中,我对您现有的代码进行了一些更改,例如您的scrollViewDidScroll将是:

var lastContentOffset: CGFloat = 0

func scrollViewWillBeginDragging(_ scrollView: UIScrollView) {
    self.lastContentOffset = scrollView.contentOffset.y
}


func scrollViewDidScroll(_ scrollView: UIScrollView) {

    if self.lastContentOffset < scrollView.contentOffset.y {
        //Up
        let y = 220 - (scrollView.contentOffset.y + 220)
        let height = min(max(y, 60), 220)
        if height >= 128 {
            imageView.frame = CGRect(x: 0, y: 0, width: UIScreen.main.bounds.size.width, height: height + 70)
        }
    } else if self.lastContentOffset > scrollView.contentOffset.y {
        //Down
        let y = 300 - (scrollView.contentOffset.y + 300)
        let height = min(max(y, 60), 400)
        imageView.frame = CGRect(x: 0, y: 0, width: UIScreen.main.bounds.size.width, height: height + 80)
    }
}

使用上面的代码,我根据您的要求为上下添加了不同的条件,并从情节提要中将top约束更改为84,以便您的表格不会滚动到top。

enter image description here

因此您的完整代码如下:

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var tableView: UITableView!

    let imageView = UIImageView()
    var lastContentOffset: CGFloat = 0

    override func viewDidLoad() {
        super.viewDidLoad()
        tableView.estimatedRowHeight = 50
        tableView.contentInset = UIEdgeInsetsMake(220, 0, 0, 0)
        tableView.backgroundColor = UIColor.darkGray


        imageView.frame = CGRect(x: 0, y: 0, width: UIScreen.main.bounds.size.width, height: 300)
        imageView.image = UIImage.init(named: "poster")
        imageView.contentMode = .scaleAspectFill
        imageView.clipsToBounds = true
        view.addSubview(imageView)
        self.tableView.backgroundColor = .clear
        self.view.bringSubview(toFront: tableView)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
}


extension ViewController: UITableViewDelegate, UITableViewDataSource {

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 20
    }
    func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        return UITableViewAutomaticDimension
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "customCell", for: indexPath) as! CustomTableViewCell
        switch indexPath.row % 2 {
        case 0:
            cell.titleLabel.text = "Lorem Ipsum is simply dummy text ."
            cell.contentView.backgroundColor = UIColor.darkGray
        default:
            cell.contentView.backgroundColor = UIColor.black
            cell.titleLabel.text = "There is no one who loves pain itself, who seeks after it and wants to have it, simply because it is pain..."
            cell.titleLabel.textColor = .white
        }
        return cell
    }

    func scrollViewWillBeginDragging(_ scrollView: UIScrollView) {
        self.lastContentOffset = scrollView.contentOffset.y
    }


    func scrollViewDidScroll(_ scrollView: UIScrollView) {

        if self.lastContentOffset < scrollView.contentOffset.y {
            let y = 220 - (scrollView.contentOffset.y + 220)
            let height = min(max(y, 60), 220)
            if height >= 128 {
                imageView.frame = CGRect(x: 0, y: 0, width: UIScreen.main.bounds.size.width, height: height + 70)
            }
        } else if self.lastContentOffset > scrollView.contentOffset.y {
            let y = 300 - (scrollView.contentOffset.y + 300)
            let height = min(max(y, 60), 400)
            imageView.frame = CGRect(x: 0, y: 0, width: UIScreen.main.bounds.size.width, height: height + 80)
        }
    }
}

结果将是:

enter image description here

HERE是更新项目的链接。