在交互过渡期间更改 UICollectionViewCell 的内容

Posted 2023-03-14

【中文标题】在交互过渡期间更改 UICollectionViewCell 的内容

【英文标题】：Change content of UICollectionViewCell during interactive transition

【发布时间】：2014-11-25 14:08:33

【问题描述】：

我正在玩UICollectionView 交互式过渡。 最基本的实现是here。

现在我对 Cells 过渡有点卡住了。

这个想法是在交互布局转换的同时改变单元格的内容。

这是它现在的样子。

第一个布局

第二个布局

转换完成后，我想更改第二个布局上的单元格内容。 1）文本标签“一些标签”应该从每个单元格中消失 2）文本标签“另一个标签”应该出现在每个单元格的右上角。

关键问题是我希望此更改在过渡期间根据 UICollectionViewTransitionLayout.transitionProgress 值淡入/淡出。

在 Facebook Paper App 中实现了非常相似的功能。 看看下面的单元格内容是如何变化的（点击它）。

有人知道复制这种效果的优雅方法吗？

【问题讨论】：

看看来自 FB 的 pop 库，code.facebook.com/posts/234067533455773/…

@Vig 没有帮助:-(

我本来打算等你试试，但如果你想要马上得到什么，请使用我在答案中更新的库。

【参考方案1】：

library 将帮助您实现您的目标。如果您对自定义动画感兴趣，我建议您使用FB pop library

【讨论】：

该库没有执行我尝试实现的关键操作。它不会改变单元格的内容。它是永久的 UIImageView *backgroundView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"2"]]; cell.backgroundView = backgroundView;

【参考方案2】：

嗯。 解决方案是继承 UICollectionViewCell。 子类应包含两个UIView。一种用于大布局，一种用于小型。 最初 UICollectionViewCell 只显示一个小的。 一旦我们开始更新UICollectionViewTransitionLayout.transitionProgress，例如从小到大，我们应该执行以下步骤：

从大的UIView 中创建一个UIImage 把这张图片放在小UIView上面 将图像的 alpha 设置为 0 不断将UIImage 的alpha 更改为UICollectionViewTransitionLayout.transitionProgress 值 一旦转换完成，只需将其切换到UIView

当你过渡回来时，你应该用小来切换。

完成:-)

【讨论】：

嗨，阿列克谢。我正在尝试做和你一样的事情。你能分享关于用 2 UIViews 子类化 UICollectionView 的代码吗？谢谢。