在tableview的headerView中添加webView,webView自适应高度

最近在项目中需要添加一个webView加载的页面,下面显示的是对这个webView所显示的内容的一个评论列表 ,列表要根据后台加载过来的HTML自适应的变化高度,tableview的cell在webView的下面显示,显示的效果

1.设置webView ,初始的高度设置为0.5 ,设置为tableHeaderView为webView,添加了一个观察者,监控webView 的contentSize的变化

    _myWebView = [[UIWebView alloc]initWithFrame:CGRectMake(0, 0, KScreenWidth, 0.5)];
    _myWebView.delegate = self;
    _myWebView.scrollView.scrollEnabled = NO;
    _myWebView.scrollView.showsHorizontalScrollIndicator = NO;
    [_myWebView sizeToFit];
    _myWebView.scrollView.bounces = NO;
    [self.myWebView.scrollView addObserver:self forKeyPath:@"contentSize" options:NSKeyValueObservingOptionNew context:nil];
    _myTableView.tableHeaderView = _myWebView;

2.在observer中的方法,通过获取到整个webView的内容,修改他的frame

- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context
{
    if ([keyPath isEqualToString:@"contentSize"]) {
        webViewH = [[self.myWebView stringByEvaluatingJavaScriptFromString:@"document.body.offsetHeight"] floatValue]+15;
        CGRect newFrame = self.myWebView.frame;
        newFrame.size.height = webViewH;
        NSLog(@"现在的高度===%f",webViewH);
        self.myWebView.frame = newFrame;
        self.myTableView.tableHeaderView = self.myWebView;
    }
}

3.最后也别忘记释放观察者

-(void)dealloc{
    [self.myWebView.scrollView removeObserver:self forKeyPath:@"contentSize"];
}

  

  

  

时间: 2024-08-10 17:18:56

在tableview的headerView中添加webView,webView自适应高度的相关文章

利用 Chrome 开发者工具远程调试 Android 中的原生 WebView

之前写过一篇关于 Android Studio 断点调试技巧 的文章,但都是针对 Native 代码的调试,对于 Hybrid 开发模式下的 WebView 却无从下手.幸运的是,PC 中的 Chrome 浏览器提供的开发者工具能够帮助我们远程调试 Android 中的 WebView 加载的网页. Android 4.4 (KitKat) 开始,使用 Chrome 开发者工具可以帮助我们在原生 Android 应用中远程调试 WebView 网页内容.一起来看看怎么操作吧. 第一步,设置 We

127使用 TableView 自带的单元格样式实现好友列表,另外在单元格中添加辅助按钮

类似的做法如之前这篇随笔:114自定义 UITableViewCell 实现好友列表(扩展知识:如何使用xib创建自定义的表格视图单元格 KMTableViewCell) 相比之下:自定义 UITableViewCell 的内容灵活,可根据需求调整展示效果,应用场景更广:一般适用于TableView 自带的单元格样式无法实现的效果. 效果如下: ViewController.h 1 #import <UIKit/UIKit.h> 2 3 @interface ViewController :

iOS【野路子】精准获取webView内容高度,自适应高度

关于WebView内容高度的获取,相信很多人都踩过坑,无法获取到准确高度,导致页面布局出现差错,搜到的资料很多但都无法解决问题,以下是个人经验总结: 项目需求实现H5文章&原生评论效果,文章是加载H5链接,评论信息是后台接口提供,以列表形式展示. 实现思路: 1. webView加载H5链接,设置它为tableView的 headerView,下方评论信息用Cell加载展示. 2. 在webView的回调方法webViewDidFinishLoad中获取网页内容高度,设置为webView的高度,

swift 如何获取webView的内容高度

应用中如果使用webView,要想获取其内容高度,就要实现其代理方法, 首先添加代理UIWebViewDelegate 然后给代理赋值 webView.delegate = self 实现代理方法: func webViewDidFinishLoad(webView: UIWebView) {...} 接下来就可以在这个方法里获取到webView的高度了 print(webView.scrollView.contentSize.height)

精通IOS-在表单元中添加子视图

#import <UIKit/UIKit.h> @interface NameAndColorCellTableViewCell : UITableViewCell @property(copy,nonatomic) NSString *name; @property(copy,nonatomic) NSString *color; @end NameAndColorCellTableViewCell.h // // NameAndColorCellTableViewCell.m // Tab

101在检索框中添加一个书签按钮(扩展知识:在检索框中添加一个范围条)

效果如下: ViewController.h 1 #import <UIKit/UIKit.h> 2 3 @interface ViewController : UITableViewController<UISearchBarDelegate> 4 @property (strong, nonatomic) UISearchBar *searchBar; 5 @property (strong, nonatomic) NSMutableArray *mArrDataSourceO

iOS 【终极方案】精准获取webView内容高度,自适应高度

前言:是这样的,刚写完上一篇文章还没缓过神来,上一篇文章我还提到了,想和大家聊聊原生+H5如何无缝连接的故事.结果我朋友就给我发了两篇他的作品.他的做法也都有独到之处.好的文章都是这样,让你每次看都能有新的收获,我们也都致力于写一些能帮别人解决问题的文章,下面我用另一种方式来完美实现这个问题.毕竟之前大家都是根据UIWebView写的,我来说说换成WK之后的区别,主题思路也不同哦~ 插两个链接,是我朋友的大家也可以做个对比 iOS [终极方案]精准获取webView内容高度,自适应高度 iOS

Andorid WebView内容自适应并改变图片大小

关键部分: <meta name="viewport" content="width=device-width, initial-scale=1"> webview.loadUrl("javascript:var imgs=document.getElementsByTagName('img');for(var i=0;i<imgs.length;i++){imgs[i].style.width='320px';};void(0);&qu

iOS8中添加的extensions总结(一)——今日扩展

通知栏中的今日扩展 分享扩展 Action扩展 图片编辑扩展 文件管理扩展 第三方键盘扩展 注:此教程来源于http://www.raywenderlich.com的<iOS8 by Tutorials> 关于App extensions 的原理,即How extensions work 首先App扩展是一个App功能性上的扩展,它并不独立与你原来的App,也就是说在给App Store提交的时候是打包到原有App中一起提交,它们并不是独立的App.其次,App的每一种扩展都有自己单独的API