如今,移动APP与网页交互的关系越来越密切,所以,在APP开发的过程中,会经常使用到UIWebView.在我自己之前做的一个项目,也出现了APP与网页交互的功能,需要使用webview把一段html加载出来,然后通过计算webview的高度去设置其他控件的位置。然而,在获取webview高度的时候,出现了webview高度获取不完全的情况,而这种情况的出现都是在html有图片的情况下,因为图片还没有加载完,高度就已经计算完。当时卡在这里很久,也尝试过很多方法,但高度都还是会获取不完整,最后,通过监听webview内容的变化,来重新计算webview的高度,这样就获取了webview的完整高度。
#import "FirstViewController.h"
#import "SecondViewController.h"@interface FirstViewController ()
@property (nonatomic, strong) UIWebView *showWebView;
@property (nonatomic, assign) float webViewHeight;
@property (nonatomic, strong) UIScrollView *scrollView;
@end
@implementation FirstViewController
- (void)viewDidLoad {
[super viewDidLoad];
self.title = @"FIRST VC";
self.view.backgroundColor = [UIColor greenColor];
//设置uiwebview要加载的数据源,由于直接黏贴数据源会自动识别里面的URL,所以只能贴图
self.scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, 375, 667)];
self.scrollView.backgroundColor = [UIColor redColor];
self.scrollView.contentSize = CGSizeMake(375, 1);
[self.view addSubview:self.scrollView];
self.showWebView = [[UIWebView alloc] initWithFrame:CGRectMake(0, 0, 375, 1)];
self.showWebView.delegate = self;
self.showWebView.userInteractionEnabled = NO;
[self.scrollView addSubview:self.showWebView];
//加载数据源
[self.showWebView loadHTMLString:htmlStr baseURL:nil];
//监听webview
[self.showWebView.scrollView addObserver:self forKeyPath:@"contentSize" options:NSKeyValueObservingOptionNew context:nil];
//监听触发
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context
{
if ([keyPath isEqualToString:@"contentSize"]) {
//通过JS代码获取webview的内容高度
self.webViewHeight = [[self.showWebView stringByEvaluatingJavaScriptFromString:@"document.body.scrollHeight"] floatValue];
//通过webview的contentSize获取内容高度
// self.webViewHeight = [self.showWebView.scrollView contentSize].height;
CGRect newFrame = self.showWebView.frame;
newFrame.size.height = self.webViewHeight;
NSLog(@"-document.body.scrollHeight-----%f",self.webViewHeight);
NSLog(@"-contentSize-----%f",self.webViewHeight);
[self createBtn];
self.showWebView.frame = CGRectMake(0, 0, 375, self.webViewHeight);
}
}
//移除观察者
-(void)dealloc
{
[self.showWebView.scrollView removeObserver:self
forKeyPath:@"contentSize" context:nil];
}
- (void)createBtn
{
UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
btn.frame = CGRectMake(0, self.webViewHeight, 375, 50);
btn.backgroundColor = [UIColor lightGrayColor];
[btn setTitle:@"PUSH TO B" forState:UIControlStateNormal];
[btn addTarget:self action:@selector(push) forControlEvents:UIControlEventTouchUpInside];
[self.scrollView addSubview:btn];
self.scrollView.contentSize = CGSizeMake(375, self.webViewHeight+50);
}
- (void)push{
SecondViewController *svc = [[SecondViewController alloc] init];
[self.navigationController pushViewController:svc animated:YES];
}
@end
然后我们看看通过document.body.scrollHeight和[self.showWebView.scrollView contentSize].height获取的高度
通过输出可以看到,这两个方法获取webview的高度完全一致.