您的位置：首页 > 移动开发

轻描淡写iOS--UIWebview中网页宽度自适应

2015-12-17 11:39 543 查看

如果展示webview的宽度不等于设备的宽度的时候，就会出现网页内容过宽左右可以滑动或者网页左右内容没有占满。

利用webview中的scrollview的zoom特性，这个方法会让网页内容变小

<span style="background-color: rgb(255, 255, 255);"><code style="margin: 0px; padding: 0px; border: 0px; font-family: Consolas, Menlo, Monaco, 'Lucida Console', 'Liberation Mono', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Courier New', monospace, sans-serif; white-space: inherit;"><span class="pun" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">-</span><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> </span><span class="pun" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">(</span><span class="kwd" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 139);">void</span><span class="pun" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">)</span><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">webViewDidFinishLoad</span><span class="pun" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">:(</span><span class="typ" style="margin: 0px; padding: 0px; border: 0px; color: rgb(43, 145, 175);">UIWebView</span><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> </span><span class="pun" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">*)w</span><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">ebView
</span><span class="pun" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">{</span><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">
</span><span class="typ" style="margin: 0px; padding: 0px; border: 0px; color: rgb(43, 145, 175);">CGSize</span><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> contentSize </span><span class="pun" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">=</span><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> webView</span><span class="pun" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">.</span><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">scrollView</span><span class="pun" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">.</span><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">contentSize</span><span class="pun" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">;</span></code></span>

<span style="background-color: rgb(255, 255, 255);"><code style="margin: 0px; padding: 0px; border: 0px; font-family: Consolas, Menlo, Monaco, 'Lucida Console', 'Liberation Mono', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Courier New', monospace, sans-serif; white-space: inherit;"><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">  </span><span class="typ" style="margin: 0px; padding: 0px; border: 0px; color: rgb(43, 145, 175);">CGSize</span><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> windows<span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px;">Size </span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px;">=</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px;"> self</span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px;">.</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px;">view</span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px;">.</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px;">bounds</span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px;">.</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px;">size</span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px;">;</span></span></code></span>

<span style="background-color: rgb(255, 255, 255);"><code style="margin: 0px; padding: 0px; border: 0px; font-family: Consolas, Menlo, Monaco, 'Lucida Console', 'Liberation Mono', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Courier New', monospace, sans-serif; white-space: inherit;"><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">  </span><span class="typ" style="margin: 0px; padding: 0px; border: 0px; color: rgb(43, 145, 175);">float</span><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> rate </span><span class="pun" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">=</span><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> </span></code><code style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; font-family: Consolas, Menlo, Monaco, 'Lucida Console', 'Liberation Mono', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Courier New', monospace, sans-serif;"><span class="pln" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">windows<span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px;">Size</span></span></code><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">.</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">width </span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">/</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> contentSize</span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">.</span><span class="pln" style="white-space: inh
a384
erit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">width</span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">;</span></span>

<span style="background-color: rgb(255, 255, 255);"><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> webView</span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">.</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">scrollView</span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">.</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">minimumZoomScale </span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">=</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> rate</span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">;</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> </span></span>

<span style="background-color: rgb(255, 255, 255);"><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> webView</span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">.</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">scrollView</span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">.</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">maximumZoomScale </span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">=</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> <span style="white-space: inherit;">rate</span></span><span style="color: rgb(0, 0, 0); white-space: inherit;">;</span></span>

<span style="background-color: rgb(255, 255, 255);"><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"> webView</span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">.</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">scrollView</span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">.</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">zoomScale </span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">= </span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);"><span style="white-space: inherit;">rate</span></span><span class="pun" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">;</span><span class="pln" style="white-space: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0);">  </span></span>

<span style="background-color: rgb(255, 255, 255);"><span style="color: rgb(0, 0, 0); white-space: inherit;">}</span></span>

参考：

1. http://stackoverflow.com/questions/10666484/html-content-fit-in-uiwebview-without-zooming-out

2. http://stackoverflow.com/questions/5594447/webpage-in-uiwebview-doesnt-autoresize-correctly-when-uiwebviews-width-is-less

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： webview uiwebview iOS

相关文章推荐

新的分享

章节导航