一、需求说明
在iOS开发中，不免有原生与H5的交互，比如说：从原生页面的一个按钮，点击之后跳转到了一个H5的页面A，A页面中又有一个按钮，点击之后，又加载了一个新的H5页面B，从B点击一个按钮，又加载一个新的H5页面C，如果此时我们点击左上角的返回按钮，会直接返回到我们的原生页面。这样的话，用户的体验很不好，我们需要对WebView进行添加按钮事件的处理。此时，想要重新定制返回按钮，想要从C页面判断是否还有上一级H5页面可供返回，如果有上一级页面还是H5，点击左上角的返回则返回到B页面，并且在B页面的左上角加上一个关闭按钮，这个关闭按钮的作用主要是为了关闭所有的H5的页面，直接返回到原生的页面；如果不点击关闭按钮，还是点击返回，则从B页面返回到A页面；再次点击返回，则关闭了H5的页面，回到了原生的页面。二、实现
首先是初始化一个WebView：@property (nonatomic,strong,readwrite) UIWebView *announceWebView;- (UIWebView *)announceWebView {if (!_announceWebView) {_announceWebView = [[UIWebView alloc] initWithFrame:CGRectMake(0, 0, deviceScreenWidth, deviceScreenHeight)];_announceWebView.backgroundColor = MAIN_VIEW_COLOR;_announceWebView.scalesPageToFit = YES;_announceWebView.allowsInlineMediaPlayback = YES;_announceWebView.mediaPlaybackRequiresUserAction = YES;[self.view addSubview:self.announceWebView];}return _announceWebView;}
其次，在导航栏的左边添加一个自定义返回按钮和关闭按钮：
@property (nonatomic,strong,readwrite) UIBarButtonItem *returnButton;@property (nonatomic,strong,readwrite) UIBarButtonItem *closeItem;- (UIBarButtonItem *)returnButton {if (!_returnButton) {_returnButton = [[UIBarButtonItem alloc] init];UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];UIImage *image = [UIImage imageNamed:@"fanhui.png"];[button setImage:image forState:UIControlStateNormal];//这是一张“<”的图片[button setTitle:@" 返回" forState:UIControlStateNormal];[button addTarget:self action:@selector(respondsToReturnToBack:) forControlEvents:UIControlEventTouchUpInside];[button.titleLabel setFont:[UIFont systemFontOfSize:17]];[button setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];[button sizeToFit];button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentLeft;button.contentEdgeInsets = UIEdgeInsetsMake(0, -15, 0, 0);button.frame = CGRectMake(20, 0, 40, 40);_returnButton.customView = button;self.navigationItem.leftBarButtonItem = _returnButton;}return _returnButton;}- (UIBarButtonItem *)closeItem {if (!_closeItem) {_closeItem = [[UIBarButtonItem alloc] initWithTitle:@"关闭" style:UIBarButtonItemStyleDone target:self action:@selector(respondsToReturnToFind:)];}return _closeItem;}
两个按钮的点击事件处理
- (void)respondsToReturnToBack:(UIButton *)sender {// 判断当前的H5页面是否可以返回if ([self.announceWebView canGoBack]) {// 如果可以返回，则返回到上一个H5页面，并在左上角添加一个关闭按钮[self.announceWebView goBack];self.navigationItem.leftBarButtonItems = @[self.returnButton, self.closeItem];} else {// 如果不可以返回，则直接:[self.navigationController popViewControllerAnimated:YES];}}- (void)respondsToReturnToFind:(UIBarButtonItem *)sender {[self.navigationController popViewControllerAnimated:YES];}
最后再用[self.announceWebView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:API_URL_ANNOUNCEMENT]]]加载出WebView界面内容以及实现相关的代理即可。
