by Anonymous » 13 Apr 2025, 10:20
Ich füge während einer Animation einen Rand- und Unschärfeeffekt auf eine Form hinzu (die auf Seite angezeigt wird) und fällt FPS ab, wenn sie einen Drehgradienten als Farbe des Randes verwenden. Ich sehe die Tropfen nicht, wenn ich eine normale Farbe benutze. Der Tropfen ist beim Einstellen eines Geräts in den Modus "niedriger Akku" auffällig.
Code: Select all
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
}
}
}
}
Wenn ich das FillColor in eine Standardfarbe wie Color ändere. Blue sehe ich keine FPS -Tropfen. Irgendwelche Ideen, wie der Gradient effizienter wird? Ich habe versucht Drawinggroup () , das die FPS verbessert, aber es macht die Unschärfe schlecht, und
ich möchte auch in der Lage sein, die Unschärfe zu belasten (+ Grenzbreite, Deckkraft).
Ich füge während einer Animation einen Rand- und Unschärfeeffekt auf eine Form hinzu (die auf Seite angezeigt wird) und fällt FPS ab, wenn sie einen Drehgradienten als Farbe des Randes verwenden. Ich sehe die Tropfen nicht, wenn ich eine normale Farbe benutze. Der Tropfen ist beim Einstellen eines Geräts in den Modus "niedriger Akku" auffällig.[code]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
}
}
}
}
[/code]
Wenn ich das FillColor in eine Standardfarbe wie Color ändere. Blue sehe ich keine FPS -Tropfen. Irgendwelche Ideen, wie der Gradient effizienter wird? Ich habe versucht Drawinggroup () , das die FPS verbessert, aber es macht die Unschärfe schlecht, und [url=viewtopic.php?t=14917]ich möchte[/url] auch in der Lage sein, die Unschärfe zu belasten (+ Grenzbreite, Deckkraft).
Mobile version