先说一下我们的需求:文章内容用H5展示,因为要展示后台编辑的多种样式,页面其他内容都是原生,也就是说在一个原生页面插入一块webview。(我是tabview的headerView放的文章内容,也就是webview)
问题1:webView高度和文章内容保持一样。查出很多方式,不一一列举,体验和效果最好的就是用observer。
[self.webView.scrollView addObserver:self forKeyPath:@"contentSize" options:NSKeyValueObservingOptionOld | NSKeyValueObservingOptionNew context:nil];
#pragma mark --监听webView.scrollView的contentSize的变化
- (void)observeValueForKeyPath:(NSString*)keyPath ofObject:(id)object change:(NSDictionary*)change context:(void*)context
{
if([keyPathisEqualToString:@"contentSize"]) {
NSNumber *newValue = [change valueForKey:NSKeyValueChangeNewKey];
CGSizenewSize = [newValueCGSizeValue];
NSNumber * oldValue = [change valueForKey:NSKeyValueChangeOldKey];
CGSizeoldSize = [oldValueCGSizeValue];
if(newSize.height== oldSize.height) {
return;
}
CGRect frame =self.webView.frame;
CGFloat currentHeight = self.webView.scrollView.contentSize.height;
frame.size.height= currentHeight;
self.webView.frame= frame;
}
通过监听可以非常实时快速的根据文章内容高度改变来调整原生的UI。
注意:_webView = [[WKWebView alloc]initWithFrame:CGRectMake(0,0,R_ScreenWidth,1);
webview初始高度要设置为1,因为如果设置的比文章内容实际高度大,那么监听是不会触发的,为了让测试中可能存在的一句话文章,所以设置为1,最小值,不能设置为0.
问题2:我们的需求存在修改文章文字大小font的需求,和上面说的一样,从小字体切换到大字体是没问题的,但是从大字体切换到小字体,由于webview高度大于实际高度,不会走监听回调。所以要在调用js修改字体之前修改webVeiw高度为1.
CGRect frame = _articleHeader.webView.frame;
frame.size.height=1;
_articleHeader.webView.frame = frame;
这样就可以正常监听了,也不会有高度跳动的现象。
问题3:当tableview滑动到底部后,文章字体是大号的,修改成小号的,webview高度变小很多,这时候tableview的contentSize变小很多但是contentoffset还是之前的offset,会出现offset大于他的最大值(scrollview的offset到不能再滑动时候就是最大值或者最小值),这是tableview就滑不回正常状态了。所以在这个时候要修改offset到正常最大值就OK了。
_tableView.contentSize.height - _tableView.height; 应该就是offset最大值了。