Webview自適應屏幕

第一種: 
    settings.setUseWideViewPort(true); 
    settings.setLoadWithOverviewMode(true); 
    第二種: 
    WebSetting settings = webView.getSettings(); 
    settings.setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN); 
    把所有內容放在webview等寬的一列中。(可能會出現頁面中鏈接失效) 
    第三種: 
    DisplayMetrics metrics = new DisplayMetrics(); 
    getWindowManager().getDefaultDisplay().getMetrics(metrics); 
    int mDensity = metrics.densityDpi; 
    if (mDensity == 120) { 
    settings.setDefaultZoom(ZoomDensity.CLOSE); 
    }else if (mDensity == 160) { 
    settings.setDefaultZoom(ZoomDensity.MEDIUM); 
    }else if (mDensity == 240) { 
    settings.setDefaultZoom(ZoomDensity.FAR); 
    } 
   這方法可以讓你的頁面適應手機屏幕的分辨率,完整的顯示在屏幕上,可以放大縮小。 


例如適合800px寬度的頁面,如果通過WebView在1024px的屏幕寬度下顯示時,內容(圖片)會被放大,整體頁面會超出屏幕。 
試了將WebView的settings中的縮放都關閉了也不行。 
後來發現了WebSettings.ZoomDensity這個設置,並在文檔中找到了以下說明: 
Enum for specifying the WebView's desired density. FAR makes 100% looking like in 240dpi MEDIUM makes 100% looking like in 160dpi CLOSE makes 100% looking like in 120dpi 


這樣就能很好的說明以上問題的原因了,又是密度惹的禍... 


默認WebView的ZoomDensity是MEDIUM,對應160dpi。而我之前800px寬度的屏幕對應的是60dpi,1024px寬度的屏幕對應的是240dpi。所以,頁面在高分辨率的屏幕上被放大了1.5倍。這個和圖片自縮放的機制是一樣的。 


於是,只要通過當前屏幕的密度,動態設置該屬性就能適應不同屏幕(當然,默認你的頁面是針對160dpi的密度大小設計的),即可解決: 
int screenDensity = getResources().getDisplayMetrics().densityDpi ;   
WebSettings.ZoomDensity zoomDensity = WebSettings.ZoomDensity.MEDIUM ;   
switch (screenDensity){   
case DisplayMetrics.DENSITY_LOW :  
    zoomDensity = WebSettings.ZoomDensity.CLOSE;  
    break;  
case DisplayMetrics.DENSITY_MEDIUM:  
    zoomDensity = WebSettings.ZoomDensity.MEDIUM;  
    break;  
case DisplayMetrics.DENSITY_HIGH:  
    zoomDensity = WebSettings.ZoomDensity.FAR;  
    break ;  
}  
webSettings.setDefaultZoom(zoomDensity); 
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章