iOS-UIWebView加载HTMLString图片显示超过屏幕宽度,导致webView可以左右滑动处的理方法

简单介绍一下使用[self.webView loadHTMLString:htmls baseURL:nil]单纯加载HTMLString的小技巧。

  • 主要解决的是当加载的HTMLString既有文字又有图片时,图片没有缩放,导致图片宽度超过屏幕宽度,使得webView整体左右都可以滑动,这样效果非常不好(见下图):
01-图片过宽导致webView可以左右滑动.gif
01-图片过宽导致webView可以左右滑动.gif

效果不好的代码如下:

  • 注:以下方法是在网络请求成功回调里面调用的

    // 网络请求加载的数据,进行字典转模型
    NSDictionary *dict = [result objectForKey:@"data"];
    HQNewsDetailModel *model = [HQNewsDetailModel mj_objectWithKeyValues:dict];
    // model.details就是后台返回的HTMLString
    NSString *htmlString = [NSString stringWithString:model.details];
    // webView直接加载HTMLString
    [self.webView loadHTMLString:htmls baseURL:nil];

经过调整以后(见下图):

02-经过调整以后的效果.gif

调整后的代码如下:

  • 注:以下方法是在网络请求成功回调里面调用的

    // 网络请求加载的数据,进行字典转模型
    NSDictionary *dict = [result objectForKey:@"data"];
    HQNewsDetailModel *model = [HQNewsDetailModel mj_objectWithKeyValues:dict];

    /**

    • model.details就是后台返回的HTMLString
    • " $img[p].style.width = '100%%';\n"--->就是设置图片的宽度的
    • 100%代表正好为屏幕的宽度
      */
      NSString *htmlString = [NSString stringWithFormat:@" \n"
      " \n"
      " \n"
      " \n"
      ""
      "%@"
      ""
      "",model.details];

    // webView直接加载HTMLString
    [self.webView loadHTMLString:htmlString baseURL:nil];

iOS-UIWebView加载HTMLString图片显示超过屏幕宽度,导致webView可以左右滑动处的理方法_第1张图片
03-关键代码描述.png

你可能感兴趣的:(iOS-UIWebView加载HTMLString图片显示超过屏幕宽度,导致webView可以左右滑动处的理方法)