SwiftUI從入門到實戰第2章第15節:RadialGradient

使用RadialGradient繪製徑向顏色漸變的背景。徑向漸變從原點開始,以橢圓形狀向外擴散,漸變由兩部分組成:橢圓和顏色組。橢圓用來控制漸變的位置和形狀,而顏色組用來控制漸變的顏色變化。


示例代碼:

//首先修改此處的文本視圖,徑向漸變將作爲文本視圖的背景。
Text("SwifUI Gradient")
    .font(.system(size: 36))//設置文本視圖的字體尺寸爲36,增加文字的尺寸。
    .padding()//設置文本視圖的間距,增加文本視圖的內邊距。接着設置文本的顏色爲白色,以突出作爲背景存在的徑向漸變。
    .foregroundColor(.white)
    //創建一個徑向漸變,設置它的起始顏色爲橙色,中間顏色爲紅色,終點顏色爲紫色。漸變中心點爲文本視圖的中心位置,起點半徑爲10,終點半徑爲120。
    .background(RadialGradient(gradient: Gradient(colors: [.orange, .red, .purple]), center: .init(x: 0.5, y: 0.5), startRadius: CGFloat(10), endRadius: CGFloat(120)))

}

查看運行結果:

《SwiftUI從入門到實戰》其它章節內容:

第3章 SwiftUI頁面佈局

第4章 SwiftUI製作漂亮的動畫

第5章 SwiftUI的交互操作

第6章 SwiftUI的頁面跳轉

第7章 SwiftUI項目實戰

第8章 SwiftUI精彩實例

第9章 SwiftUI完整項目

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章