Ios-ui-elements-view-transition

iOS-ビュー遷移

ビュー遷移の使用

ビュートランジションは、適切なトランジションアニメーション効果を使用して、あるビューを別のビューに追加する効果的な方法です。

次のようにViewController.xibを更新します-

iOSチュートリアル

xibで作成されたボタンのアクションを作成します。

ViewController.hを更新する

ViewControllerクラスで2つのビューインスタンスを宣言します。 アクションを作成した後、 ViewController.h ファイルは次のようになります-

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController {
   UIView *view1;
   UIView *view2;
}

-(IBAction)flipFromLeft:(id)sender;
-(IBAction)flipFromRight:(id)sender;
-(IBAction)flipFromTop:(id)sender;
-(IBAction)flipFromBottom:(id)sender;
-(IBAction)curlUp:(id)sender;
-(IBAction)curlDown:(id)sender;
-(IBAction)dissolve:(id)sender;
-(IBAction)noTransition:(id)sender;

@end

Copy

ViewController.mを更新する

ビューを初期化するカスタムメソッド setUpView を追加します。 また、 view1 から view2 またはその逆への遷移を作成する別のメソッド* doTransitionWithType：を作成します。 次に、前に作成したアクションメソッドを実装し、遷移タイプを指定してdoTransitionWithType：メソッドを呼び出します。 更新された *ViewController.m は次のとおりです-

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
   [super viewDidLoad];
   [self setUpView];
  //Do any additional setup after loading the view, typically from a nib.
}

-(void)setUpView {
   view1 = [[UIView alloc]initWithFrame:self.view.frame];
   view1.backgroundColor = [UIColor lightTextColor];
   view2 = [[UIView alloc]initWithFrame:self.view.frame];
   view2.backgroundColor = [UIColor orangeColor];
   [self.view addSubview:view1];
   [self.view sendSubviewToBack:view1];
}

-(void)doTransitionWithType:(UIViewAnimationTransition)animationTransitionType {
   if ([[self.view subviews] containsObject:view2 ]) {
      [UIView transitionFromView:view2
      toView:view1
      duration:2
      options:animationTransitionType
      completion:^(BOOL finished) {
         [view2 removeFromSuperview];
      }];
      [self.view addSubview:view1];
      [self.view sendSubviewToBack:view1];
   } else {
      [UIView transitionFromView:view1
      toView:view2
      duration:2
      options:animationTransitionType
      completion:^(BOOL finished) {
         [view1 removeFromSuperview];
      }];
      [self.view addSubview:view2];
      [self.view sendSubviewToBack:view2];
   }
}

-(IBAction)flipFromLeft:(id)sender {
   [self doTransitionWithType:UIViewAnimationOptionTransitionFlipFromLeft];
}

-(IBAction)flipFromRight:(id)sender {
   [self doTransitionWithType:UIViewAnimationOptionTransitionFlipFromRight];
}

-(IBAction)flipFromTop:(id)sender {
   [self doTransitionWithType:UIViewAnimationOptionTransitionFlipFromTop];
}

-(IBAction)flipFromBottom:(id)sender {
   [self doTransitionWithType:UIViewAnimationOptionTransitionFlipFromBottom];
}

-(IBAction)curlUp:(id)sender {
   [self doTransitionWithType:UIViewAnimationOptionTransitionCurlUp];
}

-(IBAction)curlDown:(id)sender {
   [self doTransitionWithType:UIViewAnimationOptionTransitionCurlDown];
}

-(IBAction)dissolve:(id)sender {
   [self doTransitionWithType:UIViewAnimationOptionTransitionCrossDissolve];
}

-(IBAction)noTransition:(id)sender{
   [self doTransitionWithType:UIViewAnimationOptionTransitionNone];
}

- (void)didReceiveMemoryWarning {
   [super didReceiveMemoryWarning];
  //Dispose of any resources that can be recreated.
}
@end

Copy

出力

アプリケーションを実行すると、次の出力が得られます-

iOSチュートリアル

さまざまなボタンを選択して、トランジションの動作を確認できます。 カールアップを選択すると、遷移は次のようになります-

iOSチュートリアル