如何在同一行,也就是同一個 UILabel 中,顯示不同字體顏色、大小、字型等,或者是在文字中加入刪除線。
你可以使用多個 UILabel 來達成,但是這樣寫起來你應該也覺得既不美觀又不專業吧XD!
就讓我們來看看,在同一個 UILabel 該如何指定不同的形式吧~~~
本篇內容會提到:
- NSMutableAttributedString 常見屬性與用法
- 如何顯示不同字型大小、顏色?
- 如何在文字中加入刪除線、底線?
- 如何在文字當中加入陰影、外框顏色?
- 如何讓文字斜體以及調整間距?
NSMutableAttributedString 常見屬性
NSMutableAttributedString 用法
func addAttribute(NSAttributedString.Key, value: Any, range: NSRange)
這種 addAttribute
方式呢,每次可以增加一種設定屬性。
以下使用
addAttribute
為例:
- 文字設定為Hello Youtube
- 將 Youtube 字體改為紅色
- 將 Youtube 改為特殊字型以及放大文字為50
成果如下:
如果我們需要修改很多項目就必須一直 addAttribute
func setAttributes([NSAttributedString.Key : Any]?, range: NSRange)
這種 setAttributes
方式呢,每次可以增加多種設定屬性,可以使用 [NSAttributedString.Key : Value
] 在其中增加多種設定屬性。
那現在我們使用setAttributes
一次增加多種設定屬性。
以下使用
setAttributes
為例:
接下來開始對個別屬性做介紹吧~~~
如何顯示不同字型大小、顏色?
- 字體大小 — .font, Value: UIFont
- 字體顏色 — .foregroundColor, value: UIColor
- 背景顏色 — .foregroundColor, value: UIColor
range: NSMakeRange — 調整想要在文字當中哪裡到哪裡有更改
range: NSMakeRange(0, attributedString.length) 代表全部文字都做更改
成果如下:
如何在文字中加入刪除線、底線?
- 刪除線 — .strikethroughStyle
- 刪除線顏色 — .strikethroughColor
- 底線 — .underlineStyle
- 底線顏色 — .underlineColor
成果如下:
如何在文字當中加入陰影、外框顏色?
- 文字陰影 須建立NSShadow()
- 陰影顏色 —shadowColor
- 陰影寬高度 —shadowOffset = CGSize(width: , height: )
- 陰影暈染程度 —shadowBlurRadius
- 陰影寬高度、暈染程度 數值不同,效果不同,可以自行試試玩玩~~~
成果如下:
- 外框顏色 — .strokeColor
- 外框寬度 — .strokeWidth
- 寬度需>0才會有效果
- 如果只有設定顏色而寬度為0則無效
- 寬度 正數與負數 皆可,效果不同,可以自行試試玩玩~~~
- 通常寬度<5 文字會有中空效果,數值越大字體越粗。
成果如下:
如何讓文字斜體以及調整間距?
- 字體斜體 — .obliqueness
- 正值右斜,負值左斜, 預設0不傾斜
// Hello 往右斜
attributedString.addAttribute(.obliqueness, value: 1, range: NSMakeRange(0, 5))// Youtube 往左斜
attributedString.addAttribute(.obliqueness, value: -1, range: NSMakeRange(6, 7))
成果如下:
- 文字間距 — .kern
//文字間距
attributedString.addAttribute(.kern, value: 20 , range: NSMakeRange(6, 6))
成果如下:
在文字中加入插圖&網址連結
- 文字附件(圖)
- 文字網址連結
這部分可以看下篇文章
完整Github專案