当您滚动时,ios uitableview会淡化底部单元格和顶部单元格

Atu*_*tia 5 fade uitableview ios

当我们滚动出视图时,我正在淡出我的uitableview的单元格,或者当它们滚动到视图中时将它们淡入.我面临的问题是,如果我滚动得非常快,有时完全可见的细胞仍然会变暗.这是我的代码如下:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    // Fades out top and bottom cells in table view as they leave the screen
    NSArray *visibleCells = [self.tableView visibleCells];

    if (visibleCells != nil  &&  [visibleCells count] != 0) {       // Don't do anything for empty table view

        /* Get top and bottom cells */
        UITableViewCell *topCell = [visibleCells objectAtIndex:0];
        UITableViewCell *bottomCell = [visibleCells lastObject];

        /* Make sure other cells stay opaque */
        // Avoids issues with skipped method calls during rapid scrolling
        for (UITableViewCell *cell in visibleCells) {
            cell.contentView.alpha = 1.0;
        }

        /* Set necessary constants */
        NSInteger cellHeight = topCell.frame.size.height - 1;   // -1 To allow for typical separator line height
        NSInteger tableViewTopPosition = self.tableView.frame.origin.y;
        NSInteger tableViewBottomPosition = self.tableView.frame.origin.y + self.tableView.frame.size.height;

        /* Get content offset to set opacity */
        CGRect topCellPositionInTableView = [self.tableView rectForRowAtIndexPath:[self.tableView indexPathForCell:topCell]];
        CGRect bottomCellPositionInTableView = [self.tableView rectForRowAtIndexPath:[self.tableView indexPathForCell:bottomCell]];
        CGFloat topCellPosition = [self.tableView convertRect:topCellPositionInTableView toView:[self.tableView superview]].origin.y;
        CGFloat bottomCellPosition = ([self.tableView convertRect:bottomCellPositionInTableView toView:[self.tableView superview]].origin.y + cellHeight);

        /* Set opacity based on amount of cell that is outside of view */
        CGFloat modifier = 1.2;     /* Increases the speed of fading (1.0 for fully transparent when the cell is entirely off the screen,
                                 2.0 for fully transparent when the cell is half off the screen, etc) */
        CGFloat topCellOpacity = (1.0f - ((tableViewTopPosition - topCellPosition) / cellHeight) * modifier);
        CGFloat bottomCellOpacity = (1.0f - ((bottomCellPosition - tableViewBottomPosition) / cellHeight) * modifier);

        /* Set cell opacity */
        if (topCell) {
            topCell.alpha = topCellOpacity;
        }
        if (bottomCell) {
            bottomCell.alpha = bottomCellOpacity;
        }  
    }
}
Run Code Online (Sandbox Code Playgroud)

任何想法为什么当我在视图中快速滚动时,有时会保持灰色?

Rob*_*Rob 15

问题是滚动事件并不总是频繁发生,滚动到视图的单元格将从褪色的alpha转到1.0的alpha,因为它从顶部/底部滚动到中间.但是当你快速滚动时,scrollViewDidScroll不会经常调用它来确保这种情况.显然正在尝试重置的循环alpha是更新alpha错误视图(contentView而不是单元本身).

您可以通过替换现有for循环来解决此问题:

for (UITableViewCell *cell in visibleCells) {
    cell.contentView.alpha = 1.0;
}
Run Code Online (Sandbox Code Playgroud)

for (UITableViewCell *cell in visibleCells) {
    cell.alpha = 1.0;
}
Run Code Online (Sandbox Code Playgroud)

或者,或者从那里消除该循环,然后替换设置顶部和底部单元格的alpha的行:

if (topCell) {
    topCell.alpha = topCellOpacity;
}
if (bottomCell) {
    bottomCell.alpha = bottomCellOpacity;
}  
Run Code Online (Sandbox Code Playgroud)

附:

for (UITableViewCell *cell in self.tableView.visibleCells) {
    if (cell == topCell) {
        cell.alpha = topCellOpacity;
    } else if (cell == bottomCell) {
        cell.alpha = bottomCellOpacity;
    } else {
        cell.alpha = 1.0;
    }
}
Run Code Online (Sandbox Code Playgroud)

顺便说一下,实现类似效果的另一种方法是将渐变蒙版应用于整个tableview并退出该scrollViewDidScroll方法.这里唯一的技巧是你不能将渐变蒙版应用于表视图本身(或者梯度将使用表视图滚动),而是将tableview放在某个容器中UIView,然后将掩码应用于:

- (void)viewDidAppear:(BOOL)animated
{
    CAGradientLayer *gradient = [CAGradientLayer layer];
    gradient.frame = self.containerView.bounds;
    gradient.colors = @[(id)[UIColor clearColor].CGColor,
                        (id)[UIColor whiteColor].CGColor,
                        (id)[UIColor whiteColor].CGColor,
                        (id)[UIColor clearColor].CGColor];
    gradient.locations = @[@0.0, @0.1, @0.9, @1.0];
    self.containerView.layer.mask = gradient;
}
Run Code Online (Sandbox Code Playgroud)

这无疑是一个略有不同的效果,但有时它是可取的.这取决于你拍摄的是什么.