1. 程式人生 > >解決 android 高低版本 webView 裡內容 自適應螢幕的終極方法

解決 android 高低版本 webView 裡內容 自適應螢幕的終極方法

http://www.cnblogs.com/linguanh/p/4927353.html

轉載請宣告出處(http://www.cnblogs.com/linguanh/)

 先說下我的情況,大家可以對號入座(嫌無聊請跳過)

      我的專案要求是這樣的,先從資料庫裡面拿出來html標籤,因為載入到移動端的網頁內容是使用者在網頁編輯好了之後提交到伺服器的,即網頁內容是 b/s 互動,我在網頁前段編輯器裡面設定了只儲存編輯的 html 標籤,即是沒有頭部和後面的,形式是:

<html>

   <body>

       只儲存這裡的標籤到資料庫

   </body>

</html>

     移動端有兩個activity,這時候是 c/s 互動了,頁面一負責載入前置資料,例如一張封面圖之類的,然後使用者點選進入webView主體,我上面說了,我的目標html標籤是儲存到db的,所以我在第一個頁面的時候就把db裡面的html下載儲存到記憶體了,String即可,使用者點選時,跳轉傳遞。看到這裡,相信你知道我是載入到webView的了,沒錯,就是組合,再load。注意了,我這裡並不是直接加在一個連結,不是 webView.loadUrl() 是組合好 html 後再使用 loadDataWithBaseUrl。

 說下標籤不同的影響(很重要,因為某些方法對某些表情有用)

      通常,我們載入後超出螢幕寬度的一般是 img 或者 video 標籤或者文字,這類標籤可以使用css 或者 網上盛行的三個設定做到適配,這三個盛行的設定是:

setting.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
setting.setUseWideViewPort(true);
setting.setLoadWithOverviewMode(true);

我先說明,這三個設定不一定有效,android 4.4 後就很可能沒效,為什麼是很可能?你都不敢確定?上面說過,和標籤及其設定有關係。
   如果出現了 table 這種標籤,即 table 適配螢幕,很可能css都失效
,怎麼辦?,我就是遇到了它,所以有了這篇文章。 三,三種解決方法(重點)。 針對我的自己情況,自己組合html顯示的。 法一: 使用 Css 適配,它比上面的三種 setting 有效,對img 和video 絕壁有效,我給出個例子:
按 Ctrl+C 複製程式碼 按 Ctrl+C 複製程式碼

        法二:使用三種setting設定:          

        setting.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
        setting.setUseWideViewPort(true);
        setting.setLoadWithOverviewMode(true);
        這種方法的失敗可能性很大,但是,也可以一試

   法三:使用javaScript指令碼,暫時給它定義成功率是 100%(因為我用它沒失效過)
        我這裡給一個例子,例如我上面說到的 table。
1 2 3 4 5 6 7 "<script type=\"text/javascript\">" "var tables = document.getElementsByTagName('table');" + // 找到table標籤 "for(var i = 0; i<tables.length; i++){" // 逐個改變 "tables[i].style.width = '100%';" // 寬度改為100% "tables[i].style.height = 'auto';" + "}" + "</script>"+

                看到這裡,你很可能會說,這和 css 有什麼區別?區別可大了,我使用 css 改變table的失敗了,使用它成功了。

                 說明一下: 上面使用 js 腳步適配,請寫到 內容載入之後,即是 <body> 內容 <寫後面></body>,為什麼呢?有基礎的人都知道,html 是解析性語言,從上到下,你要先載入好 html 再使用 js 改變,除非js 包在函式裡面。

四,打完收工

      有問題請留言。

正在看本人部落格的這位童鞋,我看你氣度不凡,談吐間隱隱有王者之氣,日後必有一番作為!旁邊有“推薦”二字,你就順手把它點了吧,相得準,我分文不收;相不準,你也好回來找我。http://www.cnblogs.com/linguanh/