平常開發中對於啟動頁可能會有一些特別的要求,比如在啟動頁加動畫或加一些按鍵可以響應事件等,最近項目中要在啟動頁增加版本號,因為版本號是不斷的改變,所以要動態實現把它加到啟動頁上;在XCode上面配置的Launch Images Source或Launch Screen FIle(IOS8以上會優先調
平常開發中對於啟動頁可能會有一些特別的要求,比如在啟動頁加動畫或加一些按鍵可以響應事件等,最近項目中要在啟動頁增加版本號,因為版本號是不斷的改變,所以要動態實現把它加到啟動頁上;在XCode上面配置的Launch Images Source或Launch Screen FIle(IOS8以上會優先調用這個作為啟動項)都是保存一張靜態圖片;
原理:
其實原理也是很簡單,啟動頁還是運用Launch Images Source的內容,然後在做一個視圖在最上層,視圖的背景用啟動項的那張圖,讓人誤以為還在啟動中,啟動頁載入完成後,就顯示這層視圖,在2秒後再把這層視圖刪除,產生一個過度的假啟動頁效果;而我們自定義的動作就可以在這層視圖上進行;下麵將通過Coding.net的APP講解這個功能;
一:創建一個視圖EaseStartView
EaseStartView.h文件內容:
#import <UIKit/UIKit.h> @interface EaseStartView : UIView + (instancetype)startView; - (void)startAnimationWithCompletionBlock:(void(^)(EaseStartView *easeStartView))completionHandler; @end
EaseStartView.m文件內容:
#import "EaseStartView.h" #import <NYXImagesKit/NYXImagesKit.h> #import "StartImagesManager.h" @interface EaseStartView () @property (strong, nonatomic) UIImageView *bgImageView, *logoIconView; @property (strong, nonatomic) UILabel *descriptionStrLabel; @end @implementation EaseStartView + (instancetype)startView{ UIImage *logoIcon = [UIImage imageNamed:@"logo_coding_top"]; StartImage *st = [[StartImagesManager shareManager] randomImage]; return [[self alloc] initWithBgImage:st.image logoIcon:logoIcon descriptionStr:st.descriptionStr]; } - (instancetype)initWithBgImage:(UIImage *)bgImage logoIcon:(UIImage *)logoIcon descriptionStr:(NSString *)descriptionStr{ self = [super initWithFrame:kScreen_Bounds]; if (self) { //add custom code UIColor *blackColor = [UIColor blackColor]; self.backgroundColor = blackColor; _bgImageView = [[UIImageView alloc] initWithFrame:kScreen_Bounds]; _bgImageView.contentMode = UIViewContentModeScaleAspectFill; _bgImageView.alpha = 0.0; [self addSubview:_bgImageView]; [self addGradientLayerWithColors:@[(id)[blackColor colorWithAlphaComponent:0.4].CGColor, (id)[blackColor colorWithAlphaComponent:0.0].CGColor] locations:nil startPoint:CGPointMake(0.5, 0.0) endPoint:CGPointMake(0.5, 0.4)]; _logoIconView = [[UIImageView alloc] init]; _logoIconView.contentMode = UIViewContentModeScaleAspectFit; [self addSubview:_logoIconView]; _descriptionStrLabel = [[UILabel alloc] init]; _descriptionStrLabel.font = [UIFont systemFontOfSize:10]; _descriptionStrLabel.textColor = [UIColor colorWithWhite:1.0 alpha:0.5]; _descriptionStrLabel.textAlignment = NSTextAlignmentCenter; _descriptionStrLabel.alpha = 0.0; [self addSubview:_descriptionStrLabel]; [_descriptionStrLabel mas_makeConstraints:^(MASConstraintMaker *make) { make.centerX.equalTo(@[self, _logoIconView]); make.height.mas_equalTo(10); make.bottom.equalTo(self.mas_bottom).offset(-15); make.left.equalTo(self.mas_left).offset(20); make.right.equalTo(self.mas_right).offset(-20); }]; [_logoIconView mas_makeConstraints:^(MASConstraintMaker *make) { make.centerX.equalTo(self); make.top.mas_equalTo(kScreen_Height/7); make.width.mas_equalTo(kScreen_Width *2/3); make.height.mas_equalTo(kScreen_Width/4 *2/3); }]; [self configWithBgImage:bgImage logoIcon:logoIcon descriptionStr:descriptionStr]; } return self; } - (void)configWithBgImage:(UIImage *)bgImage logoIcon:(UIImage *)logoIcon descriptionStr:(NSString *)descriptionStr{ bgImage = [bgImage scaleToSize:[_bgImageView doubleSizeOfFrame] usingMode:NYXResizeModeAspectFill]; self.bgImageView.image = bgImage; self.logoIconView.image = logoIcon; self.descriptionStrLabel.text = descriptionStr; [self updateConstraintsIfNeeded]; } - (void)startAnimationWithCompletionBlock:(void(^)(EaseStartView *easeStartView))completionHandler{ [[UIApplication sharedApplication].keyWindow addSubview:self]; [[UIApplication sharedApplication].keyWindow bringSubviewToFront:self]; _bgImageView.alpha = 0.0; _descriptionStrLabel.alpha = 0.0; @weakify(self); [UIView animateWithDuration:2.0 animations:^{ @strongify(self); self.bgImageView.alpha = 1.0; self.descriptionStrLabel.alpha = 1.0; } completion:^(BOOL finished) { [UIView animateWithDuration:0.6 delay:0.3 options:UIViewAnimationOptionCurveEaseIn animations:^{ @strongify(self); [self setX:-kScreen_Width]; } completion:^(BOOL finished) { @strongify(self); [self removeFromSuperview]; if (completionHandler) { completionHandler(self); } }]; }]; } @end
其實本實例中最為關鍵的內容在方法startAnimationWithCompletionBlock里
[[UIApplication sharedApplication].keyWindow addSubview:self];
[[UIApplication sharedApplication].keyWindow bringSubviewToFront:self];
代碼就是把這個視圖設置成在最前的最上層,這樣就可以蓋住程式中的頁面;
_bgImageView.alpha = 0.0; _descriptionStrLabel.alpha = 0.0;
這個是為了下麵的動畫做準備,若是直接用背景圖可以把這兩個都設置成0.99這樣就不會有一閃的錯覺;
@weakify(self); [UIView animateWithDuration:2.0 animations:^{ @strongify(self); self.bgImageView.alpha = 1.0; self.descriptionStrLabel.alpha = 1.0; } completion:^(BOOL finished) { [UIView animateWithDuration:0.6 delay:0.3 options:UIViewAnimationOptionCurveEaseIn animations:^{ @strongify(self); [self setX:-kScreen_Width]; } completion:^(BOOL finished) { @strongify(self); [self removeFromSuperview]; if (completionHandler) { completionHandler(self); } }]; }];
這邊是動畫效果,時間設置為2秒,因為這邊第一個動畫完還有一個左移出啟動頁的效果;當動畫結束後就可以 [self removeFromSuperview];
二:調用啟動頁視圖
在AppDelegate中的didFinishLaunchingWithOptions進行調用;
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; // Override point for customization after application launch. self.window.backgroundColor = [UIColor whiteColor]; //網路 [[AFNetworkActivityIndicatorManager sharedManager] setEnabled:YES]; [[AFNetworkReachabilityManager sharedManager] startMonitoring]; //設置導航條樣式 [self customizeInterface]; [[UIApplication sharedApplication] setStatusBarHidden:NO withAnimation:UIStatusBarAnimationFade]; if ([Login isLogin]) { [self setupTabViewController]; }else{ [UIApplication sharedApplication].applicationIconBadgeNumber = 0; [self setupIntroductionViewController]; } [self.window makeKeyAndVisible]; [FunctionIntroManager showIntroPage]; EaseStartView *startView = [EaseStartView startView]; @weakify(self); [startView startAnimationWithCompletionBlock:^(EaseStartView *easeStartView) { @strongify(self); //可以做其它事情 }]; return YES; }
註意,EaseStartView代碼的位置是要放在最後面,因為要讓它蓋在最上層,就要後面載入,這樣就可以蓋在登錄頁面上面或者主頁上;到這就已經可以成功啟動頁的效果;
三:下麵實例為項目中用到的動態載入版本號到啟動頁上
#import "StartUpView.h" @interface StartUpView() @property (strong, nonatomic) UIImageView *bgImageView; @property (strong, nonatomic) UILabel *descriptionStrLabel; @end @implementation StartUpView + (instancetype)startView { UIImage *bgImage=kshamLaunchImage; return [[self alloc] initWithBgImage:bgImage]; } - (instancetype)initWithBgImage:(UIImage *)bgImage { self = [super initWithFrame:Main_Screen_Bounds]; if (self) { _bgImageView = [[UIImageView alloc] initWithFrame:Main_Screen_Bounds]; _bgImageView.contentMode = UIViewContentModeScaleAspectFill; _bgImageView.alpha = 0; _bgImageView.image=bgImage; [self addSubview:_bgImageView]; _descriptionStrLabel = [[UILabel alloc] init]; _descriptionStrLabel.font = [UIFont systemFontOfSize:15]; _descriptionStrLabel.textColor = [UIColor blackColor]; _descriptionStrLabel.textAlignment = NSTextAlignmentCenter; _descriptionStrLabel.alpha = 0; _descriptionStrLabel.text=[NSString stringWithFormat:@"版本號為:%@",appVersion]; [self addSubview:_descriptionStrLabel]; [_descriptionStrLabel mas_makeConstraints:^(MASConstraintMaker *make) { make.height.mas_equalTo(50); make.bottom.equalTo(self.mas_bottom).offset(-15); make.left.equalTo(self.mas_left).offset(20); make.right.equalTo(self.mas_right).offset(-20); }]; } return self; } - (void)startAnimationWithCompletionBlock:(void(^)(StartUpView *easeStartView))completionHandler{ [[UIApplication sharedApplication].keyWindow addSubview:self]; [[UIApplication sharedApplication].keyWindow bringSubviewToFront:self]; _bgImageView.alpha = 0.99; _descriptionStrLabel.alpha = 0.99; @weakify(self); [UIView animateWithDuration:2.0 animations:^{ @strongify(self); self.bgImageView.alpha = 1.0; self.descriptionStrLabel.alpha = 1.0; } completion:^(BOOL finished) { [self removeFromSuperview]; if (completionHandler) { completionHandler(self); } }]; } @end