Fork me on GitHub

iOS tutorial 14:简单的下拉菜单 -- dropDownMenu

详细代码: dropDownMenu

  1. 按钮dropDownBtn:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    class dropDownBtn: UIButton, dropDownProtocol {
    func dropDownPressed(string: String) {
    self.setTitle(string, for: .normal)
    self.dismissDropDown()
    }


    var dropView = dropDownView()

    var height = NSLayoutConstraint()


    override init(frame: CGRect) {
    super.init(frame: frame)

    self.backgroundColor = UIColor.darkGray

    dropView = dropDownView.init(frame: CGRect.init(x: 0, y: 0, width: 0, height: 0))
    dropView.translatesAutoresizingMaskIntoConstraints = false
    dropView.delegate = self
    }

    // 本视图被添加到父视图上时调用
    override func didMoveToSuperview() {
    self.superview?.addSubview(dropView)
    self.superview?.bringSubview(toFront: dropView)

    dropView.topAnchor.constraint(equalTo: self.bottomAnchor).isActive = true
    dropView.centerXAnchor.constraint(equalTo: self.centerXAnchor).isActive = true
    dropView.widthAnchor.constraint(equalTo: self.widthAnchor).isActive = true
    height = dropView.heightAnchor.constraint(equalToConstant: 0)
    }

    var isOpen = false
    // 刚触摸时调用
    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
    if isOpen == false {
    isOpen = true
    NSLayoutConstraint.deactivate([self.height])

    if self.dropView.tableView.contentSize.height > 150 {
    self.height.constant = 150
    } else {
    self.height.constant = self.dropView.tableView.contentSize.height
    }

    NSLayoutConstraint.activate([self.height])

    UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 0.5, options: .curveEaseInOut, animations: {
    self.dropView.layoutIfNeeded()
    print(self.center, self.dropView.center, self.dropView.frame.height, self.dropView.frame.width)
    self.dropView.center.y += self.dropView.frame.height / 2
    }, completion: nil)

    } else {
    isOpen = false
    NSLayoutConstraint.deactivate([self.height])

    self.height.constant = 0

    NSLayoutConstraint.activate([self.height])

    UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 0.5, options: .curveEaseInOut, animations: {
    self.dropView.center.y -= self.dropView.frame.height / 2
    self.dropView.layoutIfNeeded()
    }, completion: nil)
    }
    }

    func dismissDropDown() {
    isOpen = false
    NSLayoutConstraint.deactivate([self.height])

    self.height.constant = 0

    NSLayoutConstraint.activate([self.height])

    UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 0.5, options: .curveEaseInOut, animations: {
    self.dropView.center.y -= self.dropView.frame.height / 2
    self.dropView.layoutIfNeeded()
    }, completion: nil)
    }

    required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
    }
    }
  2. 下拉视图dropDownView

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    class dropDownView: UIView, UITableViewDelegate, UITableViewDataSource {

    var dropDownOptions = [String]()

    var tableView = UITableView()

    var delegate: dropDownProtocol!

    override init(frame: CGRect) {
    super.init(frame: frame)

    tableView.backgroundColor = UIColor.darkGray
    self.backgroundColor = UIColor.darkGray

    tableView.delegate = self
    tableView.dataSource = self
    tableView.translatesAutoresizingMaskIntoConstraints = false

    self.addSubview(tableView)

    tableView.leftAnchor.constraint(equalTo: self.leftAnchor).isActive = true
    tableView.rightAnchor.constraint(equalTo: self.rightAnchor).isActive = true
    tableView.topAnchor.constraint(equalTo: self.topAnchor).isActive = true
    tableView.bottomAnchor.constraint(equalTo: self.bottomAnchor).isActive = true


    }

    required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
    }

    func numberOfSections(in tableView: UITableView) -> Int {
    return 1
    }
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return dropDownOptions.count
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = UITableViewCell()

    cell.textLabel?.text = dropDownOptions[indexPath.row]
    cell.backgroundColor = UIColor.darkGray

    return cell
    }
    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {

    self.delegate.dropDownPressed(string: dropDownOptions[indexPath.row])
    self.tableView.deselectRow(at: indexPath, animated: true)
    }

    }

参考:https://www.youtube.com/watch?v=22zu-OTS-3M


--------------------本文结束👨‍💻感谢您的阅读--------------------
坚持原创技术分享,您的支持将鼓励我继续创作!
  • 本文标题: iOS tutorial 14:简单的下拉菜单 -- dropDownMenu
  • 本文作者: AndyRon
  • 发布时间: 2018年08月17日 - 22:21
  • 最后更新: 2019年09月03日 - 13:46
  • 本文链接: http://andyron.com/2018/ios-tutorial-14.html
  • 版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 3.0 许可协议。转载请注明出处!
0%