使用PhoneGap在第二個屏幕（HD）上鏡像iPad

我們正在考慮將PhoneGap用於我們正在開發的iPad應用程序。我們更願意在HTML5/CSS3/JS（我們非常熟悉）中開發它，所以PhoneGap框架顯然對我們很有吸引力。使用PhoneGap在第二個屏幕（HD）上鏡像iPad

但是，我確實有一個問題。我們的客戶將使用iPad上的應用程序，但連接到高清顯示器來鏡像內容。問題在於4：3的iPad和16：9的高清屏幕。使用純粹的Objective-C，我們已經閱讀了關於向第二個屏幕顯示不同內容和/或將其縮放的方法（以防止兩側的黑條）。

我的問題是，我們可以用PhoneGap解決這個問題嗎？響應式CSS能夠處理這個問題嗎？使用CSS3媒體查詢等？或者我們是否必須從頭開始制定Objective-C應用程序？

乾杯！

來源

2012-01-24 andrewpthorp

從我的經驗來看，Media Queries在PhoneGap中的工作非常糟糕。例如當PhoneGap的設置，你在你的index.html頁面如下：

<link media="only screen and (max-device-width: 480px)" href="css/iphone.css" type="text/css" rel="stylesheet" /> 
<link media="only screen and (max-device-width: 1024px)" href="css/ipad.css" type="text/css" rel="stylesheet" />

我無法得到它的工作無論我如何改變了一些事情，我最後不得不使用條件CSS來添加以下javascript：

loadDeviceStyle: function() { 
    $("head").append("<link>"); 
    css = $("head").children(":last"); 
    css.attr({ 
    rel: "stylesheet", 
    type: "text/css", 
    href: 'css/' + Utils.device() + '.css' 
    }); 
}

這顯然不夠理想。我還發現viewport設置是一個主要的麻煩，不得不圍繞它編碼。雖然這可能是我的錯誤，但文檔並沒有幫助我清理問題，所以請準備花時間在這個問題上。

說了這麼多 - 因爲PhoneGap很容易設置，所以我會試着爲你想要做的事情創建一個概念證明。你花時間回答這個問題肯定會減少頭痛。

來源

2012-01-24 17:47:57

我結束了使用「ExternalScreen」插件，我告訴它加載什麼HTML。我用它自己的樣式表加載了一個'單獨的'html文件。在JS獲得它之前，基本上按照你所說的去做。 – andrewpthorp

很好找。對於其他人來說，ExternalScreen的網址是：https：//github.com/phonegap/phonegap-plugins/tree/master/iPhone/ExternalScreen –

使用PhoneGap在第二個屏幕（HD）上鏡像iPad

回答

相關問題