1. 程式人生 > >新浪微博啟動時"歡迎回來"動畫

新浪微博啟動時"歡迎回來"動畫

1.自定義view,XIB做好佈局


設定iconView和textView預設隱藏

//
//  WelcomeView.h


#import <UIKit/UIKit.h>

@interface WelcomeView : UIView

/**
 *  返回一個WelcomeView例項的類方法
 */
+ (instancetype)welcomeView;

@end
//
//  WelcomeView.m


#import "WelcomeView.h"

@interface WelcomeView()

@property (weak, nonatomic) IBOutlet UIImageView *sloganView;

@property (weak, nonatomic) IBOutlet UIImageView *iconView;

@property (weak, nonatomic) IBOutlet UILabel *textView;
@end

@implementation WelcomeView

+ (instancetype)welcomeView
{
    return [[[NSBundle mainBundle] loadNibNamed:@"WelcomeView" owner:nil options:nil] lastObject];
}

/**
 *  檢視即將新增到父控制元件上會呼叫這個方法
 */
- (void)didMoveToSuperview
{
    [super didMoveToSuperview];
    
    // 頭像檢視裁剪為圓形
    _iconView.layer.cornerRadius = 50;
    _iconView.layer.masksToBounds = YES;
    
    // 把頭像transform往下移動50
    _iconView.transform = CGAffineTransformMakeTranslation(0, 50);
    
    [UIView animateWithDuration:0.75 animations:^{
        // slogan慢慢消失
        _sloganView.alpha = 0;
    } completion:^(BOOL finished) {
        // 然後頭像顯示,慢慢往上移動
        _iconView.hidden = NO;
        [UIView animateWithDuration:0.75 delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
            // 頭像transform還原
            _iconView.transform = CGAffineTransformIdentity;
        } completion:^(BOOL finished) {
            // 歡迎回來,慢慢顯示
            _textView.alpha = 0;
            _textView.hidden = NO;
            [UIView animateWithDuration:0.75 animations:^{
                _textView.alpha = 1;
            } completion:^(BOOL finished) {
                //完成所有動畫後,移除整個介面
                [self removeFromSuperview];
            }];
        }];
    }];
}

@end
2.view完成,下面是如何使用?

因為只有程式在第一次啟動時顯示,所以我們採取在AppDelegate中把檢視加到視窗上:

// 顯示歡迎介面
    WelcomeView *welcome = [WelcomeView welcomeView];
    welcome.frame = self.window.bounds;
    // 加到視窗上
    [self.window addSubview:welcome];
因為通過storyboard啟動,根控制器的view並不會在程式啟動完成的時候新增到視窗,所以我們需要手動的建立視窗,需要做下面是設定






然後:

//
//  AppDelegate.m


#import "AppDelegate.h"
#import "WelcomeView.h"

@interface AppDelegate ()

@end

@implementation AppDelegate

// 通過storyboard啟動,根控制器的view並不會在程式啟動完成的時候新增到視窗
//
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    
    // 1.建立視窗
    self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
    
    // 2.載入storyboard 建立視窗的根控制器
    UIStoryboard *sb = [UIStoryboard storyboardWithName:@"Main" bundle:nil];
    UIViewController *vc = [sb instantiateInitialViewController];
    self.window.rootViewController = vc;
    
    // 3.顯示視窗
    [self.window makeKeyAndVisible];
    
    // 顯示歡迎介面
    WelcomeView *welcome = [WelcomeView welcomeView];
    welcome.frame = self.window.bounds;
    // 加到視窗上
    [self.window addSubview:welcome];
    
    
    return YES;
}


- (void)applicationDidBecomeActive:(UIApplication *)application
{
    // 通過storyboard啟動,根控制器的View是在這個方法中新增到視窗
}

@end
至此,就完成了。

3.其他技巧

把檢視裁剪為圓形可以利用執行時機制: