Android Webview - веб-страница должна соответствовать экрану устройства
Я попробовал следующее, чтобы соответствовать веб-странице в зависимости от размера экрана устройства.
mWebview.setInitialScale(30);
а затем установите область просмотра метаданных
<meta name="viewport" content="width=320, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=0;"/>
<meta name="viewport" content="width=device-width, target-densityDpi=medium-dpi"/>
Но ничего не работает, веб-страница не привязана к размеру экрана устройства.
Может кто-нибудь сказать мне, как получить это?
22 ответа
Вы должны вычислить шкалу, которую вам нужно использовать вручную, а не устанавливать 30.
private int getScale(){
Display display = ((WindowManager) getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay();
int width = display.getWidth();
Double val = new Double(width)/new Double(PIC_WIDTH);
val = val * 100d;
return val.intValue();
}
Тогда используйте
WebView web = new WebView(this);
web.setPadding(0, 0, 0, 0);
web.setInitialScale(getScale());
Вы можете использовать это
WebView browser = (WebView) findViewById(R.id.webview);
browser.getSettings().setLoadWithOverviewMode(true);
browser.getSettings().setUseWideViewPort(true);
это исправляет размер в зависимости от размера экрана.
Эти настройки работали для меня:
wv.setInitialScale(1);
wv.getSettings().setLoadWithOverviewMode(true);
wv.getSettings().setUseWideViewPort(true);
wv.getSettings().setJavaScriptEnabled(true);
setInitialScale (1) отсутствовал в моих попытках.
Хотя в документации сказано, что 0 будет полностью уменьшаться, если для setUseWideViewPort задано значение true, но 0 у меня не сработало, и мне пришлось установить 1.
Друзья,
Я нашел много импорта и полезной информации от вас. Но единственный способ работает для меня был так:
webView = (WebView) findViewById(R.id.noticiasWebView);
webView.setInitialScale(1);
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setUseWideViewPort(true);
webView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
webView.setScrollbarFadingEnabled(false);
webView.loadUrl("http://www.resource.com.br/");
Я работаю на Android 2.1 из-за таких устройств от компании. Но я исправил свою проблему, используя часть информации от каждого из них.
Спасибо вам!
Попробуйте с этими советами HTML5
http://www.html5rocks.com/en/mobile/mobifying.html
И с этим, если ваша версия Android 2.1 или выше
WebView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
Все, что вам нужно сделать, это просто
webView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setUseWideViewPort(true);
Они работают для меня и соответствуют WebView для ширины экрана:
// get from xml, with all size set "fill_parent"
webView = (WebView) findViewById(R.id.webview_in_layout);
// fit the width of screen
webView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
// remove a weird white line on the right size
webView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
Спасибо выше советует и белая линия в веб-представлении затмения
У меня та же проблема, когда я использую этот код
webview.setWebViewClient(new WebViewClient() {
}
так что, может быть, вы должны удалить его в своем коде
И не забудьте добавить 3 режима ниже для вашего веб-просмотра
webview.getSettings().setJavaScriptEnabled(true);
webview.getSettings().setLoadWithOverviewMode(true);
webview.getSettings().setUseWideViewPort(true);
это исправляет размер в зависимости от размера экрана
У меня было видео в HTML-строке, и ширина веб-просмотра была больше, чем ширина экрана, и это работает для меня.
Добавьте эти строки в строку HTML.
<head>
<meta name="viewport" content="width=device-width">
</head>
Результат после добавления приведенного выше кода в строку HTML:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width">
</head>
</html>
WebView browser = (WebView) findViewById(R.id.webview);
browser.getSettings().setLoadWithOverviewMode(true);
browser.getSettings().setUseWideViewPort(true);
browser.getSettings().setMinimumFontSize(40);
Это прекрасно работает для меня, так как размер текста был установлен очень маленьким с помощью.setLoadWithOverViewMode и.setUseWideViewPort.
В этом случае вы должны использовать HTML в вашем webView. Я решил это, используя следующий код
webView.loadDataWithBaseURL(null,
"<!DOCTYPE html><html><body style = \"text-align:center\"><img src= "
+ \"http://www.koenvangorp.be/photos/2005_09_16-moon_2000.jpg\"
+ " alt=\"pageNo\" width=\"100%\"></body></html>",
"text/html", "UTF-8", null);
Это похоже на проблему XML. Откройте документ XML, содержащий ваш веб-вид. Удалите код заполнения сверху.
Затем в макете добавьте
android:layout_width="fill_parent"
android:layout_height="fill_parent"
В веб-представлении добавьте
android:layout_width="fill_parent"
android:layout_height="fill_parent"
Это позволяет Web-View соответствовать экрану устройства.
Внесение изменений в ответ danh32, так как display.getWidth(); сейчас устарела.
private int getScale(){
Point p = new Point();
Display display = ((WindowManager) getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay();
display.getSize(p);
int width = p.x;
Double val = new Double(width)/new Double(PIC_WIDTH);
val = val * 100d;
return val.intValue();
}
Тогда используйте
WebView web = new WebView(this);
web.setPadding(0, 0, 0, 0);
web.setInitialScale(getScale());
webview.setInitialScale(1);
webview.getSettings().setLoadWithOverviewMode(true);
webview.getSettings().setUseWideViewPort(true);
webview.getSettings().setJavaScriptEnabled(true);
будет работать, но не забудьте удалить что-то вроде:
<meta name="viewport" content="user-scalable=no"/>
если существует в html-файле или изменить user-scalable=yes, в противном случае это не так.
Для любого разработчика, который приземлился здесь и столкнулся с проблемой, связанной с начальным масштабированием / масштабированием Webview (особенно на настраиваемых веб-страницах).
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setUseWideViewPort(false); //make sure this method is false so setInitialScale() can work correctly
webView.getSettings().setLoadWithOverviewMode(true);
webView.setInitialScale(110);
Это поможет в настройке эмулятора в соответствии с веб-страницей:
WebView wb;
//CALL THIS METHOD
wb.setInitialScale(50);
Вы можете установить начальную шкалу в процентах, как показано выше.
Метод getWidth объекта Display устарел. Переопределите onSizeChanged, чтобы получить размер WebView, когда он станет доступным.
WebView webView = new WebView(context) {
@Override
protected void onSizeChanged(int w, int h, int ow, int oh) {
// if width is zero, this method will be called again
if (w != 0) {
Double scale = Double.valueOf(w) / Double.valueOf(WEB_PAGE_WIDTH);
scale *= 100d;
setInitialScale(scale.intValue());
}
super.onSizeChanged(w, h, ow, oh);
}
};
В теории сочетание:
settings.setLayoutAlgorithm(LayoutAlgorithm.NARROW_COLUMNS);
с
settings.setUseWideViewPort(false)
решает проблему, оборачивая содержимое и подгоняя к экрану. Но NARROW_COLUMNS устарела. Я советую вам прочитать эту ветку ниже, в которой подробно рассматривается проблема: https://code.google.com/p/android/issues/detail?id=62378
Для справки, это реализация решения @danh32 на Kotlin:
private fun getWebviewScale (contentWidth : Int) : Int {
val dm = DisplayMetrics()
windowManager.defaultDisplay.getRealMetrics(dm)
val pixWidth = dm.widthPixels;
return (pixWidth.toFloat()/contentWidth.toFloat() * 100F)
.toInt()
}
В моем случае ширина была определена тремя изображениями как 300 пикселей, поэтому:
webview.setInitialScale(getWebviewScale(300))
На поиск этого поста у меня ушло несколько часов. Благодарность!
Вот обновленная версия, не использующая устаревшие методы, основанная на ответе @danh32:
protected int getScale(Double contentWidth) {
if(this.getActivity() != null) {
DisplayMetrics displaymetrics = new DisplayMetrics();
this.getActivity().getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
Double val = displaymetrics.widthPixels / contentWidth * 100d;
return val.intValue();
} else {
return 100;
}
}
использоваться одинаково:
int initialScale = this.getScale(420d);
this.mWebView.setInitialScale(initialScale);
WebView webView = (WebView)findViewById(R.id.web_view);
webView.setInitialScale((int) getResources().getDimension(R.dimen._50sdp)); // getActivity(). if you are at Fragment
webView.getSettings().setLoadsImagesAutomatically(true);
webView.getSettings().setJavaScriptEnabled(true);
webView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
webView.loadDataWithBaseURL(null,here comes html content,"text/html","UTF-8", null);
webView.getSettings().setBuiltInZoomControls(true);
webView.getSettings().setSupportZoom(true);
webView.getSettings().setDisplayZoomControls(true);
webView.getSettings().setDefaultZoom(WebSettings.ZoomDensity.FAR);