有時候可用 UIWebView 代替 UITextView，解决行間距問題
2011-12-10 — Unmi
我們在使用 UILabel 或是 UITextView 時，如果文字出現了換行，目前我還不知道如何去控制行間距，固定的 Label 文字 可以折成兩個 Label 上下顯示，但是對應大段顯示的段落要多行顯示時該如何呢，多行單獨控制就變得不現實了。
由於 UILabel 或 UITextView 並不提供對行間距 line-height 的設置，要達成所願指定行間距的方法，我可以想到三種方式：
1. 自定義相應的控件，在控件內部方法中去做文章，未實踐，可能是個好方法
2. 修改字體，由於默認行間距是由字體本身特性决定的，所以可以修改字體來滿足有限的需求，不是很現實
3. 用 UIWebView 來代替 UITextView，這是本文的思想
先看個圖片，看看在使用某些字體時失控的行間距是什麼样的效果：
說明：上圖左邊是用 UITextView 來顯示一段文字，由於行間距不可控，不是我們想要的。右邊就是用 UIWebView 來顯示的同一段文它，它的行間距我們可以隨意控制。
思才過程是這样的，對於 UITextView 多行文字顯示時行間距不能直接用代碼來設置，特別是對於某些字體來說行間距確有些誇張。然後首先想到的解决方式是創建自己的 UITextView 子類，重新實現某些方法，似乎不那麼容易。
進而也不能不研究，這默認的行間距內部是由什麼控制着的，是字體，看用 FontCreator 打開的一個字體文件中的字符：
看字體的 WinAscent, WinDescent 在上下决定了字符上下間的距離了，所以你當然可以修改字體文件的屬性了，存成新的字體文件，那如果一個應用中會有多種行間距的話那就痛苦了，且不說中文字體文件都不算小的。
再就是想到 Web 中的 CSS 對字體什麼想怎麼就怎麼，所以想到用 UIWebView 來代替 UITextView，而且 iOS 下的 Safari 對 HTML5 也支持的不錯，那就嘗試吧，不過首先得解决下面幾個問題：
1. 可以使用本地字體，因为自己的應用中可能會加入自定義的字體，不僅僅是用系統字體，HTML5 可以支持服務器端字體，用 @font-face
2. 像 UITextView 那样背景要能透明化，HTML5 支持 rgba 附加 Alpha 通道來指定顏色，且可設置 opacity, transparent 样式
下面貼下我的解决辦法及步驟，如果在設置样式上還有新方法，可繼續發掘。
第一步：引入自定義字體，一個 ttf 文件
把你的字體文件添加到項目中去，然後在項目的 Target 的 Info 標簽頁中，添加到 Fonts provided by application 屬性中，如圖：
在 Fonts provided by application 中添加一項 Item 0，並指定字體文件，可添加多個，每個字體文件的 Font-Family 名稱你應要知道。
第二步：添加 UIWebView，並對 WebView 應用如下代碼：
|
01
02
03
04
05
06
07
08
09
10
11
12
13
|
//下面兩行協助 UIWebView 背景透明化，這兩屬性可以在 xib 中進行設置
webview.backgroundColor = [
UIColor
clearColor];
//但是這個屬性必須用代碼設置，光 xib 設置不行
webview.opaque =
NO
;
//這行能在模擬器下明下加快 loadHTMLString 後顯示的速度，其實在真機上沒有下句也感覺不到加載過程
webview.dataDetectorTypes =
UIDataDetectorTypeNone
;
//下面的 backgroud-color:transparent 結合最前面的兩行代碼指定的屬性就真正使得 WebView 的背景透明了
//而後的 font:16px/18px 就是設置字體大小为 16px, 行間距为 18px，也可用 line-height: 18px 單獨設置行間距
//最後的 Custom-Font-Name 就是前面在項目中加上的字體文件所對應的字體名稱了
NSString
*webviewText = @
""
;
NSString
*htmlString = [webviewText stringByAppendingFormat:@
"%@"
, textview.text];
[webview loadHTMLString:htmlString baseURL:
nil
];
//在 WebView 中顯示本地的字符串
|
執行之後顯示的就是第一個圖中的效果了。有可能出現在 iOS4 下背景未能透明化的問題，是可能，我有碰到過，也許哪裏設置的問題。
注 意，很重要的一點，上面 iOS4 下背景可能不透明的情況是因为：雖然可以在 xib 中對 UIWebView 設置它的 backgroundColor 为 clearColor，但是 Xcode 似乎不怎麼認账，所以必須在代碼中用 webview.backgroundColor = [UIColor clearColor]; 設置 UIWebView 的背景才成，opaque 在 xib 還是在代碼中設置都行。
另外，也可以用 background-color: rgba(0,0,0,0) 样式，最後一個 0 表示 Alpha 值，即完全透明，甚至是用 background-color:hsla(120,50%,50%,0) 也是可行的。
對於 UIWebView 來說，你能夠應用 HTML5 很多特性，所以不要求有很規範的 HTML 格式，像無需寫成
....... 那样。嘗試了用 @font-face 來使用自定義字體，未能成功，再就是對 UIWebView 的用戶交互及滾動條風格調一調，可讓它更像是個 UITextView，完全的代替 UITextView 來顯示一段文字某些地方有可能仍需作微調。