強制橫向移動時，Android應用程序（嵌入式WebView）崩潰

Question

我有一個HTML5應用程序，幾乎所有應用程序都在Canvas中進行。 在JS中，我為畫布的高度和寬度設置了確切的尺寸。 我還對魔術數字使用了很多絕對定位來使布局完美。 注意：一切都圍繞橫向設計，不能選擇縱向。

在現代版本的Chrome中運行此程序，一切工作都很好-Chrome似乎可以在頁面加載時正確縮放畫布（無論視口大小如何），並且絕對定位的畫布圖形/ HTML元素的位置也相應縮放。

但是現在，我正在嘗試使用Android應用程序完成相同的操作-一個非常簡單的應用程序，它僅加載WebView而不包含任何內容。 畫布比電話的分辨率小得多，因此我認為這應該可行。

我的具體問題是，在清單文件中設置android：screenOrientation =“ landscape”總是會使應用立即崩潰。 我的猜測是，它與我的主布局文件交互不良，但我不知道如何進行。 我正在三星銀河S6上進行測試，並將該應用程序構建為SDK版本21。

我想要的是類似在台式機Chrome瀏覽器中的行為，但是我似乎找不到找不到無法顯示整個HTML5 Canvas或立即使應用崩潰的方法。

這是我用來放置畫布的JS（在台式機Chrome中）可以正常工作-請注意canvas＃board是canvas元素。

<meta name='viewport' content='width=device-width, initial-scale=1'>

// some irrelevant code omitted...

var XRES  = 640;
var YRES  = 280;
var X_OFF = (window.innerWidth  - XRES) / 2;
var Y_OFF = (window.innerHeight - YRES) / 2;

// some irrelevant code omitted...

$('#board').css('left', X_OFF);
$('#board').css('top',  Y_OFF);
$('#submitDialog').css('left', X_OFF + 222);
$('#submitDialog').css('top',  Y_OFF +  41);

無論整個視口大小如何，這都會使畫布在兩個維度上居中， 並使SubmitDialog （最終用於提交高分的div） 居中 。

我想要的是一種更改HTML / JS或Android項目配置以實現同一目的的方法。 理想的情況是，我可以使WebView自動縮放到屏幕大小的90％。 有什么想法嗎？ 預先感謝！

Answer 1

我找到了答案。 我從未能夠通過Manifestdirection = landscape屬性使其工作，但是在onCreate（）中使用setRequestedOrientation （）可以完美地工作。 我還必須將WebView尺寸設置為JS設置Canvas元素的確切尺寸。

比例尺和偏移存在一些問題，可以通過調整WebView的比例尺和邊距屬性輕松解決（再次使用幻數，但我確定可以為任何設備計算正確的值並在onCreate（）中進行設置。