Shazam App wie Ladebildschirm

7

Wie kann ich einen animierten Ladeeffekt wie das folgende Bild in iOS erstellen? Jemand kann mir eine Idee geben oder mich auf Beispiele verweisen.

    
Rachit 15.05.2012, 19:22
quelle

3 Antworten

22

Ich habe eine sehr gute Idee, wie das funktioniert (ich arbeite für Shazam und schrieb diese Animation), also ...

Obwohl ich bezweifle, dass Sie eine Animation wünschen, die alle Feinheiten der Shazam-Version aufweist, erkläre ich die Grundidee.

Zunächst besteht die Animation aus fünf Hauptteilen.

  1. Ein CAShapeLayer, der den Kreis
  2. bildet
  3. Eine CABasicAnimation, die unsere Animation in der Zeit hält
  4. Ein Timer, der unserer Formebene das Neuzeichnen vorschreibt
  5. Eine Maskenebene, die unsere Shape-Ebene dreht und maskiert
  6. Ein Logo, das auf der Shape-Ebene sitzt (es muss nicht Shazam sein)

Also zuerst den CAShapeLayer erstellen

%Vor%

Erstellen Sie die Maskenebene und fügen Sie sie der Kreisebene hinzu. Ihr Maskenbild sollte einen Kreis enthalten, der von null Alpha bis 100% Alpha reicht.

%Vor%

Erstellen Sie die Animation, die uns synchronisiert, und fügen Sie sie der Maskenebene hinzu

%Vor%

Erstellen und starten Sie den Timer, von dem aus wir zeichnen möchten

%Vor%

Legen Sie im Timer-Callback den Pfad für den Layer fest

%Vor%

Jetzt sollten Sie etwas haben, das sehr ähnlich aussieht

    
Neil Foley 16.05.2012, 10:58
quelle
1

Es gibt keine Funktion in iOS für animierte Ladebildschirme. Sie erstellen eine Ansicht, wenn Ihre Anwendung das erste Mal gestartet wird und das Ladebild anzeigt. Sie animieren dann diese Ansicht.

Bitte tun Sie das nicht, wenn Sie nicht wirklich etwas laden. iOS-Anwendungen sollen so schnell wie möglich gestartet werden. Der Ladebildschirm soll eine Annäherung an den ersten Bildschirm sein, den Sie sehen, um den Benutzer so schnell wie möglich an die Schnittstelle zu orientieren. Es ist nicht dort für Markenzwecke.

    
Jim 15.05.2012 19:32
quelle
0

Hi diese Logik für monotouch implementieren können Sie die Logik hoffen, damit Sie Ihre Lösung

erhalten können %Vor%     
user1421044 05.06.2012 13:15
quelle

Tags und Links