TableViewCell 中嵌入WKWebview 顯示HTML字串,TableView高度自適應
需求:每個tableviewcell 新增一個wkwebview 用於顯示HTML 要求webview高度自適應,,每個cell高度自適應,,
網上查的資料,,使用的通知來重新整理tableview,,會使tableview重新整理次數過多,,本文的方法tableview只重新整理一次
實現思路:cell中新增一個代理和一個index屬性(cell協議方法中傳入indexpath.row) 在webview載入完HTML協議方法中重新設定webview的高度 通過代理把每個cell的webview高度和這個cell的index傳回Controller,在代理方法中把傳回的index作為key,webview高度作為value存入一個字典,,當所有的cell裡webview都加在完成,,此時Controller中已有一個儲存了所有cell高度(即webview高度)的字典,,tableview設定高度的協議方法中通過indexpath.row 去字典中取cell的高度即可。。
怎樣防止tableview重新整理陷入死迴圈?通過存入本地一個狀態,,具體看程式碼
為了方便在工程中新增名為test.text的文字檔案,裡面是一個數組,每個元素是字典存放HTML字串
(
{
option = "<p style=\"line-height:20.1pt; margin:5pt 0pt\"><span style=\"font-family:'Times New Roman'; font-size:10.5pt\">A.</span><span style=\"font-family:'Times New Roman'; font-size:10.5pt\"> </span><span style=\"color:#333333; font-family:'Times New Roman'; font-size:10.5pt\">0.643(</span><span style=\"color:#333333; font-family:\U5b8b\U4f53; font-size:10.5pt\">\U7cbe\U786e\U5230\U767e\U5206\U4f4d</span><span style=\"color:#333333; font-family:'Times New Roman'; font-size:10.5pt\">)</span></p>";
},
{
option = "<p style=\"line-height:20.1pt; margin:5pt 0pt\"><span style=\"font-family:'Times New Roman'; font-size:10.5pt\">B.</span><span style=\"font-family:'Times New Roman'; font-size:10.5pt\"> </span><span style=\"color:#333333; font-family:'Times New Roman'; font-size:10.5pt\">0.64(</span><span style=\"color:#333333; font-family:\U5b8b\U4f53; font-size:10.5pt\">\U7cbe\U786e\U5230\U767e\U5206\U4f4d</span><span style=\"color:#333333; font-family:'Times New Roman'; font-size:10.5pt\">)</span></p>";
}
)
Controller.m中
@interfaceSecondViewController ()<UITableViewDelegate,UITableViewDataSource,webViewCellDelegate>
@property (nonatomic, strong) UITableView *tableview;
@property (nonatomic, strong) NSMutableDictionary *cellHDic;
@property (nonatomic, strong) NSMutableArray *dataArr;
@end
@implementation SecondViewController
- (void)viewDidLoad {
[superviewDidLoad];
self.view.backgroundColor = [UIColorwhiteColor];
/// 存放所有cell裡webview高度的字典
self.cellHDic = [NSMutableDictionarydictionary];
self.tableview = [[UITableViewalloc] initWithFrame:CGRectMake(0, 0, [UIScreenmainScreen].bounds.size.width, [UIScreenmainScreen].bounds.size.height) style:UITableViewStylePlain];
[self.viewaddSubview:self.tableview];
self.tableview.delegate = self;
self.tableview.dataSource = self;
self.tableview.separatorStyle = UITableViewCellSeparatorStyleNone;
/// 防止tableview不停重新整理的狀態
[[NSUserDefaultsstandardUserDefaults] setObject:@"0"forKey:@"reload"];
[selfloadData];
}
- (void)loadData{
[MBProgressHUDshowHUDAddedTo:self.viewanimated:YES];
/// 從工程中取出資料
NSBundle *mainBundle = [NSBundlemainBundle];
NSString *txtPath = [mainBundle pathForResource:@"test" ofType:@"txt"];
NSArray *arr = [NSArrayarrayWithContentsOfFile:txtPath];
self.dataArr = [NSMutableArrayarrayWithArray:arr];
[self.tableviewreloadData];
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
returnself.dataArr.count;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
NSString *CellIdentifier = [NSString stringWithFormat:@"Cell%ld%ld", [indexPath section], [indexPath row]];
SecondTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (!cell) {
cell = [[SecondTableViewCellalloc] initWithStyle:UITableViewCellStyleDefaultreuseIdentifier:CellIdentifier];
}
cell.backgroundColor = [UIColorwhiteColor];
cell.delegate = self;
NSDictionary *dic = self.dataArr[indexPath.row];
[cell refreshWebView:dic[@"option"] indexPath:indexPath.row];
return cell;
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
return [self.cellHDic[[NSStringstringWithFormat:@"%ld",indexPath.row]] floatValue];
}
- (void)webViewDidFinishLoad:(CGFloat)webHeight cellIndex:(NSInteger)index{
[self.cellHDicsetValue:[NSStringstringWithFormat:@"%f",webHeight] forKey:[NSStringstringWithFormat:@"%ld",index]];
/// 防止一直重新整理 只有字典中的元素個數和tableviewcell個數相同時才重新整理tableview
if (self.cellHDic.count==self.dataArr.count) {
/// 通過NSUserDefaults 存的一個狀態讓tableview只重新整理一次
if ([[[NSUserDefaultsstandardUserDefaults] objectForKey:@"reload"] isEqualToString:@"0"]) {
NSArray *paths = [NSArrayarrayWithObjects:[NSIndexPathindexPathForRow:index inSection:0],nil];
[self.tableviewreloadRowsAtIndexPaths:paths withRowAnimation:UITableViewRowAnimationFade];
[MBProgressHUDhideHUDForView:self.viewanimated:YES];
[[NSUserDefaultsstandardUserDefaults] setObject:@"1"forKey:@"reload"];
}
}
}
SecondTableViewCell.h
@protocol webViewCellDelegate<NSObject>
/// 傳回webview高度的代理
- (void)webViewDidFinishLoad:(CGFloat)webHeight cellIndex:(NSInteger)index;
@end
@interface SecondTableViewCell : UITableViewCell
@property (nonatomic,weak) id<webViewCellDelegate>delegate;
@property (nonatomic, assign) NSInteger indexPath;
- (void)refreshWebView:(NSString *)url indexPath:(NSInteger)index;
@end
SecondTableViewCell.m- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier{
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (self) {
[self createView];
}
returnself;
}
- (void)createView{
self.newsWebView = [[WKWebViewalloc] init];
self.newsWebView.frame = CGRectMake(0, 0, self.contentView.frame.size.width, 0);
self.newsWebView.navigationDelegate = self;
self.newsWebView.scrollView.scrollEnabled = NO;
[self.newsWebViewsizeToFit];
[self.contentViewaddSubview:self.newsWebView];
//
self.line = [[UIViewalloc] init];
[self.contentViewaddSubview:self.line];
self.line.backgroundColor = [UIColorlightGrayColor];
}
- (void)refreshWebView:(NSString *)url indexPath:(NSInteger)index{
self.indexPath = index;
//// headerString 的新增是解決wkwebview 載入HTML是字型太小的問題
NSString *headerString = @"<header><meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no'></header>";
[self.newsWebViewloadHTMLString:[headerString stringByAppendingString:url] baseURL:nil];
}
- (void)webView:(WKWebView *)webView didStartProvisionalNavigation:(WKNavigation*)navigation{
}
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation*)navigation{
[webView evaluateJavaScript:@"document.body.scrollHeight"completionHandler:^(id_Nullable result,NSError * _Nullable error){
CGFloat height = [result floatValue];
self.newsWebView.frame = CGRectMake(0, 0, self.contentView.frame.size.width, height);
[self.delegatewebViewDidFinishLoad:height cellIndex:self.indexPath];
self.line.frame = CGRectMake(0, height-0.5, self.contentView.frame.size.width, 0.5);
}];
}
demo地址
連結:https://pan.baidu.com/s/15HfCM1EdWcymv8J6vmGvKg 密碼:zkqh
相關推薦
TableViewCell 中嵌入WKWebview 顯示HTML字串,TableView高度自適應
需求:每個tableviewcell 新增一個wkwebview 用於顯示HTML 要求webview高度自適應,,每個cell高度自適應,,網上查的資料,,使用的通知來重新整理tableview,,會使tableview重新整理次數過多,,本文的方法tableview只重新
jqgrid 中textarea使用回車鍵,表格高度自適應
應專案需求實現jqgrid中表格為textarea時高度自適應 在jqgrid中 編輯狀態時的表格 為input,textarea,select時回車事件將觸發單元格儲存"saveCell"; 原始碼: 1.在原始碼中搜索"textarea"找到到這段程式碼,將$(
Android GridView之新增分隔線,動態設定高度,實現高度自適應,並解決第一個item不顯示的問題
最近做一個專案時遇到一點問題,在這裡分享一下解決思路。 首先看效果圖: 這裡的需求是實現介面中的六個圖示,博主後來和同事討論過這個問題,用 GridView 實現費時費力好嘛,同事認為做6個 Button 就 好了,可能博主就愛鑽牛角尖吧,一開始認為怎麼辦只要還有辦法那就
vue中動態加入ECharts圖表時,ECharts寬度自適應/不能100%撐開
首先上圖吧, 關於vue動態加入echarts時,寬度不能100%的問題,首先上圖 如圖,echarts中的canvas的width才500,顯然不對呀,右邊還有那麼大的一片空白,需要說明下互動步驟 看看程式碼, 按鈕觸發click方法 顯示彈窗或
常用css上下佈局-上邊高度固定,下邊高度自適應
上下兩個盒子,上邊的固定,下面的自適應 <div class= "container"> <div class="left"></div> <div class="right"></div> </div
Android動態設定GridView的高度,固定column,實現高度自適應
動態設定GridView的高度,固定column,根據gridview中的item個數設定高度: 呼叫以下方法: [java] view plain copy print ?
小程式tab切換,內容高度自適應
<view class='aboutusContainer'> <image src='/assets/images/company.png' class='companyLogo'></image> <view cl
css 頭部和底部固定,中間高度自適應,出滾動條 css程式碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initia
html實現輸入框高度自適應
html實現輸入框高度自適應 解決方案 情況一:父div中只有一個元素時正常寫 做網頁的時候為了解決textarea輸入時可以隨著文字的增加自動調整高度,將父div的heigth設定為auto 情況二:父d
ViewPager 巢狀多個不同高度的Fragment,ViewPager 高度自適應
問題: ViewPager 巢狀多個Fragment,但是每個Fragment高度不一致,導致高度比較小的Fragment底部留有大片空白區域。 解決方法: 參考文章 關於ViewPager高度自適應(隨著pager頁的高度改變Viewpager的高度)
動態設定GridView的高度,固定column,實現高度自適應
動態設定GridView的高度,固定column,根據gridview中的item個數設定高度: 呼叫以下方法: public static void setListViewHeightBased
頂部和底部固定高度,中間高度自適應的佈局
html程式碼 <div id="all"> <div id="top">top</div> <div id="conte
Nodejs:npm run build之後,dist\index.html頁面在火狐中可以正常顯示登入頁面並登入成功,在Chrome中可以正常顯示登入頁面,登入失敗
問題描述:Nodejs:npm run build之後,dist\index.html頁面在火狐中可以正常顯示登入頁面並登入成功,在Chrome中可以正常顯示登入頁面,登入失敗 解決方法:將打包後的dist\index.html放到http伺服器上執行就可以登入了。 總結:
html中嵌入flvplayer.swf播放器,播放視訊
html中嵌入flvplayer.swf播放器,播放視訊 只需要改動紅色的程式碼: <object classid='clsid:D27CDB6E-AE6D-11cf-96B8-4445535411111' codebase='http://download.macromedia.co
網頁html中嵌入特殊字型(中文,英文)
英文字型引入方法: html程式碼 <!DOCTYPE html> <html> <head> </head> <style> @font-face { font-family: 'fon
jquery Bootstrap 彈出框(Popover)顯示html內容,URL,div等
containe inpu lock ext ace src group mar 顯示 實現效果: 其實有個關鍵點: data-container="body" data-html="true" 註意下就可以了 <button type="button" class=
在網頁中能正常顯示的頁面,在手機端出現問題?
只需要在頁面的head中加上如下程式碼即可: <meta name="viewport" id="viewport" content="width=device-width, initial-scale=1,minimum-scale=1,maximum-scale=1,use
[Robot Framework] 校驗字串中是否包含某個子字串,校驗同時滿足兩個條件中任意一個
${tWarningMessage} Run Keyword If ${tIfExist} AutoItLibrary.Win Get Text Generate Fee Data warning message ELSE Set Variable "" ${tIfDuplicateFee} Evaluat
linux在資料夾中查詢檔案包含的字串,並進行相應的替換
說明如下:要在一個目錄中,查詢所有檔案中包含的字串AAA,找出檔案,並用BBB進行替換掉。 #grep -r AAA ./ #表示在當前目錄中遞迴查詢包含AAA的檔案。 #grep -rl AAA ./
IOS UILabel顯示HTML字串
在寫一個IOS的APP時,有一部分片段是HTML字串,開始想使用UIWebView來顯示,開始實驗成功,後來不知何原因,無法顯示內容,後來發現IOS7後,UILabel支援顯示HTML顯示,具體見程式碼,一方面自己好查閱,也供有需要朋友查閱。 要顯示的HTML串 <f