iOS 3D Touch打開控制器(類似微信聊天樣式)

使用過iPhone6s以上機型的同學們肯定使用過3D Touch的功能,隨之而來的就是各種3D Touch的相關應用。其中,除了按壓APP的logo顯示的更多功能之外,還有一個非常常見的功能,想必大家一定使用過,先上圖:


想必大家在使用微信、App Store或者是其他APP的時候一定使用過這個功能,看起來很漂亮,但是實現起來....其實也沒多難。

ok,廢話就這麼多,接下來講乾貨:
peek and pop
這個功能是一套全新的用戶交互機制,在使用3D Touch時,ViewController中會有如下三個交互階段:
1.按壓cell,周圍視圖會變模糊。


2.深按之後,彈出即將顯示的控制器。


3.上滑控制器,下面顯示對應提示按鈕。


這三個按壓的效果明白之後,之後就簡單了,分分鐘幾個方法搞定。首先先介紹一下UIViewControllerPreviewingDelegate:
當UITableViewCell或者UICollectionViewCell註冊UIViewControllerPreviewingDelegate之後纔可以實現3DTouch的代理方法,我們實現按壓打開控制器的主要使用的方法有三個

/// 給即將跳轉的控制器傳值,並且控制按壓的視圖周圍的模糊背景大小等等
-(UIViewController *)previewingContext:(id<UIViewControllerPreviewing>)previewingContext viewControllerForLocation:(CGPoint)location;

/// 控制跳轉的方法push & present
-(void)previewingContext:(id<UIViewControllerPreviewing>)previewingContext commitViewController:(UIViewController *)viewControllerToCommit;

/// 實現底部更多的按鈕(這個方法需要在即將跳轉的控制器中實現,和上面兩個方法不在同一控制器)
-(NSArray<id<UIPreviewActionItem>> *)previewActionItems;

接下繼續詳細介紹:
1.首先我們需要給cell註冊3DTouch,就是遵循UIViewControllerPreviewingDelegate

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];
    
    if (!cell) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:@"cell"];
    }
    cell.textLabel.text = [NSString stringWithFormat:@"這是第%li行", indexPath.row];
    cell.selectionStyle = UITableViewCellSelectionStyleNone;
    
    /// 先判斷3DTouch是否可用
    if (self.traitCollection.forceTouchCapability == UIForceTouchCapabilityAvailable) {// 3DTouch可用
        // 註冊3DTouch協議
        [self registerForPreviewingWithDelegate:self sourceView:cell];
    } else{
        NSLog(@"3DTouch不可用");
    }
    
    return cell;
}

2.註冊好3DTouch之後就可以放心的使用上面的三步方法了,我們先來給控制器傳個值什麼的:

-(UIViewController *)previewingContext:(id<UIViewControllerPreviewing>)previewingContext viewControllerForLocation:(CGPoint)location {
    NSIndexPath *indexPath = [self.tableView indexPathForCell:(UITableViewCell *)[previewingContext sourceView]];
    
    /// 需要創建的控制器
    LYFSubViewController *viewController = [[LYFSubViewController alloc] init];
   /// 傳值
    viewController.text = [NSString stringWithFormat:@"這是第%li行", indexPath.row];
    
    /// 沒有毛玻璃的大小(80.f就是每一個cell的高度,大家可以改變高度來看看效果)
    CGRect rect = CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 80.f);
    previewingContext.sourceRect = rect;
    
    return viewController;
}

3.接下來就是控制控制器的跳轉方法啦:

-(void)previewingContext:(id<UIViewControllerPreviewing>)previewingContext commitViewController:(UIViewController *)viewControllerToCommit {
    /// 這裏根據大家的需求處理,除了跳轉方式也可以添加邏輯
    [self showViewController:viewControllerToCommit sender:self];
}

4.最後就是在你要跳轉的控制器中實現下面的方法(就是列子中的LYFSubViewController):

/// 太簡單了,就不解釋了
-(NSArray<id<UIPreviewActionItem>> *)previewActionItems {
    UIPreviewAction *cancelAction = [UIPreviewAction actionWithTitle:@"取消" style:UIPreviewActionStyleDestructive handler:^(UIPreviewAction * _Nonnull action, UIViewController * _Nonnull previewViewController) {
        NSLog(@"取消了");
    }];
    
    UIPreviewAction *confirmAction = [UIPreviewAction actionWithTitle:@"確定" style:UIPreviewActionStyleSelected handler:^(UIPreviewAction * _Nonnull action, UIViewController * _Nonnull previewViewController) {
        NSLog(@"確定");
    }];
    
    UIPreviewAction *defaultAction = [UIPreviewAction actionWithTitle:@"你好呀兄弟" style:UIPreviewActionStyleDefault handler:^(UIPreviewAction * _Nonnull action, UIViewController * _Nonnull previewViewController) {
        NSLog(@"你好呀,兄die");
    }];
    return @[cancelAction, confirmAction, defaultAction];
}

ok,大功告成了有木有,簡直太eazy了。需要demo的同學們可以點擊:https://github.com/Fdevelopmenter/3DTouchPreview.git
喜歡的點個贊在走啦

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章