2011-11-10 117 views
7

我正在使用phonegap將一個非常簡單的html5頁面導出到iPhone應用程序並運行到這個愚蠢的問題。瞭解iPhone的分辨率

iPhone分辨率爲960x640。

當我將畫布設置爲這些尺寸時,它看起來太大了。

<canvas width="960" height="580" style="background-color:#607559"></canvas> 

這是爲什麼?我怎樣才能利用iphone4的全高清功能。看起來,如果我將畫布設置爲較老的iPhone(320×480),畫布就適合全屏顯示。

將視口設置爲這樣的東西似乎工作,但這會是一個性能打擊?

<meta name="viewport" content="width=device-width, height=device=height, initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=no" /> 
+0

我的回答有幫助嗎? – Oliver

回答

4

這取決於你在說哪個iphone。

舊iPhone 3GS的分辨率爲320x480。更新的iPhone 4和iPhone 4s具有所謂的視網膜顯示器,其分辨率爲640x960,但會自動放大(您不能獨立訪問像素)。

但是,您可以將設備像素比率設置爲很好的覆蓋帆布這樣一個問題:Canvas drawing and Retina display: doable?

+0

丹尼爾。感謝您的答覆。這是一個iPhone4,window.devicePixelRatio返回值'1'。我仍然沒有關注如何讓iphone4充分利用它展示更大的960x640畫布。 – Skylervich

+0

這很奇怪,我唯一能想到的就是視口元標記上的縮放因子在某種程度上影響了這一點。你可以將它設置爲1.0並重試? –

+0

我已經將視口元設置爲1.0,並試圖徹底刪除它。在這兩種情況下,window.devicePixelRatio = 1和canvas在iPhone上看起來都很大,幾乎是屏幕大小的兩倍。 – Skylervich