iT邦幫忙

2022 iThome 鐵人賽

DAY 14
0
Mobile Development

Flutter Developer Learning SwiftUI系列 第 14

Flutter Developer Learning SwiftUI. @State var lesson14 = "形狀"

  • 分享至 

  • xImage
  •  

Today Preview

Yes

1.

我一開始是這麼寫的
但是Shape們並不直接Conform View這個Protocol
所以變成AnyView之後型別被擦除了
就無法使用Shape的Modifier(就算用as!也就無法再變回去)
而iOS16有出一個AnyShape
應該就可以用我這種寫法了

2.


今天主要介紹這六種Shape
而Shape最常見的用途
就是用.clipShape()幫View修飾成想要的形狀
就像Flutter的Container用decoration的shape屬性一樣☘️☘️☘️

3.

在這個function裡
我幫shape套用了三種不同的漸層
分別是最常見的線性LinearGradient、
同心圓的RadialGradient、
跟放射狀的AngularGradient

並幫shape套用了邊線
但很尷尬的一點是
有些邊線Modifier會把Shape變成View
如果這時要幫shape上色
就不能再用.fill()
就要用.background() + .clipShape()
是不是很囉唆?

而邊線的Modifier分為
stroke 跟 strokeBorder 兩種
stroke是加在shape外;strokeBorder是加在shape內
但strokeBorder只有InsettableShape才能用

最後展示了模糊
使用.blur()即可
大家可以玩看看效果

Tomorrow Preview

Yes


https://github.com/mark33699/FDLS


上一篇
Flutter Developer Learning SwiftUI. @State var lesson13 = "顏色"
下一篇
Flutter Developer Learning SwiftUI. @State var lesson15 = "其他View"
系列文
Flutter Developer Learning SwiftUI30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言