Fehler durch UI-Element blinkend

Question

Ich habe eine Ansicht, wo der Benutzer eine Auswahl treffen muss, bevor eine Schaltfläche funktioniert. Um dies deutlicher zu machen, möchte ich, dass das Element, das die Auswahl darstellt, die ausgeführt werden muss, blinkt, wenn der (ausgegraute) Knopf zuerst gedrückt wird. I.e. Ich möchte darauf hinweisen, dass dies ein Fehler in diesem Status ist, und den Benutzer auf das Benutzeroberflächenelement aufmerksam machen, das er zuerst verwenden muss.

Mein aktueller Versuch, das Element (self.display im Code unten) haben zwei Mal schnell zu blinken ist die folgende:

@IBAction func inactiveButtonClick() { 
    let period = 0.16 

    UIView.animate(withDuration: period/2, delay: 0.0, options: [.curveEaseInOut, .autoreverse, .repeat], animations: { 
     self.display.alpha = 0 
    }, completion: { _ -> Void in 
     self.display.alpha = 1 
    }) 

    DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + period*2, execute: { 
     self.display.layer.removeAllAnimations() 
    }) 

} 

Das funktioniert ganz gut, aber fühlt sich nicht 100% richtig, und Die Animation wird manchmal Sekundenbruchteile abgeschnitten, bevor sie endet. Ich denke, ich könnte zwei Animationen in die Warteschlange stellen, aber ich frage mich, ob es einen einfacheren Weg gibt, dies zu erreichen. Gibt es eingebaute Möglichkeiten, ein UI-Element blinken zu lassen, um auf einen Fehler hinzuweisen? Wenn nicht, gibt es irgendwelche "bekannten guten" Kombinationen von Kurven und Frequenzen, die dies einem Benutzer vermitteln?

Answer 1

Keyframe Animationen wirken wie eine perfekte Passform in diesem Szenario:

UIView.animateKeyframes(withDuration: period, delay: 0.0, options: [], animations: { 
    UIView.addKeyframe(withRelativeStartTime: 0.0, relativeDuration: 0.5, animations: { 
     self.display.alpha = 0 
    }); 
    UIView.addKeyframe(withRelativeStartTime: 0.5, relativeDuration: 0.5, animations: { 
     self.display.alpha = 1 
    }); 
}, completion: nil); 

So können Sie zunächst mit einer Dauer von Zeit eine Keyframe-Animation erstellen. Innerhalb des Animationsblocks können Sie benutzerdefinierte Keyframeanimationen hinzufügen, indem Sie die relative Startzeit angeben (zwischen 0 und 1 - 1 am Ende der Keyframeanimation, also die Dauer).

Also zuerst wir Animation hinzufügen, die am Anfang beginnt und ihre relative Dauer ist 0.5 so 1/2 der gesamten Animationsdauer. Die zweite Animation beginnt, wenn die Animation zur Hälfte der Gesamtanimation abgeschlossen ist und für den Rest 1/2 der Animationszeit fortgesetzt wird.

Hoffe, das hilft