h5頁面自帶導(dǎo)航欄情況下卵洗，在h5頁面還沒有加載出來之前，頁面是空白的十绑，這樣很尷尬酷勺，用戶體驗非常差，如果加載非常慢或者加載失敗的情況下甚亭，會一直處于空白頁中击胜，無法返回。
解決方案有：1.利用原生導(dǎo)航偶摔，2.h5添加預(yù)加載頁面和錯誤頁面辰斋，3自定義當(dāng)航欄
經(jīng)過嘗試，我發(fā)現(xiàn)1宫仗，2兩種方案都有一定的弊端锰什，所以我選擇了第三種方案自定義預(yù)加載當(dāng)航欄丁逝。
首先自定義一個BaseWebController
.h
#import "BaseViewController.h"
NS_ASSUME_NONNULL_BEGIN
@interfaceBaseWebController :BaseViewController
//添加預(yù)加載導(dǎo)航欄
-(void)addPreloadPageNav;
//顯示預(yù)加載導(dǎo)航欄
-(void)showPreloadPageNav;
//隱藏預(yù)加載導(dǎo)航欄
-(void)hidePreloadPageNav;
//移除預(yù)加載導(dǎo)航欄
-(void)removePreloadPageNav;
//預(yù)加載導(dǎo)航欄標題
-(void)preloadPageNavTitle:(NSString*)title;
//移除進度條
-(void)removeProgressView;
@end
NS_ASSUME_NONNULL_END
.m文件
@interface BaseWebController ()
//導(dǎo)航
@property (nonatomic,strong) UIView *preloadPageNav;
//標題
@property(nonatomic,strong)UILabel*preloadPageNavTitle;
//進度條
@property (nonatomic, strong) UIProgressView *progressView;
@property (nonatomic, strong) NSTimer *timer;
@end
@implementationBaseWebController
-(void)viewWillAppear:(BOOL)animated{
? ? [self.navigationController setNavigationBarHidden:YES animated:NO];
? ? [superviewWillAppear:animated];
}
- (void)viewWillDisappear:(BOOL)animated {
? ? [super viewWillDisappear:animated];
? ? [self.navigationController setNavigationBarHidden:NO animated:NO];
}
- (void)viewDidLoad {
? ? [super viewDidLoad];
}
//添加預(yù)加載導(dǎo)航欄
-(void)addPreloadPageNav{
? ? self.preloadPageNav=[UIView new];
? ? [self.view addSubview:self.preloadPageNav];
? ? [self.preloadPageNav mas_makeConstraints:^(MASConstraintMaker *make) {
? ? ? ? make.top.mas_equalTo(self.view);
? ? ? ? make.size.mas_equalTo(CGSizeMake(kScreenWidth, 64));
? ? }];
? ? self.preloadPageNav.backgroundColor=[UIColor colorWithHexString:@"#ec403c"];
? ? UIButton*navBackBtn=[UIButtonnew];
? ? [self.preloadPageNavaddSubview:navBackBtn];
? ? [navBackBtnmas_makeConstraints:^(MASConstraintMaker*make) {
? ? ? ? make.centerY.mas_equalTo(self.preloadPageNav).offset(10);
? ? ? ? make.left.mas_equalTo(self.preloadPageNav).mas_offset(20);
? ? }];
? ? [navBackBtnsetImage:[UIImage imageNamed:@"ic_back"] forState:UIControlStateNormal];
? ? [navBackBtnaddTarget:self action:@selector(navBackBtnClick) forControlEvents:UIControlEventTouchUpInside];
? ? navBackBtn.imageEdgeInsets=UIEdgeInsetsMake(0, -15,0,0);
? ? navBackBtn.titleEdgeInsets=UIEdgeInsetsMake(0, -5,0,0);
? ? [navBackBtnsetTitle:@"返回" forState:UIControlStateNormal];
? ? navBackBtn.titleLabel.font= [UIFontsystemFontOfSize:16];
? ? [navBackBtnsetTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
? ? self.preloadPageNavTitle=[UILabel new];
? ? [self.preloadPageNav addSubview:self.preloadPageNavTitle];
? ? [self.preloadPageNavTitle mas_makeConstraints:^(MASConstraintMaker *make) {
? ? ? ? make.centerY.mas_equalTo(self.preloadPageNav).offset(10);
? ? ? ? make.centerX.mas_equalTo(self.preloadPageNav);
? ? }];
? ? self.preloadPageNavTitle.textColor=[UIColor whiteColor];
? ? self.preloadPageNavTitle.font=[UIFont systemFontOfSize:17];
? ? self.progressView = [UIProgressView new];
? ? [self.preloadPageNav addSubview:self.progressView];
? ? [self.progressView mas_makeConstraints:^(MASConstraintMaker *make) {
? ? ? ? make.top.equalTo(self.preloadPageNav.mas_bottom);
? ? ? ? make.size.mas_equalTo(CGSizeMake(kScreenWidth, 2));
? ? }];
? ? self.progressView.progressTintColor=[UIColor blueColor];
? ? self.progressView.trackTintColor=[UIColor clearColor];
?? ? self.timer = [NSTimer scheduledTimerWithTimeInterval:1.0 target:self selector:@selector(progress) userInfo:nil repeats:true];
}
- (void)progress{
? ? if (self.progressView.progress<0.5) {
? ? ? ? self.progressView.progress+=0.2;
? ? }else{
? ? ? ? self.progressView.progress+=0.3;
? ? }
? ? if(self.progressView.progress==1) {
? ? ? ? [self.timerinvalidate];
? ? ? ? [self.progressView removeFromSuperview];
? ? ? ? NSLog(@"accomplish");
? ? }
}
-(void)removeProgressView{
?? ? [self.progressView removeFromSuperview];
}
//顯示預(yù)加載導(dǎo)航欄
-(void)showPreloadPageNav{
? ? if (self.preloadPageNav) {
? ? ? ? self.preloadPageNav.hidden=NO;
? ? }else{
? ? ? ? [self addPreloadPageNav];
? ? }
}
//隱藏預(yù)加載導(dǎo)航欄
-(void)hidePreloadPageNav{
? ? if (self.preloadPageNav) {
? ? ? ? self.preloadPageNav.hidden=YES;
? ? }
}
//移除預(yù)加載導(dǎo)航欄
-(void)removePreloadPageNav{
? ? if (self.preloadPageNav) {
? ? ? ? [self.preloadPageNav removeFromSuperview];
? ? }
}
//預(yù)加載導(dǎo)航欄標題
-(void)preloadPageNavTitle:(NSString*)title{
? ? self.preloadPageNavTitle.text=title;
}
//返回按鈕點擊事件
-(void)navBackBtnClick{
? ? [self.navigationController popViewControllerAnimated:YES];
}
@end
然后創(chuàng)建一個ViewController繼承于上面的BaseWebController
- (void)viewDidLoad {
定義并創(chuàng)建webView；
?[self addPreloadPageNav];//添加預(yù)加載導(dǎo)航欄
? [self preloadPageNavTitle:@"標題"];//添加標題
}
- (void)webViewDidFinishLoad:(UIWebView*)webView{
? ? [self hidePreloadPageNav];//h5頁面加載完成方法里隱藏自定義導(dǎo)航
? ? NSLog(@"地址：%@\n",[webView.request.URL absoluteString]);
}
#pragma mark -webview加載失敗的回調(diào)
- (void)webView:(UIWebView*)webView didFailLoadWithError:(NSError*)error
{
? ? [self showPreloadPageNav];//h5頁面加載失敗方法里展示自定義導(dǎo)航
}
