5

最近、ますます多くのアプリがビュー間の新しいタイプのトランジションを使用しています。それを定義するのは難しいですが、トランジションはプレビュービューがフェードアウトし、下に移動し（下向きに変換）、少し縮小しているように見えます-すべて同時に。それは本当に微妙でエレガントです。

Facebookアプリでスローモーションでこの遷移を観察できます-壁に誰かの写真を見つけ、それをタップして表示し、フルスクリーン画像をゆっくりと下にドラッグすると、壁が後ろから上昇していることがわかります-少しフェードとスケーリング。それが移行です。遷移には、ステータスバーのフェードも含まれます。

遷移状態

この遷移は、左側のペインから設定を開いたときにGmail2.0にも表示されます。

ますます多くのアプリがこれを実装しているので、これには特定のフレームワークまたは準備された方法があると思います。しかし、トランジションの軌道にいくつかのアプリでいくつかの小さな違いが見られるので、私も間違っているかもしれません-たとえば。Gmailは少しカルーセル効果を使用しますが、Facebookはちょうど真ん中に縮小します。

とにかくそれは新しいトレンドのようです。

そのような移行を実装するためのリファレンス、フレームワーク、またはノウハウを探しています。

便利なものをありがとう。

4

3 に答える 3

7

このリンクを試してください。これはあなたがまさに探しているものだと思いますhttps://github.com/kentnguyen/KNSemiModalViewController

于 2012-12-07T11:45:52.187 に答える
3

私は最初にそれがナショナルジオグラフィックアプリで使用されているのを見ました...これらの2つの方法を試してみてください。これまではうまく機能していました。ニーズに合わせていくつか調整するだけです。

- (void)dropItBack:(id)sender
{
    // Position
    CABasicAnimation *posAnimation = [CABasicAnimation animationWithKeyPath:@"position"];
    posAnimation.toValue = [NSValue valueWithCGPoint:CGPointMake(160, 284)];//center point

    // Opacity
    CABasicAnimation *opacityAnimation = [CABasicAnimation animationWithKeyPath:@"opacity"];
    opacityAnimation.toValue = [NSNumber numberWithFloat:0.5f];

    CABasicAnimation *scaleAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
    scaleAnimation.toValue = [NSNumber numberWithDouble:0.8];

    // Dramaticism of the Z rotation
    // A lower number is more dramatic
    float distance = 1000;
    CATransform3D trans = CATransform3DIdentity;
    trans.m34 = 1.f / -distance;

    // Rotate Back
    CABasicAnimation *rockBack = [CABasicAnimation animationWithKeyPath:@"transform"];
    rockBack.toValue = [NSValue valueWithCATransform3D:CATransform3DRotate(trans, M_PI_4, 1.f, 0.f, 0.f)];
    rockBack.beginTime = 0.f;

    // Rotate forward
    trans.m34 = 0.f;
    CABasicAnimation *rockForward = [CABasicAnimation animationWithKeyPath:@"transform"];
    rockForward.toValue = [NSValue valueWithCATransform3D:CATransform3DRotate(trans, M_PI_4, -1.f, 0.f, 0.f)];
    rockForward.beginTime = 0.25f;

    CAAnimationGroup *animationGroup = [CAAnimationGroup animation];
    animationGroup.duration = 0.5f;
    animationGroup.repeatCount = 0.f;
    animationGroup.removedOnCompletion = NO;
    animationGroup.autoreverses = NO;
    animationGroup.fillMode = kCAFillModeForwards;
    animationGroup.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    [animationGroup setAnimations:[NSArray arrayWithObjects:rockBack, rockForward, scaleAnimation, posAnimation, opacityAnimation, nil]];

    [self.navigationController.view.layer addAnimation:animationGroup forKey:nil];

    popsheet = [UIButton buttonWithType:UIButtonTypeCustom];
    [popsheet setBackgroundColor:[UIColor blueColor]];
    [popsheet setFrame:CGRectMake(0, 580, 320, 400)];
    [popsheet addTarget:self action:@selector(bringItForward:) forControlEvents:UIControlEventTouchUpInside];
    [self.tabBarController.view addSubview:popsheet];

    [UIView animateWithDuration:0.3 animations:^{
        [popsheet setFrame: CGRectMake(0, 180, 320, 400)];
    }];
}

- (void)bringItForward:(id)sender
{
    // Position
    CABasicAnimation *posAnimation = [CABasicAnimation animationWithKeyPath:@"position"];
    posAnimation.toValue = [NSValue valueWithCGPoint:CGPointMake(160, 284)];

    // Opacity
    CABasicAnimation *opacityAnimation = [CABasicAnimation animationWithKeyPath:@"opacity"];
    opacityAnimation.toValue = [NSNumber numberWithFloat:1.f];

    // Scale
    CABasicAnimation *scaleAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
    scaleAnimation.toValue = [NSNumber numberWithDouble:1.f];

    // Dramaticism of the Z rotation
    // A lower number is more dramatic
    float distance = 1000;
    CATransform3D trans = CATransform3DIdentity;
    trans.m34 = 1.f / distance;

    // Rotate back
    CABasicAnimation *rockBack = [CABasicAnimation animationWithKeyPath:@"transform"];
    rockBack.toValue = [NSValue valueWithCATransform3D:CATransform3DRotate(trans, M_PI_4, 1.f, 0.f, 0.f)];
    rockBack.beginTime = 0.f;

    // Rotate forward
    trans.m34 = 0.f;
    CABasicAnimation *rockForward = [CABasicAnimation animationWithKeyPath:@"transform"];
    rockForward.toValue = [NSValue valueWithCATransform3D:CATransform3DRotate(trans, M_PI_4, -1.f, 0.f, 0.f)];
    rockForward.beginTime = 0.25f;

    CAAnimationGroup *animationGroup = [CAAnimationGroup animation];
    animationGroup.duration = 0.5f;
    animationGroup.repeatCount = 0.f;
    animationGroup.removedOnCompletion = NO;
    animationGroup.autoreverses = NO;
    animationGroup.fillMode = kCAFillModeForwards;
    animationGroup.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    [animationGroup setAnimations:[NSArray arrayWithObjects:posAnimation, rockBack, rockForward, opacityAnimation, nil]];

    [self.navigationController.view.layer addAnimation:animationGroup forKey:nil];
    [UIView animateWithDuration:0.3 animations:^{
        [popsheet setFrame: CGRectMake(0, 580, 320, 400)];
    }];

}
于 2012-12-07T07:19:26.747 に答える
0

このライブラリを試してみるべきだと思います。

https://github.com/michaelhenry/MHFacebookImageViewer

于 2013-07-09T04:42:28.070 に答える