首頁猿問 react...

react native里webview怎么設(shè)置高度自適應(yīng)

native

蕪湖不蕪 2018-10-02 13:13:23

查看完整描述

1 回答

MM們

TA貢獻(xiàn)1886條經(jīng)驗(yàn) 獲得超2個(gè)贊

webview中右下角的縮放按鈕能不能去掉

　　settings.setDisplayZoomControls(false); //隱藏webview縮放按鈕

　　

　　讓W(xué)ebview加載的頁面居中顯示有我知道的幾種方法
　　第一種方法：

　　WebSettings settings = webView.getSettings();
　　settings.setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
　　LayoutAlgorithm是一個(gè)枚舉用來控制頁面的布局，有三個(gè)類型：

　　1.NARROW_COLUMNS：可能的話使所有列的寬度不超過屏幕寬度

　　2.NORMAL：正常顯示不做任何渲染

　　3.SINGLE_COLUMN：把所有內(nèi)容放大webview等寬的一列中

　　用SINGLE_COLUMN類型可以設(shè)置頁面居中顯示，頁面可以放大縮小，但這種方法不怎么好，有時(shí)候會讓你的頁面布局走樣而且我測了一下，只能顯示中間那一塊，超出屏幕的部分都不能顯示。

　　

　　第二種方法：

　　//設(shè)置加載進(jìn)來的頁面自適應(yīng)手機(jī)屏幕
　　settings.setUseWideViewPort(true);
　　settings.setLoadWithOverviewMode(true);
　　第一個(gè)方法設(shè)置webview推薦使用的窗口，設(shè)置為true。第二個(gè)方法是設(shè)置webview加載的頁面的模式，也設(shè)置為true。

　　這方法可以讓你的頁面適應(yīng)手機(jī)屏幕的分辨率，完整的顯示在屏幕上，可以放大縮小。

　　兩種方法都試過，推薦使用第二種方法

　　

　　第三種方法：（主要用于平板，針對特定屏幕代碼調(diào)整分辨率）
　　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);
　　}

反對回復(fù) 2018-10-28

慕仙森

TA貢獻(xiàn)1827條經(jīng)驗(yàn) 獲得超8個(gè)贊

webview中右下角的縮放按鈕能不能去掉

　　settings.setDisplayZoomControls(false); //隱藏webview縮放按鈕

　　

　　讓W(xué)ebview加載的頁面居中顯示咱知道的幾種方法
　　第一種方法：

　　WebSettings settings = webView.getSettings();
　　settings.setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
　　LayoutAlgorithm是一個(gè)枚舉用來控制頁面的布局，有三個(gè)類型：

　　1.NARROW_COLUMNS：可能的話使所有列的寬度不超過屏幕寬度

　　2.NORMAL：正常顯示不做任何渲染

　　3.SINGLE_COLUMN：把所有內(nèi)容放大webview等寬的一列中

　　用SINGLE_COLUMN類型可以設(shè)置頁面居中顯示，頁面可以放大縮小，但這種方法不怎么好，有時(shí)候會讓自己的頁面布局走樣而且咱測了一下，只能顯示中間那一塊，超出屏幕的部分都不能顯示。

　　

　　第二種方法：

　　//設(shè)置加載進(jìn)來的頁面自適應(yīng)手機(jī)屏幕
　　settings.setUseWideViewPort(true);
　　settings.setLoadWithOverviewMode(true);
　　第一個(gè)方法設(shè)置webview推薦使用的窗口，設(shè)置為true。第二個(gè)方法是設(shè)置webview加載的頁面的模式，也設(shè)置為true。

　　這方法可以讓自己的頁面適應(yīng)手機(jī)屏幕的分辨率，完整的顯示在屏幕上，可以放大縮小。

　　兩種方法都試過，推薦使用第二種方法

　　

　　第三種方法：（主要用于平板，針對特定屏幕代碼調(diào)整分辨率）
　　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);
　　}