Attenuation in UITableViewCell row by row in Swift

Question

I'm new to fast, I'm trying to get a UITableView, and the boxes will be animated to appear one after another. How can i do this? In addition, if a newly appeared row of cells is not displayed on the screen (hidden under the table). How can I move the table up when each cell appears?

var tableData1: [String] = ["1", "2", "3", "4", "5", "6", "7"] override func viewWillAppear(animated: Bool) { tableView.scrollEnabled=false tableView.alpha=0.0 NSTimer.scheduledTimerWithTimeInterval(NSTimeInterval(3), target: self, selector: "animateTable", userInfo: nil, repeats: false) } func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return self.tableData1.count } func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell { let cell:TblCell = self.tableView.dequeueReusableCellWithIdentifier("cell") as! TblCell cell.lblCarName.textAlignment = NSTextAlignment.Justified; return cell } func animateTable() { //what should be the code?// } 

Answer 1

In UITableView, rows are automatically created for you when they fall into your "range vision". I assume that you, at least not from the very beginning, can scroll the View table, so we will scroll it programmatically so that the rows are displayed as they appear. How do we do this? In fact, UITableView has a method that allows you to scroll it to a specific line:

 scrollToRowAtIndexPath(indexPath : NSIndexPath, atScrollPosition : UITableViewScrollPosition, animated : Bool); 

I'm too tired to write code, so I will try to explain. First, for each cell, you set alpha to 0 as soon as they load (cellForRowAtIndexPath). Then let our screen correspond to the first 5 lines. You will animate their alpha sequentially (using UIView.animateWithDuration) to the fifth (index 4), then you are going to scroll ToRowAtIndexPath going through NSIndexPath using 5, then 6, ... to the rest (using scrollPosition =. Bottom). And for each of them, you will animate as soon as they load. Just remember to set the time between these interactions. (first revive, start NSTimer to the second and continue). And the logical revival must be true, of course.

Answer 2

Step 1

In the cellForRowAtIndexPath method where your cell is initialized, hide it;

 func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell: TblCell = tableView.dequeueReusableCell(withIdentifier: "cell") as! TblCell cell.continueLabel.textAlignment = .justified cell.contentView.alpha = 0 return cell } 

Step 2

Let it do a fade animation. UITableViewDelegate has a willDisplayCell method which can detect that when scrolling up or down, the first cell will be displayed in the window.

 func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) { UIView.animate(withDuration: 0.8, animations: { cell.contentView.alpha = 1 }) } 

Your fade animation is about progress. Most importantly, you cannot customize your alpha cell directly at runtime, because iOS does some special internal processing with the cell as part of your UITableView and ignores your setting. Therefore, if you customize your contentView , everything will be fine.

Answer 3

Here is the code you can get started. In my COBezierTableView, I have subclassed the UITableView and override the layoutSubviews method. There you can manipulate cells according to their relative position in the view. In this example, I reduce them at the bottom.

 import UIKit public class MyCustomTableView: UITableView { // MARK: - Layout public override func layoutSubviews() { super.layoutSubviews() let indexpaths = indexPathsForVisibleRows! let totalVisibleCells = indexpaths.count - 1 if totalVisibleCells <= 0 { return } for index in 0...totalVisibleCells { let indexPath = indexpaths[index] if let cell = cellForRowAtIndexPath(indexPath) { if let superView = superview { let point = convertPoint(cell.frame.origin, toView:superView) let pointScale = point.y / CGFloat(superView.bounds.size.height) cell.contentView.alpha = 1 - pointScale } } } } } 

Answer 4

To display each visible cell one by one, you can do this by playing with alpha and duration.

 extension UITableView { func fadeVisibleCells() { var delayCounter = 0.0 for cell in self.visibleCells { cell.alpha = 0.0 UIView.animate(withDuration: TimeInterval(delayCounter)) { cell.alpha = 1.0 } delayCounter += 0.30 } } } 

Answer 5

 func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) { cell .alpha = 1.0 let transform = CATransform3DTranslate(CATransform3DIdentity, 0, 3000, 1200) //let transform = CATransform3DTranslate(CATransform3DIdentity, 250, 0, 1250) //let transform = CATransform3DTranslate(CATransform3DIdentity, 250, 1250, 0) // let transform = CATransform3DTranslate(CATransform3DIdentity, -250, 300, 120) cell.layer.transform = transform UIView.animate(withDuration: 1.0) { cell.alpha = 1.0 cell.layer.transform = CATransform3DIdentity cell.layer.transform = CATransform3DIdentity } }