选择行时 TableViewController 中的两个动画

Posted 2023-03-04

【中文标题】选择行时 TableViewController 中的两个动画

【英文标题】：Two animations in TableViewController when row is selected

【发布时间】：2015-11-06 16:04:31

【问题描述】：

我正在实施TableViewController。除了UITableViewCellStyle 和NavigationControllerTitle 的小问题（我想我可以自己解决），我一直在为如何实现一些动画而烦恼。请注意，我搜索了很多主题（这也是一个：Can you do custom animations for UITableView Cell Inserts?）并尽可能多地在 Google 上搜索，但我不知道如何称呼我必须做的事情。所以我把它画得很清楚。

左侧有几个带有随机彩色小矩形的单元格。当我单击单元格时，此矩形会扩展为全宽，而不覆盖 CellText。

第二个动画同时发生，它插入某种数组，带有图像，扩展至底部并向下滑动其下方的单元格。

我真的很想写这个，但我所能做的就是将整个视图向右滑动，无处可去。

这是我认为我应该处理的 .m 文件。如果我要粘贴您的任何其他部分，请告诉我。

-(void) tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath

    [tableView deselectRowAtIndexPath:indexPath animated:YES];
    int selectedRow = indexPath.row;
    NSLog(@"touch on row %d", selectedRow);
    [self animate]; 

- (void)animate

    [[self.tableView visibleCells] enumerateObjectsUsingBlock:^(UITableViewCell *cell, NSUInteger idx, BOOL *stop) 
        [cell setFrame:CGRectMake(0, cell.frame.origin.y, cell.frame.size.width, cell.frame.size.height)];
        [UIView animateWithDuration:0.2 animations:^
            [cell setFrame:CGRectMake(320, cell.frame.origin.y, cell.frame.size.width, cell.frame.size.height)];
        ];
    ];

感谢您的耐心等待，请理解我真的很想了解如何做到这一点。

【参考方案1】：

我真的很想写这个，但我能做的就是滑动 整个视野向右，无处可去。

是的，看起来这正是您在此处发布的代码的作用。您正在获取所有可见单元格（不仅仅是已选择的单元格）并将它们全部向右移动一个完整的屏幕宽度（离屏）。

我的猜测是你想要做的是告诉单元格向右扩展那个颜色矩形。于是在-tableView:didSelectRowAtIndexPath:向单元格发送消息修改自身：

-(void) tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath

    MyTableViewCell *cell = (MyTableViewCell *)[tableView cellForRowAtIndexPath:indexPath];
    [cell setExpanded:YES animated:YES];

现在单元格负责将背景颜色设置为全宽。 -setExpanded:YES animated: 只是我编的一个方法名。您可以在您的应用程序中将其命名为任何有意义的名称。它可能看起来像这样（用 Safari 编写，所以不要期望完美）：

- (void)setExpanded:(BOOL)expanded animated:(BOOL)animated

    _expanded = expanded;  // Assumes you have a property for this.

    CGRect frame = self.colorView.frame;
    if (expanded) 
        frame.size.width = self.contentRect.bounds.size.width;
    
    else 
        frame.size.width = 40.0f;
    

    [UIView animateWithDuration:0.2 animations:^
        self.colorView.frame = frame;
    ];

向下滑动其他内容有点困难。此内容是单元格的一部分、新单元格还是在表格视图上添加的视图？我可能会将它添加为一个新单元格，因此您可以使用表格视图的正常插入动画将其动画化。

【讨论】：

现在我想添加类似 Grid View 的内容。我做了第一个动画，我稍后会发布。

【参考方案2】：

我找到了一半的答案。 屏幕上的动画非常棘手，但我几乎没有其他程序员的帮助就做到了。

 -(void) tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath



    [tableView deselectRowAtIndexPath:indexPath animated:YES];

    int selectedRow = indexPath.row;
    NSLog(@"touch on row %d", selectedRow);


    PrototypeCell *prototypeCell =(PrototypeCell *)[tableView cellForRowAtIndexPath:indexPath];
    if (prototypeCell.stretched == NO)
    [UIView animateWithDuration:1 animations:^
        prototypeCell.View.frame = CGRectMake(0, 0, 320, 120);
                     completion: nil];
        prototypeCell.stretched = YES;
    else 
        [UIView animateWithDuration:1 animations:^
            prototypeCell.View.frame = CGRectMake(0, 0, 15, 120);
                         completion: nil];
        prototypeCell.stretched = NO;
    

我必须创建 PrototypeCell 才能访问视图。这是解决了一半的问题。 :) 当我第二次触摸它时它甚至会回滚。