animation - 从实际大小而不是 0 SwiftUI 缩放形状
问题描述
我正在尝试为我正在使用 swiftui 制作的应用程序制作脉冲动画。我想要一个中心灰色圆圈来脉冲。目前,外部圆圈从 0 开始缩放,但我希望它们从中间圆圈大小开始。这是我当前的代码:
import SwiftUI
struct Pulse: View {
@State var animate = false
@State private var scale: CGFloat = 2
var body: some View {
ZStack
{
Circle()
.fill(Color.black)
.frame(width: 130, height: 130)
Circle()
.stroke(Color.red.opacity(0.1), lineWidth: 5)
.frame(width: 300, height: 300)
.scaleEffect(self.animate ? 1 : 0)
Circle()
.stroke(Color.red.opacity(0.15), lineWidth: 5)
.frame(width: 266, height: 266)
.scaleEffect(self.animate ? 1 : 0)
Circle()
.stroke(Color.red.opacity(0.2), lineWidth: 5)
.frame(width: 232, height: 232)
.scaleEffect(self.animate ? 1 : 0)
Circle()
.stroke(Color.red.opacity(0.3), lineWidth: 5)
.frame(width: 198, height: 198)
.scaleEffect(self.animate ? 1 : 0)
Circle()
.stroke(Color.red.opacity(0.35), lineWidth: 5)
.frame(width: 164, height: 164)
.scaleEffect(self.animate ? 1 : 0)
Circle()
.stroke(Color.red.opacity(0.4), lineWidth: 5)
.frame(width: 130, height: 130)
.scaleEffect(self.animate ? 1 : 0)
Circle()
.fill(Color.gray)
.frame(width: 130, height: 130)
}
.frame(width: 290, height: 290, alignment: .center)
.onAppear(perform: {
self.animate.toggle()
})
.animation(Animation.linear(duration: 6).repeatForever(autoreverses: true))
.ignoresSafeArea()
}
}
解决方案
内圆与外圆的大小之比为130 / 300
。在最小的情况下,您希望宽度和高度为 的圆300
为130
。
更改所有这些:
.scaleEffect(self.animate ? 1 : 0)
到:
.scaleEffect(self.animate ? 1 : 130 / 300)
推荐阅读
- c - 如何理解 O_RDONLY = 0?
- firebase - 如何在启动时解决 Firebase CLI 错误
- typescript - 如何按时间倒序对 create-daml-app 项目中的消息进行排序?
- c++ - Why libraries automatically added?
- java - 从十进制转换为二进制Java错误
- mysql - Laravel 组和显示热门关系
- angular - Access-Control-Allow-Headers 在使用 .net core 和 angular 的预检响应中不允许请求标头字段授权
- python - Python - 从其他两个不同形状的数据框创建新数据框的最佳方法?
- c# - dll 和 pdb 已加载,但“没有为此文档加载任何符号
- r - R中的种子限制