ios - 在像 Twitter 这样的 UIImageView 中缩放图像

Question

我在 UITableViewCell 中的 UIImageView 中有一个图像。我想要做的是让图像的宽度等于 tableviewcell 的宽度，高度与宽度成比例，但剪裁到边界，以便图像填充 tableviewcell。

为此我使用了

image.contentMode = UIViewContentMode.ScaleAspectFill
image.clipsToBounds = true

有效。

但是，当我单击 tableviewcell 时，我想像在 Twitter 或 Facebook 应用程序中那样将 imageview 的扩展设置为全屏动画。当图像全屏显示时，不应再使用 .ScaleAspectFill，而应使用 .ScaleAspectFit，以便整个图像显示在屏幕上。如何在流畅的动画中实现这一点？目前，在设置动画时在两个缩放选项之间切换会使其在它们之间跳转。

非常感谢。

Answer 1

我认为这样做的最简单机制是有一个单独的 View (与全屏大小相同)，在其中您有一个新的 UIImageView 和任何您需要返回到原始 TableView 的控件.

要对此进行编码，一个简单的机制是在 Storyboard中使用一个单独的 View Controller ，其中包含您的 UIImageView 和图像控件等。然后您可以在单击单元格时创建该 Controller 的实例，而不是推送或呈现 Controller ，提取新的 Controller View 并将其直接拼接到 TableView 层次结构中。我将其用于弹出式气泡帮助，我想在 Controller 上显示内容并将其定位。我使用以下示例展示了创建 Controller 并使用它方便地覆盖内容的一般方法:http://blog.typpz.com/2013/12/09/ios-sdk-create-a-pop-up-window/

在您的情况下，您将向叠加 UIImageView 添加约束以获取左侧和顶部偏移、宽度和高度。使用 CTRL 拖动将它们分配给覆盖 Controller 中的 IBOutlets。然后，您可以根据需要在代码中设置这些，以使图像全屏显示或原始大小与它在您的单元格中显示的位置完全相同。

当用户单击单元格时，您将创建覆盖 Controller 并将覆盖图像约束设置为与表格单元格中的图像位置完全匹配。然后覆盖 Controller View ，将覆盖图像的约束更改为全屏(左侧和顶部偏移为 0，宽度和高度为屏幕宽度和高度)，然后为约束更改设置动画。此处介绍了如何为约束设置动画:How do I animate constraint changes?

结果将是点击时，您会看到图像从其所在位置扩大到全屏。与 Facebook 一样，您可以在动画完成时显示任何控件。您设置反向动画并移除叠加层以向后移动。

由于您有一个完整的叠加 View ，因此会捕获所有输入，从而防止与基础表进行交互。您可以使用叠加 View 的 alpha 来查看或多或少地看到下面的内容。我注意到 Facebook 会在您拖动爆炸图像时执行此操作。

看起来 Facebook 添加了一些不错的拖动手势，这些手势会启动相反的过程并在屏幕上移动图像，然后当您移开手指时，就会发生完全放松的 Action 。

Facebook 似乎还留了一个空白，让您看起来像是将它拉到全屏。