實現Facebook信使樣式泛到全屏視圖類似的效果

我已經實現了UIPageviewContoller以支持在屏幕的底部多個viewcontoller視圖。現在我的問題是如何在我的pageview控制器上支持對這個子視圖的Facebook風格的平移效果。實現Facebook信使樣式泛到全屏視圖類似的效果

我想實現他們在相機中應用的Facebook消息風格效果，用手指可以使視圖變成全屏。當我們平移相同的視圖時，它將在原始視圖內調整.. 我附加了一些屏幕以便更好地理解。

subview have pan gesture pan up to full screen pandown to minimize after pan down reset to original postion

，它應該支持整合流行的姿態。

ienterative pop

我能抽到但我已經添加視圖到主窗口類似的效果，從而視圖可以平移，以全屏幕，但通過這種方式我不能夠實現互動流行的iOS默認的姿態，這方法對我目前的pageviewcontoller實現不好。

如果在窗口中添加視圖比用戶按下後退按鈕而不是窗口元素將不會移動它將保持在窗口中，所以窗口方法並不好。

有沒有其他方法可以得到類似的效果？ UIViewControllerInteractiveTransitioning可以幫助嗎？

在此先感謝。我知道我會從你們那裏得到更好的方法，這會比將子視圖添加到窗口更穩定。

來源

2014-11-04 Parth Patel p1nt0z

我想實現類似的東西。你能給我一個建議，你如何使用PageViewController實現上面的內容？謝謝。 – 2015-05-15 21:30:48

我已經在窗口中添加了控制器視圖，並使用平移手勢將y幀重新調整爲窗口大小。你可以嘗試添加是根據你的需要像導航viewcontroller的視圖或窗口或viewcontroller中的addsubview。與UIEdgesture（leftedge）識別器相比，如果交互式backswipe將執行設置x位置，它將幫助您設置框架。我現在不在我的辦公桌前，所以不能給你代碼。將在幾天後發佈你，讓我知道如果你不能這樣做， – 2015-05-16 05:30:48

您是否嘗試在您的子視圖A中添加輕掃手勢？

UISwipeGestureRecognizer *swipeUp = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(didSwipeScreen:)]; 
swipeUp.direction = UISwipeGestureRecognizerDirectionUp; 
[yourSubViewA addGestureRecognizer:swipeUp];

，它的操控性 -

- (void)didSwipeScreen:(UISwipeGestureRecognizer *)gesture { 
switch (gesture.direction) { 
    case UISwipeGestureRecognizerDirectionUp: { 
     [UIView animateWithDuration:0.5 delay:0.0 options:UIViewAnimationOptionCurveLinear animations:^{ 
      [yourSubViewA setFrame:desiredFullScreenFrame]; 
     } completion:^(BOOL finished) { 
     }]; 
    } 
     break; 
    default: 
     break; 
    } 
}

帶回默認你可以UISwipeGestureRecognizerDirectionDown或者只是點擊手勢添加其他滑動手勢位置。而對於側面菜單MFSideMenu是不錯的一個。

來源

2014-11-13 09:26:07 RoHaN

實際上，我不想要滑動菜單。我相似的效果是由平移手勢，但我希望像你的效果子視圖將擴大到全窗口。 – 2014-11-13 15:05:08

好吧，那麼UISwipeGestureRecognizer將在UISwipeGestureRecognizerDirectionUp事件中工作。 – RoHaN 2014-11-14 09:02:32

Here, i used same code for my app for video sharing (same as facebook messenger media sharing) 

Create one Uiview Name as ViewCamera with one labelHoldText and three buttons 
    and download SCRecoder from github 

import SCRecoder class here in (.h) file and do same as below 

     #import <UIKit/UIKit.h> 
     #import "SCRecorder.h" 
     #import "SCAudioTools.h" 
     #import "SCRecorderFocusView.h" 
     #import "SCRecordSessionManager.h" 
     #import "SCTouchDetector.h" 


     @protocol VideoRecordDelegate <NSObject> 

     @optional 

     -(void)VideoRecorded:(NSURL *)assetUrl; 

     @end 

     typedef enum : NSInteger { 

      NOTRECORDING = 0, 
      RECORDING=1, 
      RETAKE, 

     } ENUMRecordType; 

     @interface ChatScreen : UIViewController<ChatCellDelegate,SCRecorderDelegate,UITableViewDataSource,UITableViewDelegate,,UIGestureRecognizerDelegate> 
     { 
      IBOutlet UIView *viewbottomForCamera; 

      __weak IBOutlet UIButton *btnViewCameraChange; 
      __weak IBOutlet UIButton *btnViewFullScree; 
      __weak IBOutlet UIButton *btnVideoSend; 


      PDColoredProgressView *progressView; 
      NSTimer *timerForVideoSend; 
      CGFloat progressValue; 
      UILabel *lblHoldtext; 
      UILabel *lblCount; 
      BOOL isCanceled,isOpen; 

      IBOutlet UIView *viewCamera; 



      //new 

      UIView *previewView; 
      CALayer *layerQ; 

      SCRecorder *_recorder; 
      UIImage *_photo; 
      SCRecordSession *_recordSession; 
      ENUMRecordType enumRecordType; 


     } 
     - (IBAction)btnInstantVideoTapped:(id)sender; 
     - (IBAction)btnViewCameraTapped:(id)sender; 
     - (IBAction)btnViewSendTapped:(id)sender; 
     - (IBAction)btnViewFullScreenTapped:(id)sender; 

     @property (strong, nonatomic) SCRecorderFocusView *focusView; 
     @property (nonatomic) float progress; 
     @property (nonatomic, strong) CAShapeLayer *progressLayer; 
     @property (nonatomic,strong) id<VideoRecordDelegate> deleagte; 

     @end 

      - (void)viewDidLoad { 

      [super viewDidLoad]; 

//lbl hold text for = @"@"Hold send button for video, tap for photo"" 
      lblHoldtext =[[UILabel alloc]init]; 
      lblHoldtext.adjustsFontSizeToFitWidth = YES; 
      [lblHoldtext setTextAlignment:NSTextAlignmentCenter]; 

      progressValue = 0; 

       // pan for swipable camera view on touch  
      UIPanGestureRecognizer *panRecognizer = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handlePan:)]; 
      [panRecognizer setMinimumNumberOfTouches:1]; 
      [panRecognizer setMaximumNumberOfTouches:1]; 
      [viewCamera addGestureRecognizer:panRecognizer]; 

      //for video sharing on hold button  
      UILongPressGestureRecognizer *longGestureForSendImageORVideo = [[UILongPressGestureRecognizer alloc] init]; 
      [longGestureForSendImageORVideo addTarget:self action:@selector(LongPressForSendVideo:)]; 
      [longGestureForSendImageORVideo setMinimumPressDuration:1.0]; 
      [btnVideoSend addGestureRecognizer:longGestureForSendImageORVideo]; 

      [btnVideoSend.layer setBorderColor:[UIColor whiteColor].CGColor]; 
      //  UIColor *background = [[UIColor alloc] initWithPatternImage:[UIImage imageNamed:@"2Chat"]]; 
      [lblHoldtext setFrame:CGRectMake(20, 10, SCREENWIDTH-40, 20)]; 
      [lblHoldtext setText:@"Hold send button for video, tap for photo"]; 
      [viewCamera setFrame:CGRectMake(0, SCREENHEIGHT, SCREENWIDTH, viewCamera.frame.size.height)]; 
      [lblHoldtext setTextColor:[UIColor whiteColor]]; 
      [viewCamera addSubview:lblHoldtext]; 
      [viewCamera setBackgroundColor:[UIColor grayColor]]; 

      [self.navigationController.view addSubview:viewCamera]; 
      progressView = [[PDColoredProgressView alloc] initWithProgressViewStyle:UIProgressViewStyleDefault]; 
      progressView.frame =CGRectMake(0,viewCamera.frame.size.height-32, SCREENWIDTH, viewbottomForCamera.frame.size.height); 
      [progressView.layer setMasksToBounds:NO]; 
      [progressView setTrackTintColor:[UIColor clearColor]]; 
      progressView.progress = 0.0; 

      lblCount = [[UILabel alloc]initWithFrame:CGRectMake(40,15, 50, 30)]; 
      [lblCount setTextColor:[UIColor whiteColor]]; 
      [progressView addSubview:lblCount]; 

      //video recording 
      _recorder = [SCRecorder recorder]; 
      _recorder.sessionPreset = AVCaptureSessionPresetMedium;//[SCRecorderTools bestSessionPresetCompatibleWithAllDevices]; 
      _recorder.maxRecordDuration = CMTimeMake(VIDEODURATIONLIMIT, 1); 
      _recorder.delegate = self; 
      _recorder.autoSetVideoOrientation = YES; 

      self.focusView = [[SCRecorderFocusView alloc] initWithFrame:viewCamera.bounds]; 
      self.focusView.recorder = _recorder; 

      [viewCamera addSubview:self.focusView]; 

     // UIView *previewViewDemo = previewView; 
      _recorder.previewView = viewCamera; 
      [_recorder.videoConfiguration setSizeAsSquare:YES]; 
      //[_recorder.videoConfiguration setSize:CGSizeMake(SCREENWIDTH/2, SCREENHEIGHT/2)]; 
      _recorder.initializeRecordSessionLazily = YES; 



      [_recorder openSession:^(NSError *sessionError, NSError *audioError, NSError *videoError, NSError *photoError) { 

       //NSLog(@"==== Opened session ===="); 
       //NSLog(@"Session error: %@", sessionError.description); 
       //NSLog(@"Audio error : %@", audioError.description); 
       //NSLog(@"Video error: %@", videoError.description); 
       //NSLog(@"Photo error: %@", photoError.description); 
       //NSLog(@"======================="); 
       [self prepareCamera]; 
      }]; 



     } 
     - (void)layoutSubviews { 
      // resize your layers based on the view's new bounds 
      previewLayer.frame = viewCamera.bounds; 
     } 

     - (void)didReceiveMemoryWarning { 
      [super didReceiveMemoryWarning]; 
     } 

     -(void)viewWillAppear:(BOOL)animated 
     { 
      [super viewWillAppear:YES];  

     } 
     -(void)viewWillDisappear:(BOOL)animated 
     { 
      [super viewWillDisappear:YES]; 
      [ShareObj setIsChtScreenPresent:NO]; 
      [self.view endEditing:YES]; 
      [viewCamera removeFromSuperview]; 
      [_recorder endRunningSession]; 

      [[NSNotificationCenter defaultCenter] removeObserver:self]; 
     } 

     -(void)viewDidAppear:(BOOL)animated 
     { 
      [super viewDidAppear:YES]; 
      [_recorder startRunningSession]; 

     } 
     - (IBAction)btnInstantVideoTapped:(id)sender { 

     [self.view endEditing:YES]; 
     if (!isOpen) { 

      isOpen = YES; 
      [UIView animateWithDuration:0.5 animations:^{ 


       [_recorder.previewView setFrame:CGRectMake(0, SCREENHEIGHT-258,SCREENWIDTH,258)]; 
       _recorder.previewLayer.frame = _recorder.previewView.bounds; 
       layerQ.frame = _recorder.previewView.bounds; 
       [chatBottomView setFrame:CGRectMake(0,_recorder.previewView.frame.origin.y-chatBottomView.frame.size.height*2-12, SCREENWIDTH, chatBottomView.frame.size.height)]; 
       NSLog(@"hide frame = %@",NSStringFromCGRect(chatBottomView.frame)); 
       demoFrame=chatBottomView.frame; 

       UISwipeGestureRecognizer *panView=[[UISwipeGestureRecognizer alloc]initWithTarget:self action:@selector(handlePan:)]; 
       [_recorder.previewView addGestureRecognizer:panView]; 
       [_recorder.previewView bringSubviewToFront:viewbottomForCamera]; 
       [viewbottomForCamera bringSubviewToFront:btnViewFullScree]; 
       [viewbottomForCamera bringSubviewToFront:btnViewCameraChange]; 
       [self.navigationController.view addSubview:viewCamera]; 


      }completion:^(BOOL finished) { 


      }]; 

     } 
     else 
     { 
      isOpen = NO; 

      [UIView animateWithDuration:0.5 animations:^{ 
       CGRect frame = chatBottomView.frame; 
       frame.origin.y = SCREENHEIGHT-frame.size.height-NAVBARHEIGHT; 
       [chatBottomView setFrame:frame]; 
       [_recorder.previewView setFrame:CGRectMake(0, SCREENHEIGHT, SCREENWIDTH, viewCamera.frame.size.height)]; 
       [tblChatMessage setContentInset:UIEdgeInsetsMake(0, 0, 0, 0)]; 
       [tblChatMessage setScrollIndicatorInsets:UIEdgeInsetsMake(0, 0, 0, 0)]; 


       NSLog(@" hide frame = %@",NSStringFromCGRect(frame)); 
      } completion:^(BOOL finished) { 
       [viewCamera removeFromSuperview]; 
      }]; 
     } 
    } 

     #pragma mark Gesture Event is called here.. 
    -(void)LongPressForSendVideo: (UILongPressGestureRecognizer*)recognizer 
    { 

     CGPoint pointOfTouch = [recognizer locationInView:viewbottomForCamera]; 

     if (recognizer.state == UIGestureRecognizerStateEnded) { 

      [progressView setProgress:0.0 animated:YES]; 
      progressValue=0.0; 
      [progressView removeFromSuperview]; 
      [timerForVideoSend invalidate]; 
      timerForVideoSend =nil; 
      [layerQ removeFromSuperlayer]; 
      [btnViewCameraChange.layer setOpacity:1]; 
      [btnViewFullScree.layer setOpacity:1]; 

      [lblHoldtext setText:@"Hold send button for video, tap for photo"]; 

     } 
     else if (recognizer.state==UIGestureRecognizerStateChanged) 
     { 
      if (CGRectContainsPoint(btnVideoSend.frame, pointOfTouch)) { 
       // inside 
       [lblHoldtext setText:@"To cancel, drag your finger off send button"]; 

       NSLog(@"inside"); 
       [progressView setTintColor: [UIColor colorWithRed: 43.0/255.0 green: 134.0/255.0 blue: 225.0/255.0 alpha: 1]]; 
       [layerQ setBackgroundColor:[UIColor clearColor].CGColor]; 

      } else { 
       // outside 
       NSLog(@"outside"); 
       [lblHoldtext setText:@"Let go to delete and start over"]; 

       [progressView setTintColor:[UIColor redColor]]; 
       [layerQ setBackgroundColor:[UIColor colorWithRed:255.0/255.0 green:0/255.0 blue:0/255.0 alpha:0.2].CGColor]; 



      } 

     } 
     else if (recognizer.state==UIGestureRecognizerStateBegan) 
     { 
      layerQ = [[CALayer alloc]init]; 
      [layerQ setFrame:_recorder.previewLayer.frame]; 
      [viewCamera.layer addSublayer:layerQ]; 
      [btnViewCameraChange.layer setOpacity:0.3]; 
      [btnViewFullScree.layer setOpacity:0.3]; 
      [lblHoldtext setText:@"To cancel, drag your finger off send button"]; 

      [progressView setProgress:0.0 animated:YES]; 
      progressValue=0.0; 
      if (timerForVideoSend == nil) { 
       timerForVideoSend = [NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(progressChange) userInfo:nil repeats:YES]; 
      } 
      [progressView setTintColor: [UIColor colorWithRed: 43.0/255.0 green: 134.0/255.0 blue: 225.0/255.0 alpha: 1]]; 
      [viewCamera addSubview:progressView]; 
      [viewCamera bringSubviewToFront:viewbottomForCamera]; 

     } 

    } 
    -(void)progressChange 
    { 
     progressValue = progressValue + 0.0065; 
     [viewCamera bringSubviewToFront:lblCount]; 
     [lblCount setText:[NSString stringWithFormat:@"%.1f",progressValue]]; 
     [progressView setProgress:progressValue animated:YES]; 
    } 
    - (void)handlePan:(UIPanGestureRecognizer*)recognizer 
    { 
     CGPoint vel = [recognizer velocityInView:viewCamera]; 
     CGFloat velocityFrame = (vel.y/70); 

     if (vel.y > 0) 
     { 
      // user dragged towards the right 
      NSLog(@" down"); 


       velocityFrame = velocityFrame; 


      NSLog(@"velocity%f",velocityFrame); 

      if (_recorder.previewView.frame.size.height >= 256) { 

        _recorder.previewView.frame=CGRectMake(0, _recorder.previewView.frame.origin.y+velocityFrame, SCREENWIDTH, _recorder.previewView.frame.size.height-velocityFrame); 
        [viewbottomForCamera setBackgroundColor:COLOR_WITH_RGBA(0, 0, 0, 0)]; 
        CGFloat alphacolor = _recorder.previewView.frame.size.height/2000; 
        [viewbottomForCamera setFrame:CGRectMake(0, _recorder.previewView.frame.size.height-65, SCREENWIDTH, 65)]; 
        [viewbottomForCamera setBackgroundColor:COLOR_WITH_RGBA(37, 37, 38, alphacolor)]; 
        [lblHoldtext setFrame:CGRectMake(0, 0, 0, 0)]; 
        [progressView.layer setFrame:viewbottomForCamera.frame]; 
      } 

     } 
     else 
     { 

      velocityFrame = -(velocityFrame); 
      velocityFrame = velocityFrame; 

      NSLog(@"velocity%f",velocityFrame); 
      NSLog(@"up"); 
      if (_recorder.previewView.frame.origin.y >5) { 


       [UIView animateWithDuration:0.2 animations:^{ 


        _recorder.previewView.frame=CGRectMake(0, _recorder.previewView.frame.origin.y-velocityFrame, SCREENWIDTH, _recorder.previewView.frame.size.height+velocityFrame); 
        _recorder.previewLayer.frame = self.navigationController.view.bounds; 
        [viewbottomForCamera setFrame:CGRectMake(0,_recorder.previewView.frame.size.height-65, SCREENWIDTH, 65)]; 
        CGFloat alphacolor = viewCamera.frame.size.height/1000; 
        [lblHoldtext setFrame:CGRectMake(0, 0, 0, 0)]; 
        [progressView.layer setFrame:viewbottomForCamera.frame]; 


        if (alphacolor <= 0.6) { 
         [viewbottomForCamera setBackgroundColor:COLOR_WITH_RGBA(37, 37, 38, alphacolor)]; 
        } 
        [lblHoldtext setFrame:CGRectMake(0, 0, 0, 0)]; 

       } completion:^(BOOL finished) { 

       }]; 
      } 

     } 

     if(recognizer.state == UIGestureRecognizerStateEnded) 
     { 
      if (vel.y < 0) { 

       [UIView animateWithDuration:0.2 animations:^{ 

        _recorder.previewView.frame=CGRectMake(0, 0, SCREENWIDTH, SCREENHEIGHT); 
        [viewbottomForCamera setFrame:CGRectMake(0, _recorder.previewView.frame.size.height-65, SCREENWIDTH, 65)]; 
        CGFloat alphacolor = _recorder.previewView.frame.size.height/1000; 
        if (alphacolor <= 0.6) { 
         [viewbottomForCamera setBackgroundColor:COLOR_WITH_RGBA(37, 37, 38, alphacolor)]; 

        } 
        [progressView.layer setFrame:viewbottomForCamera.frame]; 



       } completion:^(BOOL finished) { 
        _recorder.previewLayer.frame = _recorder.previewView.bounds; 

        [lblHoldtext setFrame:CGRectMake(20, viewbottomForCamera.frame.origin.y-30, SCREENWIDTH-40, 20)]; 

       }]; 


      } 
      else 
      { 

       [UIView animateWithDuration:0.1 animations:^{ 
        [_recorder.previewView setFrame:CGRectMake(0, SCREENHEIGHT-258,SCREENWIDTH,258)]; 
        [viewbottomForCamera setFrame:CGRectMake(0, _recorder.previewView.frame.size.height-65, SCREENWIDTH, 65)]; 
        [viewbottomForCamera setBackgroundColor:COLOR_WITH_RGBA(0, 0, 0, 0)]; 
        [progressView.layer setFrame:viewbottomForCamera.frame]; 




       }completion:^(BOOL finished) { 
        _recorder.previewLayer.frame = _recorder.previewView.bounds; 

        [lblHoldtext setFrame:CGRectMake(20, 10, SCREENWIDTH-40, 20)]; 

       }]; 
      } 
     } 
    } 
    -(IBAction)btnViewCameraTapped:(id)sender 
    { 

    } 
    //take image 
    - (IBAction)btnViewSendTapped:(id)sender { 

    // AVCaptureConnection *videoConnection = nil; 
    //  
    // for (AVCaptureConnection *connection in stillImageOutput.connections) { 
    //   
    //  for (AVCaptureInputPort *ports in [connection inputPorts]) { 
    //    
    //   if ([[ports mediaType] isEqual:AVMediaTypeVideo]) { 
    //    videoConnection = connection; 
    //    break; 
    //   } 
    //  } 
    //  if (videoConnection) { 
    //   break; 
    //  } 
    // } 
    //  
    // [stillImageOutput captureStillImageAsynchronouslyFromConnection:videoConnection completionHandler:^(CMSampleBufferRef imageDataSampleBuffer, NSError *error) { 
    //  
    //  if (imageDataSampleBuffer !=nil) { 
    //    
    //   NSData *imagedata = [AVCaptureStillImageOutput jpegStillImageNSDataRepresentation:imageDataSampleBuffer]; 
    //   UIImage *image =[UIImage imageWithData:imagedata]; 
    //  } 
    // }]; 
    } 
    //open/Close view 
    - (IBAction)btnViewFullScreenTapped:(id)sender { 

     [lblHoldtext setFrame:CGRectMake(0, 0, 0, 0)]; 
    // [lblHoldtext setText:@"To cancel, drag your finger off send button"]; 
    // [lblHoldtext setText:@"Let go to delete and start over"]; 

     if (_recorder.previewView.frame.size.height >= SCREENHEIGHT/2+100) { 

      [UIView animateWithDuration:0.5 animations:^{ 

       [viewCamera setFrame:CGRectMake(0, SCREENHEIGHT-256,SCREENWIDTH,258)]; 
       [lblHoldtext setFrame:CGRectMake(20, 10, SCREENWIDTH-40, 20)]; 
       [viewbottomForCamera setFrame:CGRectMake(0, _recorder.previewView.frame.size.height-65, SCREENWIDTH, 65)]; 
       [viewbottomForCamera setBackgroundColor:COLOR_WITH_RGBA(0, 0,0,0)]; 
       [progressView.layer setFrame:viewbottomForCamera.frame]; 


      }completion:^(BOOL finished) { 
       _recorder.previewLayer.frame = viewCamera.bounds; 

      }]; 
     } 
     else 
     { 
      [UIView animateWithDuration:0.5 animations:^{ 
       viewCamera.frame=CGRectMake(0, 0, SCREENWIDTH, SCREENHEIGHT); 
       _recorder.previewLayer.frame = viewCamera.bounds; 
       [viewbottomForCamera setFrame:CGRectMake(0, _recorder.previewView.frame.size.height-65, SCREENWIDTH, 65)]; 
       CGFloat alphacolor = _recorder.previewView.frame.size.height/1000; 
       [progressView.layer setFrame:viewbottomForCamera.frame]; 

       if (alphacolor <= 0.7) { 
        [viewbottomForCamera setBackgroundColor:COLOR_WITH_RGBA(37, 37, 38, alphacolor)]; 

       } 


      } completion:^(BOOL finished) { 

       [lblHoldtext setFrame:CGRectMake(20, viewbottomForCamera.frame.origin.y-30, SCREENWIDTH-40, 20)]; 

      }]; 

     } 
    }

來源

2015-09-24 09:23:24 jatin

嘿兆豐它的實際答案我認爲，但他應該給代碼中的描述或評論..... – TheMall 2015-09-24 12:34:00

@MegaTron嘿它的答案和更多描述請通過評論（/ /）在我的代碼，這是完全適合我的工作和fb messenger一樣工作:) – jatin 2015-09-24 12:56:28

實現Facebook信使樣式泛到全屏視圖類似的效果

回答

相關問題