如何在SwiftUI中生成内阴影
如何在SwiftUI中生成内阴影
提问于 2020-02-07 13:43:22
我想在SwiftUI中设置视图(文本、按钮等)的内部阴影
在SwiftUI中有外部阴影，但没有内部阴影
我想要做的是使用SwiftUI制作新孤儿用户界面
Michal Malewicz“用户界面中的新孤儿”
我想按下用户界面按钮
但我不知道从哪里开始制造内心的阴影
回答 3
Stack Overflow用户
回答已采纳
发布于 2020-02-24 00:17:11
这就是我所做的，以创造一个内在的阴影，像在图片中的一个。我在另一个迅捷文件中创建了它，只是在我的主要内容视图中调用它，但是您可以随意显示它。
我在ZStack中创建了Button，只是因为我第一次用圆角矩形重新创建它，但我认为在HStack或VStack中也会这样做，只是还没有尝试过。为了创建内部阴影，我创建了一个覆盖，并将阴影裁剪成形状。
ZStack{
Button(action: {}){
Image(systemName: "heart.fill")
.resizable()
.frame(width: 40, height: 40)
.padding(25)
.foregroundColor(Color(red: 52/255, green: 57/255, blue: 133/255))
.overlay(
RoundedRectangle(cornerRadius: 15)
.stroke(Color(red: 236/255, green: 234/255, blue: 235/255),
lineWidth: 4)
.shadow(color: Color(red: 192/255, green: 189/255, blue: 191/255),
radius: 3, x: 5, y: 5)
.clipShape(
RoundedRectangle(cornerRadius: 15)
)
.shadow(color: Color.white, radius: 2, x: -2, y: -2)
.clipShape(
RoundedRectangle(cornerRadius: 15)
)
)
.background(Color(red: 236/255, green: 234/255, blue: 235/255))
.cornerRadius(20)
}最终结果如下：
你可以玩周围的颜色和阴影，以得到准确的你想要的，但希望这有帮助！
Stack Overflow用户
发布于 2022-06-08 23:55:44
仅限iOS 16+
为纽扣
您可以使用SwiftUI形状作为背景。
内部阴影使用.fill(.shadow(.inner(radius: 1, y: 1)))。
形状的.foregroundColor是按钮的背景色。
下面是我的例子，使用pawelo2222的答案。
对于与问题相同的RoundedRectangle按钮
Button(action: {}){
Image(systemName: "heart.fill")
.resizable()
.frame(width: 40, height: 40)
.padding(25)
.foregroundColor(Color(red: 52/255, green: 57/255, blue: 133/255))
.background(
RoundedRectangle(cornerRadius: 20, style: .continuous)
.fill(
.shadow(.inner(color: Color(red: 197/255, green: 197/255, blue: 197/255),radius: 3, x:3, y: 3))
.shadow(.inner(color: .white, radius: 3, x: -3, y: -3))
)
.foregroundColor(Color(red: 236/255, green: 234/255, blue: 235/255)))
}
}
用于圆环按钮
Button(action: {}){
Image(systemName: "heart.fill")
.resizable()
.frame(width: 40, height: 40)
.padding(25)
.foregroundColor(Color(red: 52/255, green: 57/255, blue: 133/255))
.background(
Circle()
.fill(
.shadow(.inner(color: Color(red: 197/255, green: 197/255, blue: 197/255),radius: 5, x:3, y: 3))
.shadow(.inner(color: .white, radius:5, x: -3, y: -3))
)
.foregroundColor(Color(red: 236/255, green: 234/255, blue: 235/255)))
}
Stack Overflow用户
发布于 2022-06-06 22:23:17
iOS 16+
现在有一个新的ShapeStyle名为shadow
在文档中，下面的示例创建一个使用内部阴影的当前前景样式填充的圆圈：
Circle().fill(.shadow(.inner(radius: 1, y: 1)))在大多数情况下，当前样式是前台，但并不总是如此。例如，当设置背景样式的值时，它将成为当前的隐式样式。
Circle()
.fill(.shadow(.inner(radius: 1, y: 1)))
.foregroundStyle(.red)页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/60114699
复制相关文章
相似问题
腾讯云开发者
