Get the App
SLTechnology News&Howtos  ›  Development  › 

How to simulate and realize the cyclic scrolling effect of the winning list by iOS

Shulou Source: shulou.com Published: 2022-06-03 09:35:44 11月15日 Update

This article mainly introduces how iOS simulates how to achieve the circular scrolling effect of the winning list, which has a certain reference value, and interested friends can refer to it. I hope you will gain a lot after reading this article.

Train of thought:

(1) Control: a parent View, add two tableVew in turn so that they are next to each other, the height is equal to the total height of all cell, and load the same data. The clipsToBounds property of the parent view must be set to true

(2) Scroll: use a timer to adjust the time and scroll size to smooth the display.

(3) Loop algorithm: when A list scrolls out of the interface, it is added at the bottom of B list, and when B list scrolls out of the interface, it is added below A list to form a loop effect.

The core code of 3.Swift version (you can copy and paste directly to see the effect):

Import UIKitclass ViewController: UIViewController,UITableViewDelegate,UITableViewDataSource {var tableView:UITableView! Var doubleTableView:UITableView! Let kScreenW = UIScreen.main.bounds.size.width let kXPercent = UIScreen.main.bounds.size.width / 375.0 let kBorderW = CGFloat (15.0) let kYPercent = UIScreen.main.bounds.size.width / 375.0 let cellId:String = "drawViewCell1" override func viewDidLoad () {super.viewDidLoad () self.addListTableView ()} func addListTableView () {let tableWidth = kScreenW- kBorderW*3 let tableBgView = UIView (frame: CGRect (x: (kScreenW-tableWidth) / 2.0) Height: 148*kYPercent)) tableBgView.clipsToBounds = true tableBgView.backgroundColor = UIColor.yellow self.view.addSubview (tableBgView) / / tableView = UITableView (frame: CGRect (x: 0Magnum y: 0Magnum width: tableWidth,height: 148*kYPercent*2), style: UITableViewStyle.plain) tableView.backgroundColor = UIColor.clear tableView.delegate = self tableView.dataSource = self tableView.separatorStyle = UITableViewCellSeparatorStyle.none tableBgView.addSubview (tableView) doubleTableView = UITableView (frame: CGRect (x: 0Magnum y: tableView.frame.origin.y+tableView.frame.size.height,width: tableWidth) Height: 148*kYPercent*2), style: UITableViewStyle.plain) doubleTableView.backgroundColor = UIColor.clear doubleTableView.delegate = self doubleTableView.dataSource = self doubleTableView.separatorStyle = UITableViewCellSeparatorStyle.none tableBgView.addSubview (doubleTableView) / / Timer.scheduledTimer (timeInterval: 0.1, target: self, selector: # selector (personListScroll (timer:), userInfo: nil, repeats: true)} @ objc func personListScroll (timer:Timer) {/ / 1 > frame var newTableViewframe = self.tableView.frame newTableViewframe.origin.y-= 2*kYPercent if of Mobile tableView (newTableViewframe.origin.y

< -(doubleTableView.frame.size.height)) { newTableViewframe.origin.y = tableView.frame.size.height } self.tableView.frame = newTableViewframe // 2>

Frame var newDoubleViewframe of Mobile doubleTableView = self.doubleTableView.frame newDoubleViewframe.origin.y-= 2*kYPercent if newDoubleViewframe.origin.y

< -(tableView.frame.size.height) { newDoubleViewframe.origin.y = tableView.frame.size.height } self.doubleTableView.frame = newDoubleViewframe } //返回行的个数 func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) ->

Number of columns returned by Int {return 10} / / func numberOfSections (in tableView: UITableView)-> Int {return 1 } / / remove header blank func tableView (_ tableView: UITableView, heightForHeaderInSection section: Int)-> CGFloat {return 0.001} / / remove tail blank func tableView (_ tableView: UITableView, heightForFooterInSection section: Int)-> CGFloat {return 0.001} / / return a cell func tableView (_ tableView: UITableView) CellForRowAt indexPath: IndexPath)-> UITableViewCell {/ / Recycling Pool var cell:UITableViewCell! = tableView.dequeueReusableCell (withIdentifier: cellId) if cell = = nil {/ / determine whether it is nil cell = UITableViewCell (style: UITableViewCellStyle.default) ReuseIdentifier: cellId)} cell.backgroundColor = UIColor.clear cell.selectionStyle = UITableViewCellSelectionStyle.none if tableView = = self.tableView {/ / Test whether the loop scrolls cell.textLabel?.text = "Mr. Zhang"} else {cell.textLabel?.text = "Miss Li"} return cell} / / returns the height func tableView of the cell (_ tableView: UITableView HeightForRowAt indexPath: IndexPath)-> CGFloat {return 148/5.0*kYPercent} override func didReceiveMemoryWarning () {super.didReceiveMemoryWarning ()}} Thank you for reading this article carefully I hope the article "how to simulate and realize the circular scrolling effect of the winning list by iOS" shared by the editor will be helpful to everyone. At the same time, I also hope that you will support and pay attention to the industry information channel. More related knowledge is waiting for you to learn!

Tags: Loop effect article height list blank move same smooth up and down two number code value interest at the same time size head miss tail Apple Docker Huawei Linux macOS MariaDB Microsoft MySQL NVidia OPPO Reno MariaDB Xiaomi vpn Microsoft NVidia