Webview 的滑动过渡动画

Question

我在从右向左滑动手势后为网络视图加载新内容。执行手势后，webview 加载其新内容。我如何为这个 webview 制作一个动画，根据手势显示 "swiping-away" 的 webview 内容？因此，当用户从右向左滑动时，webview 也应该从右向左移动。最终 "fly away"。我认为某些音乐应用程序具有此功能，您可以在其中通过滑动一首曲目来加载新曲目。谢谢！

Answer 1

滑动手势和加载新内容，您可以使用：

UISwipeGestureRecognizer *swipeGR;
    swipeGR = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(handleSwipeLeft)];
    swipeGR.direction = UISwipeGestureRecognizerDirectionLeft;
    swipeGR.delegate = self;
    swipeGR.numberOfTouchesRequired = 1;
    [webview addGestureRecognizer:swipeGR];

Answer 2

您将需要使用两个 UIWebView，一个正在飞走，另一个用于新内容。为了让它飞走，你可以使用许多库中的一个，比如 ZLSwipeableView。

同时，我会在第一个位置创建一个新的 UIWebView。您可能应该首先使其不可见，然后根据第一个视图的移动使其可见，以便它逐渐出现。

Answer 3

您可以通过以下代码应用单个 UIWebView 滑动动画。

- (void)viewDidLoad
{
    [super viewDidLoad];

    UISwipeGestureRecognizer *recognizerRight;
    recognizerRight.delegate=self;

    recognizerRight = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipeRight:)];
    [recognizerRight setDirection:UISwipeGestureRecognizerDirectionRight];
    [webView addGestureRecognizer:recognizerRight];


    UISwipeGestureRecognizer *recognizerLeft;
recognizerLeft.delegate=self;
    recognizerLeft = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipeleft:)];
    [recognizerLeft setDirection:UISwipeGestureRecognizerDirectionLeft];
    [webView addGestureRecognizer:recognizerLeft];


}

现在在 CATransition 的帮助下应用了滑动效果。

-(void)swipeleft:(UISwipeGestureRecognizer *)swipeGesture
{


        CATransition *animation = [CATransition animation];
        [animation setDelegate:self];
        [animation setType:kCATransitionPush];
        [animation setSubtype:kCATransitionFromRight];
        [animation setDuration:0.50];
        [animation setTimingFunction:
         [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
        [webView.layer addAnimation:animation forKey:kCATransition];



}
-(void)swipeRight:(UISwipeGestureRecognizer *)swipeGesture
{

        CATransition *animation = [CATransition animation];
        [animation setDelegate:self];
        [animation setType:kCATransitionPush];
        [animation setSubtype:kCATransitionFromLeft];
        [animation setDuration:0.40];
        [animation setTimingFunction:
         [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
        [webView.layer addAnimation:animation forKey:kCATransition];


}

希望对您有所帮助。

Webview 的滑动过渡动画

Swipe Transition Animation for Webview

objective-c

webview

ios