Machen Sie Webview in einem Tablet simulieren ein kleines Gerät

Question

Ich habe eine mobile Website, die sehr gut für kleine Geräte, wie Smartphones geeignet ist, aber es sieht nicht gut auf einem Tablet.

Ich verwende eine webview, um die Website anzuzeigen. Diese Webansicht belegt den gesamten Bildschirmbereich. Gibt es eine Möglichkeit, dass ich die Webansicht ein kleines Gerät simulieren kann?

ich aus der Dokumentation nicht ganz bekommen, welche Kombination von Optionen (, setUseWideViewPort, setDefaultZoom) wird mich machen erreichen, was ich will. Jede Hilfe wird geschätzt.

Obs: Ich habe bereits versucht, den Text Zoom (setTextZoom(int)). Es wurde etwas besser, aber nicht so gut wie auf dem Smartphone.

Obs2: I kann nicht ändern Sie die Website. :(

UPDATE:

Wenn ich die Webansicht Breite auf 720 Pixel zu ändern, schön die HTML-Seite Änderungen an der mobilen Layout und Anzeigen Nun möchte ich, dies zu tun, aber die Webansicht mit voller Breite zu halten.. Wie trickst du die HTML-Seite, um zu glauben, dass die Breite der Webansicht kleiner ist als sie wirklich ist

Obs: Zoom funktioniert nicht Die HTML-Seite hat es nicht aktiviert Und ich denke es ist kein guter Weg, seit Zoom ändert nicht die wahrgenommene Größe der Webansicht

Answer 1

Update: Wenn Sie eine neuere API (> 18) haben Vielleicht möchten Sie sich die Notiz am Ende dieser Frage ansehen.

---

Nachdem ich für ziemlich viel gekämpft habe, fand ich die Lösung!

Die Lösung war nicht auf Zoom. Der Zoom wurde für die HTML-Seite nicht aktiviert und hatte keinen Einfluss auf die Größe, die von HTML wahrgenommen wird.

Ich habe es durch die Breite der Webansicht Tieferlegung:

ViewGroup.LayoutParams webviewLayoutParameters = mWebView.getLayoutParams(); 

webviewLayoutParameters.width = (int) (760); 
webviewLayoutParameters.height =(int) (webviewHeight); 
mWebView.setLayoutParams(webviewLayoutParameters); 

Dann wird, wie die Seite eine Art hatte, die für Bildschirm geändert Größen kleiner als 768px, begann es anders aussehen. Viel besser.

Aber dann Ich wollte dieses kleine Webview so vergrößern, dass es auf dem ganzen Bildschirm passen konnte. Dafür habe ich scaleX und scaleY verwendet.

Dies ist meine komplette kommentierte Lösung:

// First, get the current screen size 
Display display = getWindowManager().getDefaultDisplay(); 
Point size = new Point(); 
display.getSize(size); 
int displayWidth = size.x; 
int displayHeight = size.y; 

//Then, set the amount you want to make your screen smaller. This means that it will comunicate to the HTML that its 20% smaller than it really is 
float amplification_ratio = (float) 0.20; 

// Shrink webview size 
ViewGroup.LayoutParams webviewLayoutParameters = mWebView.getLayoutParams(); 
webviewLayoutParameters.width = (int) (displayWidth*(1-amplification_ratio)); 
webviewLayoutParameters.height =(int) (displayHeight*(1-amplification_ratio)); 
mWebView.setLayoutParams(webviewLayoutParameters); 

// Now scale it the inverse ammount so it will take the full screen. 
mWebView.setScaleX(1/(1 - amplification_ratio)); 
mWebView.setScaleY(1/(1 - amplification_ratio)); 

es ziemlich gut funktioniert. Ich habe es so skaliert, dass sich die Bildschirmgröße ändert. Das Schrumpfen und Skalieren wird die Bildqualität ein wenig niedriger machen, aber es ist keine große Sache.

Obs: Die HTML-Seite wurde im Bootstrap erstellt und hatte nur Klassen für Bootstrap -xs Geräte. Also musste ich simulieren, dass der Bildschirm kleiner als 768px war.

---

OBS2 (Update): Benennen Sie dieses Verfahren

ich diese auf meinem App implementiert, getestet (Modell und Integration), und seine jetzt in der Produktion leben. Um die Funktionen und Variablen zu erstellen, musste ich diese Prozedur benennen. Was das bedeutet, ist wie die Größe eines Webview-Pixels zu erhöhen. Auf diese Weise nimmt die Webansicht immer noch den ganzen Bildschirm ein, aber sie wird eine Breite in Pixel haben, die kleiner ist.

In diesem Sinne ist jeder Name wie pixelEnlargementFactor, pixelMagnificationRatio oder pixelSizeMultiplicator ein guter Name.

---

UPDATE:

WARNUNG: Verwenden Sie die oben beschriebene Methode nur in bestimmten Fällen!

Ich hatte eine alte API-Version (15) und hatte eine RelativeLayout mit vielen Optionen. Damals funktionierte die setInitialScale(120) nicht so, wie ich es wollte.

Jetzt habe ich meine API zu 19 und mein Layout zu einem einfacheren FrameLayout mit weniger Optionen geändert. Jetzt hat der setInitialScale(120) Befehl zusammen mit mWebView.getSettings().setUseWideViewPort(false) alles, was ich vorher erreicht habe, mit viel weniger Code.