TableView刷新闪动问题 —— iOS 11

Posted 2023-05-05

参考技术A

商品详情页，内容较多，分多个接口请求加载。根据请求到的数据，来判断是否显示某些内容。

多个接口按顺序请求，请求完一个，在接着请求下一个。将得到的数据，加载进来，在刷新整个商品详情的tableView。

ios 11系统下，TableView 调用 reloadData 方法，会导致整个界面跳动、闪屏现象， 拖拉到某个位置，在根据接口返回数据加载刷新tableView，效果更惨 。。iOS 11之前系统不会出现闪屏跳动现象。效果如下图：

既然只是在iOS 11系统才会出现这个问题，就研究下iOS 11的一个特性。
iOS 11系统，tableView的加载及显示cell机制做了调整。

产生的原因是在创建TableViewCelll的时候，系统给加了一个默认预估 estimatedRowHeight 的cell高度== UITableViewAutomaticDimension 。
参见系统属性备注： @property (nonatomic) CGFloat estimatedRowHeight NS_AVAILABLE_IOS(7_0); // default is UITableViewAutomaticDimension, set to 0 to disable
默认是 UITableViewAutomaticDimension ,当设置这个属性是0的时候，就不会估算cell高度了。

iOS 11以后系统默认开启Self-Sizing，Self-Sizing官方文档解释：大概是说我们不用再自己去计算cell的高度了，只要设置好这两个属性，约束好布局，系统会自动计算好cell的高度。

将估算高度设置为0即可：

如果你有使用、加载sectionHeadView或sectionFootView的需求，也会出现闪屏现象，同理将这两个估算高度设置为0即可。

iOS UIRefreshControl-刷新tableView

override func viewDidLoad() {
        super.viewDidLoad()
        refreshControl = UIRefreshControl.init()
        refreshControl?.attributedTitle = NSAttributedString.init(string: "努力加载....", attributes: [NSForegroundColorAttributeName:UIColor.yellow, NSFontAttributeName:UIFont.systemFont(ofSize: 20), NSTextEffectAttributeName: NSTextEffectLetterpressStyle])
        refreshControl?.tintColor = UIColor.yellow
        refreshControl?.backgroundColor = UIColor.init(patternImage: UIImage.init(imageLiteralResourceName: "1.jpg"))
        refreshControl?.addTarget(self, action: #selector(LPCTableVC.testRefresh), for: UIControlEvents.valueChanged)
        tableView.register(UITableViewCell.self, forCellReuseIdentifier: "Cell")
    }
    func testRefresh() {
        NSLog("刷新")
        //结束刷新
        refreshControl?.endRefreshing()
    }