iOS UIView shadow

最近在寫的專案,使用到比較多的陰影效果,就來列列有關陰影效果的一些內容。

CALayer

陰影相關的實作方式,是以 CALayer 底下的這五個變數來控制

  • shadowColor: CGColor?
  • shadowPath: CGPath?
  • shadowOffset: CGSize
  • shadowRadius: CGFloat
  • shadowOpacity: Float

shadowColor

預設值為不透明的黑色,我們可以透過這個參數來調整陰影的顏色。

shadowPath

預設值為 null,並支援 animated,可以在這邊調整陰影的路徑, 所以當 UIView 在透過 animated 調整大小時,我們可以一併調整 shadowPath 來跟著做變化。

shadowOffset

預設值為 [0, -3],來調整陰影的位移。

shadowRadius

預設值為 3,系統本身會進行發散的動作。

shadowOpacity

預設值為 0,也就是完全透明; 所以如果只是要陰影,並沒有需要客製化的話, 只需要修改 shadowOpacity,畫面上就會有 offset = [0, -3], radius = 3 的不透明黑色陰影出現。

cornerRadius

這邊有點需要注意到的是,若要有 shadow 效果的話,下面兩者必須為 false

  • layer.masksToBounds
  • clipsToBounds

因為若將 layer 只關閉在 bounds 的話,則無法呈現陰影的效果; 但偏偏若需要圓角效果的話,則必須更改為 true。 而這邊,我的做法是, 先建立一個透明色的 UIView,來做陰影的效果, 再疊加一層 subview 來做圓角的效果, 這樣便可以做出有陰影效果的圓角 UIView 了!

Licensed under CC BY-NC-SA 4.0
comments powered by Disqus