8

MLB At Bat アプリのこのビデオを見てください。modalViewController基本的に、UIModalPresentationFormSheetスタイルを提示して、別のビューから成長させて反転させたいだけです。MLB アプリのスコアボードでゲームをタップするときのように。どうすればこれを達成できるか知っている人はいますか？

ありがとう

編集: 私のメイン ビューは、MLB アプリとほぼ同じ設定です。私は使用してAQGridViewおり、グリッド ビューのセルがタップされたときにアニメーションを発生させたいと考えています。

EDIT 2:私はまた、UIViewController概念を捨ててプレーンを使用することにもオープンであり、それが簡単な場合UIViewは手動でスタイルを複製します。UIModalPresentationFormSheet

編集 3: わかりました、これを行うために a を使用することを忘れてくださいUIViewController。応答が得られていないため、不可能であると想定します。私の新しい質問は、投稿されたビデオのアニメーションを単に を使用して複製するにはどうすればよいUIViewですか? 基本的に、初期ビューはすべて同時に拡大、移動、反転する必要があります。

編集 4: 私は実際のアニメーションを理解したと思います。現在、私の唯一の問題は、フィードする座標を計算することCATransform3DTranslateです。私のビューは、ビデオとほぼ同じようにアニメーション化する必要があります。別のビューから開始し、画面の中央にアニメーション化する必要があります。中央にポップアップするビューの座標を計算しようとしている方法は次のとおりです。

CGPoint detailInitialPoint = [gridView convertPoint:view.frame.origin toView:detailView.frame.origin];
CGPoint detailFinalPoint = detailView.frame.origin;

gridView小さなグリッド項目を保持するメイン ビューのコンテナー ビューです。viewアニメーションの元となる特定のグリッド アイテムです。そしてdetailView、画面中央に出てくる景色です。

4

5 に答える 5

6

UIViewControler のカテゴリを使用して、独自の遷移を実装できます。

UIViewController+ShowModalFromView.h

#import <Foundation/Foundation.h>
#import <QuartzCore/QuartzCore.h>

@interface UIViewController (ShowModalFromView)
- (void)presentModalViewController:(UIViewController *)modalViewController fromView:(UIView *)view;
@end

UIViewController+ShowModalFromView.m

#import "UIViewController+ShowModalFromView.h"

@implementation UIViewController (ShowModalFromView)

- (void)presentModalViewController:(UIViewController *)modalViewController fromView:(UIView *)view {
    modalViewController.modalPresentationStyle = UIModalPresentationFormSheet;

// Add the modal viewController but don't animate it. We will handle the animation manually
[self presentModalViewController:modalViewController animated:NO];

// Remove the shadow. It causes weird artifacts while animating the view.
CGColorRef originalShadowColor = modalViewController.view.superview.layer.shadowColor;
modalViewController.view.superview.layer.shadowColor = [[UIColor clearColor] CGColor];

// Save the original size of the viewController's view    
CGRect originalFrame = modalViewController.view.superview.frame;

// Set the frame to the one of the view we want to animate from
modalViewController.view.superview.frame = view.frame;

// Begin animation
[UIView animateWithDuration:1.0f
                 animations:^{
                     // Set the original frame back
                     modalViewController.view.superview.frame = originalFrame;
                 }
                 completion:^(BOOL finished) {
                     // Set the original shadow color back after the animation has finished
                     modalViewController.view.superview.layer.shadowColor = originalShadowColor;
                 }];
}

@end

これは、必要なアニメーション化されたトランジションを使用するように簡単に変更できます。あなたの場合は、CA3DTransform を使用することをお勧めします。お役に立てれば！

于 2012-04-06T03:15:34.653 に答える
1

アニメーションを反転、拡大、および変換するには、次のコードを使用できます。

- (void)animate {
    int newX, newY; //New position
    int newW, newH; //New size
    [UIView animateWithDuration:someDuration delay:someDelay animations:^{
        yourView.transform = CATransform3DMakeRotation(M_PI_2,1.0,0.0,0.0); //flip halfway
        yourView.frame = CGRectMake(newX/2, newY/2, newW/2, newH/2);
    } completion:^{
        while ([yourView.subviews count] > 0)
            [[yourView.subviews lastObject] removeFromSuperview]; // remove all subviews
        // Add your new views here 
        [UIView animateWithDuration:someDuration delay:someDelay animations:^{
            yourView.transform = CATransform3DMakeRotation(M_PI,1.0,0.0,0.0); //finish the flip
            yourView.frame = CGRectMake(newX, newY, newW, newH);
        } completion:^{
            // Flip completion code here
        }];
    }];
}

お役に立てれば！

于 2012-04-15T20:28:56.017 に答える
1

わかりました。これが私がしたことです：

CGFloat duration = 0.8;

/*
//Detail View Animations 
*/

CATransform3D initialDetailScale = CATransform3DMakeScale(view.frame.size.width/vc.view.frame.size.width, view.frame.size.height/vc.view.frame.size.height, 1.0);
CATransform3D initialDetailTransform = CATransform3DRotate(initialDetailScale, -M_PI, 0.0, -1.0, 0.0);
CATransform3D finalDetailScale = CATransform3DMakeScale(1.0, 1.0, 1.0);
CATransform3D finalDetailTransform = CATransform3DRotate(finalDetailScale, 0.0, 0.0, -1.0, 0.0);

NSMutableArray *detailAnimations = [NSMutableArray array];

CABasicAnimation *detailTransform = [CABasicAnimation animationWithKeyPath:@"transform"];
detailTransform.fromValue = [NSValue valueWithCATransform3D:initialDetailTransform];
detailTransform.toValue = [NSValue valueWithCATransform3D:finalDetailTransform];
detailTransform.duration = duration;
[detailAnimations addObject:detailTransform];

CABasicAnimation *detailFadeIn = [CABasicAnimation animationWithKeyPath:@"opacity"];
detailFadeIn.fromValue = [NSNumber numberWithFloat:1.0];
detailFadeIn.toValue = [NSNumber numberWithFloat:1.0];
detailFadeIn.duration = duration/2;
detailFadeIn.beginTime = duration/2;
[detailAnimations addObject:detailFadeIn];

CABasicAnimation *detailMove = [CABasicAnimation animationWithKeyPath:@"position"];
detailMove.fromValue = [NSValue valueWithCGPoint:vc.view.layer.position];
detailMove.toValue = [NSValue valueWithCGPoint:self.view.layer.position];
detailMove.duration = duration;
[detailAnimations addObject:detailMove];

CAAnimationGroup *detailGroup = [CAAnimationGroup animation];
[detailGroup setAnimations:detailAnimations];
[detailGroup setDuration:duration];
detailGroup.removedOnCompletion = NO;
detailGroup.fillMode = kCAFillModeForwards;
detailGroup.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
[vc.view.layer addAnimation:detailGroup forKey:@"anim"];

/*
//Grid Item View Animations
*/

CATransform3D initialGridScale = CATransform3DMakeScale(1.0, 1.0, 1.0);
CATransform3D initialGridTransform = CATransform3DRotate(initialGridScale, 0.0, 0.0, 1.0, 0.0);
CATransform3D finalGridScale = CATransform3DMakeScale(vc.view.frame.size.width/view.frame.size.width, vc.view.frame.size.height/view.frame.size.height, 1.0);
CATransform3D finalGridTransform = CATransform3DRotate(finalGridScale, M_PI, 0.0, 1.0, 0.0);

NSMutableArray *gridAnimations = [NSMutableArray array];

CABasicAnimation *gridTransform = [CABasicAnimation animationWithKeyPath:@"transform"];
gridTransform.fromValue = [NSValue valueWithCATransform3D:initialGridTransform];
gridTransform.toValue = [NSValue valueWithCATransform3D:finalGridTransform];
gridTransform.duration = duration;
[gridAnimations addObject:gridTransform];

CABasicAnimation *gridFadeOut = [CABasicAnimation animationWithKeyPath:@"opacity"];
gridFadeOut.fromValue = [NSNumber numberWithFloat:0.0];
gridFadeOut.toValue = [NSNumber numberWithFloat:0.0];
gridFadeOut.duration = duration/2;
gridFadeOut.beginTime = duration/2;
[gridAnimations addObject:gridFadeOut];

CABasicAnimation *gridMove = [CABasicAnimation animationWithKeyPath:@"position"];
gridMove.fromValue = [NSValue valueWithCGPoint:view.layer.position];
gridMove.toValue = [NSValue valueWithCGPoint:[self.view.layer convertPoint:self.view.layer.position toLayer:gridView.layer]];
gridMove.duration = duration;
[gridAnimations addObject:gridMove];

CAAnimationGroup *gridGroup = [CAAnimationGroup animation];
[gridGroup setAnimations:gridAnimations];
gridGroup.duration = duration;
gridGroup.fillMode = kCAFillModeForwards;
gridGroup.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
gridGroup.removedOnCompletion = NO;
[view.layer addAnimation:gridGroup forKey:@"anim"];

のアイテムでこれを行っていますAQGridView。私のコードサンプルでは、​​私がアニメーション化してviewいるインスタンスです。AQGridViewCellそしてvc.view、私の詳細ですUIViewController/UIView私が表示しているものです。

于 2012-04-16T20:51:29.173 に答える
0

この投稿をご覧になることを強くお勧めします。

このアニメーションすべてを実際に自分で処理する必要はありません。

UIViewクラス メソッドtransitionFromView:toView:duration:options:completion:を使用し、 UIViewAnimationOptionTransitionFlipFromLeftorを渡す場合UIViewAnimationOptionTransitionFlipFromRight-- アニメーションを反転させたい方法。

このメソッドを使用して、MLB アプリに示されているものと同じものを実装しました。あなたfrom viewはグリッド内のセルになり、セルto viewの「背面」にあるものになります。

これにより、必要なコード全体が削減されることを願っています。

于 2012-07-02T17:53:47.167 に答える