iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 26
1
自我挑戰組

Hey! UIKit, 做個朋友吧~系列 第 26

Day 26: 要被通緝了啊啊啊UITextView你等等我先發文再說

  • 分享至 

  • xImage
  •  

今天要講的是text view的attribute。
但情勢緊急來不及想標題,只好反映我最真實的心靈寫照。

Attributes

Text / Attribute Text

text相信大家不陌生,就是text view裡存取文字的變數,但attribute text又是指什麼?
attribute text是個有型的text view內文,是一串文字帶著一個NSAttributedString.Key與value的dictionary去對文字的格式進行指定。

newTextView.text = "BestMeowkaiGoodideas"
newTextView.attributedText = NSAttributedString(string: "不服來辯", attributes: [NSAttributedString.Key.foregroundColor : UIColor.white,  NSAttributedString.Key.backgroundColor : UIColor.blue, NSAttributedString.Key.font : UIFont.systemFont(ofSize: 50, weight: .bold)])


而text與attribute text儲存的文字是共通的,當你定義attribute text時,也會同時取代text裡儲存的文字,即便你殺小都沒定義。同樣的當你定義text時,也會取代attribute text裡儲存的文字,但NSAttributedString.Key會被沿用。

Font / Color / Alignment

font指定字體字型大小等等的UIFont的參數。
textColor指定內文顏色。
textAlignment指定內文的對齊方式。

這個demo過很多次囉,剛剛在attribute text也有提到,就不再demo了。

Edit

isEditable定義text view能否被編輯,預設值為true。
allowsEditingTextAttributes,定義內文的attribute能否被使用者修改。如果為true,則選取文字時將會出現編輯欄(下圖左),預設值為false(下圖右),大家有發現差別嗎?

Data Detector / Link Text Attributes

有時候發出去的文字,忽然就變成了超連結,那是設定了資料偵測。
UIDataDetectorTypes裡有很多種類型的資料(地址、電話、網址等等)。為dataDetectorTypes指定UIDataDetectorTypes,當text view偵測到該類型的資料時,就會自動轉換成相對應的超連結。
另外需要注意的是,在isEditable的狀態下並不會啟用資料偵測。由於isEditable的預設值為true,所以需要手動定義他為false才能生效。

newTextView.isEditable = false
newTextView.dataDetectorTypes = UIDataDetectorTypes.phoneNumber
newTextView.text = "抄下我的電話號碼,是香港3345678,我再重複一次,是香港3345678,你不找我我沒關係,因為這將是你的損失,10點鐘以後你不要打來,因為我睡了~"


這時候應該會有人想說:怎麼好像哪裡怪怪的?跟我們平常看到的超連結不太一樣?平常看到的都有底線啊!
其實底線在apple並不是原生的,而是透過linkTextAttributes指定一個NSAttributedString.Key與value的dictionary來定義的。

newTextView.linkTextAttributes = [NSAttributedString.Key.foregroundColor : UIColor.blue, NSAttributedString.Key.underlineStyle : NSUnderlineStyle.single.rawValue]


這樣是不是就有熟悉的感覺了呢?

Typing

typingAttributes也是一個NSAttributedString.Key與value的dictionary,定義了使用者接下來要輸入的文字特性。

newTextView.typingAttributes = [NSAttributedString.Key.foregroundColor : UIColor.black, NSAttributedString.Key.font : UIFont.italicSystemFont(ofSize: 30)]

Container Inset

textContainerInset決定了內文與text view外框的間距,預設值為(top: 8, left: 0, bottom: 8, right: 0)。

newTextView.textContainerInset = UIEdgeInsets(top: 0, left: 36, bottom: 0, right: 36)

下一回是text view的完結篇。


上一篇
Day 25: 你怎麼好像有點眼熟啊UITextView?
下一篇
Day 27: 文字終結之時-UITextView
系列文
Hey! UIKit, 做個朋友吧~30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言