你好,歡迎來到IOS教程網

 Ios教程網 >> IOS編程開發 >> IOS開發基礎 >> 一行代碼,讓你的應用中UIScrollView的滑動與側滑返回並存

一行代碼,讓你的應用中UIScrollView的滑動與側滑返回並存

編輯:IOS開發基礎

側滑返回是iOS系統的一個很貼心的功能,特別是在大屏手機上,單手操作的時候去按左上角的返回鍵特別不方便。當我在使用一個APP的時候,如果控制器不能側滑返回,我會覺得這個APP十分不友好...這款產品在我心中的印象分也會有所降低...
側滑返回本身是系統自帶的效果,無須開發者處理的。但是,一旦給控制器加了leftBarButtonItem,系統側滑手勢居然失效了(蘋果你這樣真的好嗎...),要重新支持側滑返回,可以做以下處理:

一、讓應用支持側滑返回

  1. 導入FDFullscreenPopGesture庫,pod安裝一下即可,安裝後無須再加任何代碼,應用所有頁面都將支持全屏側滑。github地址:https://github.com/forkingdog/FDFullscreenPopGesture 。
    如果你或者你們產品不喜歡全屏側滑,還是喜歡在屏幕左邊緣處才觸發側滑,那可以看看第二種方式:

  2. 寫一個UINavigationController的子類,設置導航控制器的代理為自己,實現下面這個代理方法:

    - (void)navigationController:(UINavigationController *)navigationController didShowViewController:(UIViewController *)viewController animated:(BOOL)animated {
         // 讓系統的側滑返回生效
         self.interactivePopGestureRecognizer.enabled = YES;
         if (viewController == self.viewControllers[0]) {
             self.interactivePopGestureRecognizer.delegate = self.tz_PopDelegate; // 不支持側滑
         } else {
             self.interactivePopGestureRecognizer.delegate = nil; // 支持側滑
         }
      }

viewDidLoad方法中,給popDelegate賦值: self.popDelegate = self.interactivePopGestureRecognizer.delegate 。這樣操作後,即使給控制器加了leftBarButtonItem,系統的側滑返回也能生效了。當然,我所使用的絕大部分APP,都能有側滑返回的效果,想必上面的內容大家都是掌握的~ 不過有一款APP,我想要指出一下:《自如》...你為什麼不支持側滑返回...你對得起你們的60萬自如客嗎...

二、怎麼讓UIScrollView和側滑返回並存?

對側滑返回的基礎介紹完畢,接下來是本文的重點咯:
大家在開發中一定遇到過這個問題,如果界面中有一個可以水平滑動的UIScrollView,那麼系統側滑返回又失效了...因為你在屏幕左邊緣側滑的時候,做出響應的是UIScrollView,事件並沒有傳遞到UINavigationController的view,所以也就沒有了側滑返回。這種情況該怎麼處理呢?我們先來看看別的應用是怎麼處理的:
阿裡系:《淘寶》、《支付寶》、《菜鳥裹裹》。我手機上裝的三個阿裡系APP都沒有處理這種情況,在其地圖頁面側滑返回均失效了...
新美大:很遺憾,《美團》和《大眾點評》也陣亡了...
騰訊系:《QQ》陣亡,而《微信》...成為我發現的第一個對這種情況做出很好處理的應用。在微信訂閱號圖文閱讀界面的圖片浏覽器、聊天界面查看共享位置的地圖界面,均支持側滑返回,又不影響界面本身的滑動,給微信點贊~
此外,在寫這篇博文的時候,我還測試了幾個APP,其中《鏈家》和《鏈家上海》也對這種情況做了很好的處理,點贊~
比較奇怪的是,鏈家上海和鏈家的圖片選擇器用的不是同一個,鏈家上海在聊天頁面用的圖片選擇器是我寫的TZImagePickerControllergithub鏈接:https://github.com/banchichen/TZImagePickerController,而鏈家不是...如果大家兩個應用都裝了的話,可以明顯感受到鏈家的圖片選擇器體驗明顯不如TZImagePickerController,比如圖片顯示模糊,在快速滑動時有明顯的卡頓感等,嘎嘎,理性地打個廣告...詳細介紹請見上篇博文~

好了,那微信和鏈家是怎麼讓UIScrollView的滑動與系統側滑並存的呢?
首先我們打開微信,隨機點開一個聊天窗口發送位置給對方,點擊位置信息查看地圖,我們發現當在屏幕左邊緣向左滑動時,觸發的是側滑返回,其他情況都觸發的是地圖的滑動。
我們知道,側滑返回效果的觸發需要滿足:(1) 滑動位置在屏幕左邊緣;(2)向右滑動;
在微信查看地圖界面,我們發現當側滑返回手勢生效時,地圖滑動則失效。只有在側滑返回失效時,地圖才會滑動。達到了兩個手勢並存的效果。

三、集成TZScrollViewPopGesture,一行代碼搞定

基於以上的思考,在參考了FDFullscreenPopGesture和數篇博客後,我的解決思路如下:

  1. (1) 創建一個UIPanGestureRecognizer手勢,該手勢觸發時執行側滑返回的action,為了使用方便,我將其寫在分類裡面,代碼如下:

    - (UIPanGestureRecognizer *)tz_popGestureRecognizer {
         UIPanGestureRecognizer *pan = objc_getAssociatedObject(self, _cmd);
         if (!pan) {
             // 側滑返回手勢 手勢觸發的時候,讓target執行action
             id target = self.tz_PopDelegate;
             SEL action = NSSelectorFromString(@"handleNavigationTransition:");
             pan = [[UIPanGestureRecognizer alloc] initWithTarget:target action:action];
             pan.maximumNumberOfTouches = 1;
             pan.delegate = self;
             self.interactivePopGestureRecognizer.enabled = NO;
             objc_setAssociatedObject(self, _cmd, pan, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
         }
         return pan;
      }

(2) 模仿一下系統側滑返回手勢的觸發條件,給這個手勢限定合適的觸發條件(滑動位置在屏幕左邊緣+向右滑),代碼如下:

- (BOOL)gestureRecognizerShouldBegin:(UIPanGestureRecognizer *)gestureRecognizer {
     if ([[self valueForKey:@"_isTransitioning"] boolValue]) {
         return NO;
     }
     if (self.childViewControllers.count <= 1) {
         return NO;
     }
     // 側滑手勢觸發位置
     CGPoint location = [gestureRecognizer locationInView:self.view];
     CGPoint offSet = [gestureRecognizer translationInView:gestureRecognizer.view];
     BOOL ret = (0 < offSet.x && location.x <= 40);
     NSLog(@"%@ %@",NSStringFromCGPoint(location),NSStringFromCGPoint(offSet));
     return ret;
}

(3) 側滑手勢優先,側滑手勢失效時,才觸發UISrcollView的滑動

- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldBeRequiredToFailByGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer {     return YES;
}
  1. 手勢已經定義好了,接下來把它加在合適的UISrcollView上面即可,我於是給UIViewController寫了個分類,新增方法:- (void)tz_addPopGestureToView:(UIView *)view;  在需要UISrcollView滑動和系統側滑同時並存的界面中,只需要在控制器中調用這個方法即可解決:[self tz_addPopGestureToView:scrollView];

我在我的多個項目中測試這個分類,發現效果都十分理想,和微信、鏈家APP的效果是一致的。使用起來還算方便,一行代碼即可搞定。經過測試,TZScrollViewPopGestureFDFullscreenPopGesture並不會沖突,兩者可以和諧共存,大家不妨一試。下面放個截個圖讓大家看看效果~

1171135-39035f1c7555f6cc.png

以上代碼均可在Demo中見到,更多信息詳見Demo,github地址:https://github.com/banchichen/TZScrollViewPopGesture
當然,TZScrollViewPopGesture也支持pod安裝,在podfile中加入 pod 'TZScrollViewPopGesture' 即可。
老規矩,大家覺得好的話,給一個小小的star鼓勵一下噢~

技術進步一小步,用戶體驗也進步一小步...有進步就好~
(順便吐槽一下支付寶等諸多應用對鍵盤類型的不良處理,明明是讓我輸入數字驗證碼,你不給我彈出數字鍵盤真的好嗎.......)

參考鏈接:
輕松學習之二——iOS利用Runtime自定義控制器POP手勢動畫
【8行代碼教你搞定導航控制器全屏滑動返回效果】 |那些人追的干貨
參考代碼:
FDFullscreenPopGesture



文章轉自 半尺塵的簡書
  1. 上一頁:
  2. 下一頁:
蘋果刷機越獄教程| IOS教程問題解答| IOS技巧綜合| IOS7技巧| IOS8教程
Copyright © Ios教程網 All Rights Reserved