项目完成后，您将能够制作下面到效果
image.png
Jietu20200223-125504.gif
本文学到技能
阴影效果制作
下面代码就是实现浮雕到核心逻辑，左上角亮右下角暗，然后背景，按钮背景，按钮前景颜色都一样，最终浮雕效果就出来了。
.shadow(color: Color.white, radius: 8, x: -8, y: -9)
.shadow(color: Color(red: 163/255, green: 177/255, blue: 198/255), radius: 8, x: 9, y: 9)
image.png
什么是Neumorphism
一图胜千言
Neumorphism风格
Neumorphism风格
2020年国外设计界开始流行一种叫 Neumorphism 的设计风格，也有人称为 Soft UI。Neumorphism 风格被的理解为新一代的拟物风潮，我们其实可以简单的叫他浮雕效果。
实战做个Neumorphism按钮
1、创建一个项目
让我们从打开Xcode 11并创建一个Single View App开始，项目名为newButton。
image.png
2、现在有了新的干净视图，让我们开始吧。删除代码并添加以下内容：
漂亮的灰色界面
我们制作了一个漂亮的灰色界面
import SwiftUI
struct ContentView: View {
var body: some View {
ZStack {
Color(red: 224/255, green: 229/255, blue: 236/255)
}
.edgesIgnoringSafeArea(.all)
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
预览效果
3、增加按钮
接下来，添加按钮，并在按钮中添加图像。将框架的宽度和高度设置为80。
import SwiftUI
struct ContentView: View {
var body: some View {
ZStack {
Color(red: 224/255, green: 229/255, blue: 236/255)
Button(action: {}) {
Image(systemName: "heart.fill")
.resizable()
.frame(width: 80, height: 80)
}
}
.edgesIgnoringSafeArea(.all)
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
现在，我们应该有这样的效果
image.png
4、让我们添加一些空间以给heart图片，并给按钮侧面留出空间，最后让边缘变圆
