FPS падает с границей углового градиента во время анимации Swiftui ⇐ IOS

[Anonymous]

Я добавляю границу и размытый эффект на форму во время анимации (корневой вид, появляющийся на странице) и вижу, как FPS падает при использовании угловой диагностики в качестве цвета границы. Я не вижу капель при использовании нормального цвета. Падение заметно при настройке устройства в режим «низкая батарея».

Код: Выделить всё

struct BorderBlur: ViewModifier {
var fillColor: some ShapeStyle {
AngularGradient(
colors: [.blue, .purple, .green, .blue],
center: .center)
.opacity(borderOpacity)
}

var myShape : some Shape {
RoundedRectangle(cornerRadius:36)
}

let borderWidth : CGFloat
let blurRadius: CGFloat
let borderOpacity: CGFloat

init(borderWidth: CGFloat, blurRadius: CGFloat, borderOpacity: CGFloat) {
self.borderWidth = borderWidth
self.blurRadius = blurRadius
self.borderOpacity = borderOpacity
}

public func body(content: Content) -> some View {
content
.overlay(
myShape
.stroke(lineWidth: borderWidth)
.fill(fillColor)
.padding(borderWidth)
)
.overlay(
myShape
.stroke(lineWidth: borderWidth)
.fill(fillColor)
.blur(radius: blurRadius)
.padding(borderWidth)
)
.overlay(
myShape
.stroke(lineWidth: borderWidth)
.fill(fillColor)
.blur(radius: blurRadius / 2)
.padding(borderWidth)
)
}
}

extension View {
public func borderBlur(borderWidth: CGFloat, blurRadius: CGFloat, borderOpacity: CGFloat) -> some View {
return modifier(BorderBlur(borderWidth: borderWidth, blurRadius: blurRadius, borderOpacity: borderOpacity))
}
}

struct MyRootView: View {

@State var didAppear = false
var borderWidth: CGFloat {
didAppear ? 3 : 0
}
var borderBlurRadius: CGFloat {
didAppear ? 10 : 0
}
var borderOpacity: CGFloat {
didAppear ? 1 : 0
}

var body: some View {
VStack {
RoundedRectangle(cornerRadius:36).fill(.clear)
.borderBlur(borderWidth: borderWidth, blurRadius: borderBlurRadius, borderOpacity: borderOpacity)
.frame(width: didAppear ? 300 : 100, height: didAppear ? 400 : 100)
.offset(y: didAppear ? 0 : -400)
}
.onAppear {
withAnimation(.linear(duration:2.0)) {
didAppear = true
}
}
}
}

Если я изменяю заполнение на стандартный цвет, такой как Color.blue , я не вижу, чтобы FPS не ударил. Есть идеи относительно того, как сделать градиент более эффективно? Я попытался trawngroup () , который улучшает FPS, но это делает Blur плохо, и я также хочу иметь возможность анимировать размер размытия (+ ширина границы, непрозрачность).

Подробнее здесь: https://stackoverflow.com/questions/795 ... -animation