如何重新創建Jetsetter的iOS預告片照片和照片查看器幻燈片轉換？

Question

我遇到過的更令人印象深刻的iOS應用之一是Jetsetter，它的優秀設計，令人難以置信的界面和動畫的創造性使用。我最喜歡的應用程序組件之一是他們對酒店/場館的預告照片界面。它們提供了最小化的照片幻燈片，但是如果您想要全視圖，則可以單擊它並將其展開以展示較大版本的圖像。你可以在行動here看到一個模糊的視頻。

我很感興趣，重新創建類似的東西。我非常瞭解像MHPagingScrollview這樣的分頁畫廊（這是更大的照片查看器的功能），但我想弄清楚的是處理過渡的正確方法。我還見過處理Ken Burns effect圖像的庫。然而，不清楚的是是否有單獨的視圖控制器。

這是兩個獨立視圖控制器之間的轉換嗎？或者最小化和最大化的照片瀏覽器是否是同一控制器的一部分？你將如何最有效地複製類似的東西？我在下面嵌入了一個屏幕截圖，以說明前後的情況。然而，video linked above最有效地說明了這種轉變。從這裏的Jetsetter

Answer 1

移動工程師。它們是兩個獨立的控制器，但過渡動畫首先發生。這裏是流程：

1. 用戶點擊較小的照片。
2. 包含全尺寸圖像的轉場視圖直接放置在較小圖像的頂部。
3. 過渡視圖動畫到屏幕的邊界。
4. 照片查看器控制器以無模式顯示，以一個無縫動畫完成效果。

當模態控制器被解除時，效果被逆轉。

訣竅在於你的轉換視圖。我們創建了一個包含imageView的UIView子類（啓用了clipsToBounds）。過渡視圖的範圍擴大以顯示imageView，從而在動畫期間不會導致最終圖像失真。