昨天介紹了 modifier 但是還有幾個特性沒有解釋,今天就來說明一下。
當你多次使用同一個 modifier 時,要注意一下 modifier 的位置。
直接來看看實際情況,原本 VStack 下面已經加了 .font(.largeTitle) 這個 modifier 那我今天再在 Text 下面再加一個 .font(.caption) 會發生什麼事?
可以看到 Text 無視 VStack 下的 modifier 的設定,字體明顯小了許多,讓我們再加一個相同的 modifier,這次直接加在 .font(.caption) 下面。
可以看到 Text 的字並沒有變大,這是因為相同 modifier 在設定同一個 View 時,會以最先設定的 modifier 為主。
上面有說到 modifier 不會覆蓋掉已經設定好的 View,但是有些 modifier 雖然不會覆蓋,但是它的值是可以重複疊加的。
現在來看看這個情況,Text 原本就有 .padding() 這個 modifier,現在在下面再加幾個 .padding() 會發生什麼事?
可以看到,三個 View 之間的間距變的超級大,這是因為 .padding() 這個 modifier 的值是可以重複疊加的,也就是説,你加上越多 .padding(),間距就越大。
了解完三個特性之後,來介紹下一個特性:有些 modifier 會跟特定的 View 綁定在一起,這裡指的綁定意思是這個 modifier 只能用來修飾某個特定的 View,其他都不行。
舉個例子:.resizable()
.resizable() 這個 modifier 是只能用在 Image 這個 View 上。
如果用在其他地方會變成這樣,直接給你報錯,他還很嚴格 .resizable() 也不能加在 modifier 的後面,詳細原因後面會提到。
所以當你在使用 modifier 的時候,要注意使用的位置及數量,那今天就到這裡,明天來介紹 some View 這個神奇的東西。