IOS之支持高分辨率的顯示屏(譯文)

       基於IOS SDK 4.0及之後版本的應用程序須要可以在不一樣分辨率的設備下運行。IOS以一種簡單的方式能夠支持多分辨率屏幕的狀況。大部分處理不一樣類型屏幕的工做已經由系統框架處理。但應用程序自己也須要作些工做來修正位圖圖片,若是應用自己要利用像素,也須要作額外的工做。

支持高分辨率顯示屏的清單

爲了適應具備高分辨率顯示屏的設備,須要作以下幾項:

  • 在應用程序包中,爲每一個圖片資源提供高分辨的圖片
  • 爲應用和文檔圖標提供高分辨率的圖片
  • 基於矢量的圖形和內容,要如之前同樣繼續使用Core Graphics和UIKit的drawing代碼
  • 直接使用Core Animation圖層時,在繪畫以前可能須要調整比例係數(scale factor)
  • 使用OpenGL ES進行繪畫,要判斷是否須要加入高分辨率繪畫支持,要合理的設置圖層的比例係數
  • 對於建立的自定義圖片,須要更新建立圖片的代碼,要考慮比例係數的影響
  • 若是應用中直接提供了Core Animation圖層的內容,要按須要調整代碼

無償獲得的繪畫優化

       IOS中的繪畫技術提供了強大的支持,幫助開發者以最佳的方式渲染繪畫內容,而無論當前顯示屏所處的是何種分辨率。
  • 標準的UIKit views(text views , buttons , table views , 等等)在任何分辨率下會保證正確的渲染
  • 基於矢量的內容(UIBezierPath , CGPathRef,PDF)自動充分利用任何額外的像素點來修復圖形線條的鋸齒。
  • 文本(Text)在高分辨率下自動補齊鋸齒。
  • UIKit支持自動加載爲高分辨率準備的圖片(@2x)
       現存的繪畫代碼之因此能以正常的方式工做,是由於本地的繪畫技術,如Core Graphics已近考慮了當前的比例係數。例如,若是view實現的 drawRect:方法,UIKit自動將當前屏幕的比例係數值設置到view中。此外,在繪畫過程當中,UIKit自動修正任何繪畫環境使用的當前旋轉矩陣(current tansformation matrix CTM),考慮view的比例係數。以後利用 drawRect方法生成的內容會在當前設備屏幕下以合適的比例進行縮放。

       若是應用程序只使用本地的繪畫技術來渲染其內容,惟一要作的是爲使用的圖片提供高分辨率的版本。只使用系統的view或只依賴矢量內容的應用能夠不用作任何修改。可是使用了圖片的應用程序在高分辨率顯示屏下,須要提供這些圖片的新版本。尤爲注意的是,要將圖片放大兩倍,在水平和豎直方向上提供兩倍於原來數量的像素,總的來講是要提供四倍的像素。

更新圖片資源文件

運行在IOS4的應用程序如今要爲每張圖片提供兩個單獨的文件。一個用於標準分辨率下,另外一個用於高分辨率。每組圖片的命名約定以下:

  • 標準版: <ImageName><device_modifier>.<filename_extension>
  • 高分辨率版: <ImageName>@2x<device_modifier>.<filename_extension>
<ImageName>和<filename_extension>部分指定了文件的普通名稱和擴展名。<device_modifier>部分是可選的,能夠在字符串~ipad和~iphone兩者中選一。這兩個標識符能夠爲iPad和iPhone同一個文件的不一樣版本。新增的@2x標識符代表圖片應用於高分辨率,系統知道該圖片是標準圖片在高分辨率下的變體。
須要注意,建立高分辨率版本的圖片須要與原始版本的圖片放在application包下的同一位置。

加載圖片到應用程序中

       UIImage類處理了全部須要加載高分辨率圖片到應用中的工做。當建立一個新的image對象後,只要以一樣的名稱來同時請求圖片的標準版和高分辨率版便可。例如,若是有兩張圖片文件,名爲Button.png和Button@2x.png,只要用如下代碼請求圖片便可:

UIImage* anImage = [UIImage imageNamed:@"Button"];

注意,在IOS4及之後的版本,能夠省略文件擴展名而只提供圖片名稱便可。

       在高分辨率顯示屏下, imageNamed:, imageWithContentsOfFile:, 和initWithContentsOfFile: 方法自動查找具備@2x名稱的圖片。若是找到,則會加載該圖片。若是沒有提供給定圖片的高分辨率版本,image對象仍會加載標準版的圖片資源,並在繪畫過程當中將其縮放。

       注意,若是使用Core Graphics建立圖片,謹記Quartz圖片並無一個顯示的比例係數,它們的比例係數會假定爲1.0.若是從 CGImageRef數據類型中建立UIImage對象,須要使用 initWithCGImage:scale:orientation:方法來執行該建立操做。該方法容許添加一個指定的比例係數到Quartz圖像數據中。

UIImage對象在繪畫過程當中會自動考慮自身的比例係數。這樣,只要在程序中提供正確的圖片資源,任何渲染image的代碼都會正常工做。

使用Image View展現圖片

       程序中使用UIImageView對象來展現圖片,全部添加到該view的圖片必須使用相同的比例係數。可使用一個image view來展現單張圖片,或者以動畫的方式展現多張圖片,而且也能夠提供一張加亮圖片(highlight image)。所以,若是爲這些圖片中的一張提供了高分辨率版本,那麼其它的圖片也必須提供相應的高分辨率圖片。


更新應用程序圖標(Application Icons)和加載圖片(Lauch Images)

       除了要更新應用程序中的自定義圖片資源,同時也要爲應用程序的圖標和加載圖片提供新的高分辨率版本。更新這些圖片資源的過程與更新其它圖片資源的處理過程是同樣的。新建新版本的圖片資源添加@2x標識符到圖片文件名中,就像處理其它圖片同樣。例如,對於應用程序圖標,要添加高分辨率的圖片名到Info.plist文件 CFBundleIconFiles key中。

更新自定義的繪畫代碼

       在應用程序中添加任何的自定義繪畫代碼,多數狀況下是不用考慮當前設備的分辨率。本地的繪畫技術會自動保證你在邏輯座標空間下的座標系正確映射到當前設備的像素點上。然而有時,也須要了解當前的比例係數以便正確渲染內容。在這些狀況下,UIKit,Core Animation以及其它的系統框架會幫助進行正確的繪畫。

以編程方式建立高分辨率位圖圖片

       使用 UIGraphicsBeginImageContext函數建立位圖時,須要調整代碼以考慮比例係數。 UIGraphicsBeginImageContext函數一直以1.0的比例係數建立圖片。若是當前設備的顯示屏是高分辨率的,經過該方法建立的圖片在渲染時可能會顯得模糊。要建立比例係數爲其它值的圖片,須要使用 UIGraphicsBeginImageContextWithOptions。該函數的處理與UIGraphicsBeginImageContext函數的處理過程同樣。

  1. 調用UIGraphicsBeginImageContextWithOptions建立位圖繪畫環境(要添加合適的比例係數),將其push到圖形棧中
  2. 使用UIKit或Core Graphics經常使用函數來添加圖片內容
  3. 調用UIGraphicsGetImageFromCurrentImageContext 函數來獲取位圖內容
  4. 調用UIGraphicsEndImageContext 函數 將當前繪畫環境pop出繪畫棧

例如,如下代碼建立一張200*200像素的位圖。(像素點的數量由圖片大小乘以比例係數決定)

UIGraphicsBeginImageContextWithOptions(CGSizeMake(100.0,100.0), NO, 2.0);

注意,若是位圖想要在當前設備下的main screen中以合適的比例係數縮放,在調用 UIGraphicsBeginImageContextWithOptions函數只要將scale參數設置爲0.0便可。

調整本地內容適配高分辨率顯示屏

       若是想要在高分辨率下繪畫不一樣的內容,須要使用當前的比例係數來修正繪畫代碼。例如,假設有一個view畫1像素的邊框線。在比例係數爲2.0的設備上,使用 UIBezierPath對象以1.0的寬度畫該線條,將會生成2像素寬的線條。在這種狀況下,當前線條須要除以當前的比例係數來獲得1像素的寬度。
固然,基於比例係數改變繪畫參數可能致使未知結果。1像素寬的線條在某些設備上看起來是正常的,可是在高分辨率的設備上看上去會比較細以致於看起來不清晰。這須要根據具體狀況決定是否要作變更。


Core Animation Layers中的比例係數的解釋

       直接使用Core Animation layers提供內容的應用程序,須要調整代碼並考慮比例係數的影響。一般狀況下,在利用view的 drawRect:方法,或使用layer代理的 drawLayer:inContext:方法時,系統會自動考慮比例係數的影響並調整繪畫環境。可是在view執行如下幾種操做時,仍是有必要去了解或如何改變比例係數:
  • 建立額外的Core Animation layers,設置不一樣的比例係數並組合到view的內容中去
  • 直接設置Core Animation layer的"contents"
       Core Animation的集成引擎會查看每一個layer的 contentsScale屬性,決定layer的contents在集成的時候是否須要縮放。若是建立沒有關聯至view的layers,每一個新的layer對象的比例係數初始化爲1.0。若是不改變初始的比例係數,接下來直接將這樣的layer畫到高分辨率的顯示屏上去時,layer的contents會自動縮放來彌補因不一樣的比例係數所形成的差別。若是不想layer的 contents被縮放,能夠設置layer的比例係數爲2.0,可是設置完成後的內容若是沒有添加至高分辨率的顯示屏,那麼現存的內容可能會顯得比預期的要小。修復該問題,則須要在高分辨率下使用該layer便可。

       當直接設置layer的contents時,調整layer的content來適應不一樣的比例係數顯得尤其重要。Quartz的圖片直接在像素級別下工做,並不理會比例係數的設置。所以在建立CGImageRef對象來設置layer的contents以前,須要檢測當前的比例係數併合理的調整image的大小。更要指出的是,當加載application bundle中的圖片或使用 UIGraphicsBeginImageContextWithOptions函數建立圖片時,都要調整圖片的比例係數來與layer的比例係數保持一致。沒有建立高分辨率的位圖,其縮放比例的設置會按照以前說明的那樣進行設置。

注:描述於IOS5.1下,省略對OpenGL ES的描述 html

原文: Supporting High-Resolution Screens
相關文章
相關標籤/搜索