2012-03-21 43 views
4

我正在尋找一種方式來從屏幕外滑動部分隱藏的工具面板像JetBlue iPhone應用程序那樣。我知道如何使用常規的滑動手勢識別器來做到這一點,但該應用程序有一定的閾值,之後面板「捕捉」到屏幕上的位置,否則它會隱藏回屏幕外。如何從JetBlue iPhone應用程序中輕輕地拖動屏幕像屏外

我該如何實現這種滑動顯示,但使用閾值類型的手勢識別器?是否有任何開源項目可以進行這種UI操作?

回答

3

如果您已經可以通過手勢實現基本功能,那麼您幾乎就在那裏!

說實話,雖然我正是這樣做在我的申請,我用的是老式的touchesBegan,touchesMoved等

在手勢的方面,你將不得不使用UIPanGestureRecognizer所以你可以有完全控制拖動。 UISwipeGestureRecognizer只能識別滑動。

無論如何,在某一點之後,您只需將面板的一小部分轉換爲該人拖動的距離的一小部分即可。

CGRect newPanelFrame = panel.frame; 
if (newPanelFrame.origin.y + dragOffset > 275) { 
    newPanelFrame.origin.y += dragOffset/2.0; 
} 
panel.frame = newPanelFrame; 

touchesEnded:withEvent:if (gestureRecognizer.state == UIGestureRecognizerStateEnded)

CGRect newPanelFrame = panel.frame; 
if (newPanelFrame.origin.y > 275) { 
    newPanelFrame.origin.y = 275; 
} 
panel.frame = newPanelFrame; 

爲什麼我從來沒有與UIPanGestureRecognizer困擾的原因是因爲我永遠無法弄清楚如何獲得非累積轉換(translationForView:是累積) ,如果你想基本上減緩閾值後的阻力,這是必要的。

4

我在我寫的應用程序中有一個類似的界面元素。我的界面元素是整個工具面板的UIViewController。我把一個UIButton放在抓手插圖上,將按鈕的類型改爲自定義,以便它在視覺上消失。我將Touch Drag Inside和Touch Drag Outside連接到IBAction,根據拖動的位置調整面板的位置。我將Touch Up Inside和Touch Up Outside連接到一個IBAction,以最終確定視圖的位置。如果觸摸事件發生得太靠近底部,我就關閉面板。如果它發生在高於此閾值的地方,我打開面板。我使用UIView的動畫方法來平滑這些轉換。在JetBlue應用程序中看到的擴展元素可以在拖動事件處理程序中完成。隨着面板越來越接近極限,隨着觸摸的每次移動,視圖越來越小。然後在最終定稿中,只需將面板動畫回到其首選結束位置即可。

JetBlue應用程序與我的應用程序的不同之處在於我有一個小抓手區域,但JetBlue的應用程序允許您輕掃整個面板以調整位置。爲了匹配這個功能,我會調整我的實現來完全覆蓋面板上的按鈕。每個人都會對我的拖動事件做出迴應,另外拖動會設置一個標誌。然後,我的觸摸事件處理程序將檢查標誌是否設置。如果是這樣,最終確定面板的拖動。否則,執行與每個按鈕相關的適當操作。

+0

好的描述性答案 – 2012-03-21 20:45:44

+0

如何從IBAction方法中獲取觸摸事件的座標? – samsam 2013-01-28 14:19:50

+1

@samsam:IBAction方法可以具有三個簽名中的一個,無參數,一個參數(發件人)和兩個參數(發件人和觸摸事件)。只需使用包含觸摸位置數據的觸摸事件的版本即可。 – 2013-01-28 18:16:09

0

我只是做了一些研究,以達到類似的效果,偶然發現這篇文章,並因此決定給JetBlue一個嘗試。

玩過滑動面板後,我實際上認爲JetBlue的玩家實際上是以一種稍微不同的方式去解決這個問題的。

JetBlue應用程序中滑塊的運動看起來比您可以對UIGestureRecognizers的集合進行的處理好得多;它能夠以不同的速度進行動畫製作,具體取決於用戶滑動的速度,橡皮圈也可以對此進行適當的補償。

所以在那個筆記上,我實際上認爲他們沒有使用UIGestureRecognizers,但該面板實際上只是一個標準的UIScrollView,與應用程序窗口的底部對齊,並帶有一些額外的邏輯(可能通過委託),只是確保滾動視圖不能在「打開」和「關閉」狀態之間停止動畫。

相關問題