Ich habe ein paar ng-view Animationen (angular v 1.1.5) zu einer phonegap App hinzugefügt. Sie funktionieren hervorragend im Browser, wenn sie beide mit Ripple testen und wenn sie den Browser des Mobiltelefons (in diesem Fall Android android) auf die App online richten, aber wenn sie mit Phonegap installiert werden, laufen die Animationen nicht. Ich bin mir nicht sicher, ob das Problem mit Phonegap oder mit eckigen ist. Zuerst dachte ich, es würde nur zu schnell animieren, also verlangsamte ich sie auf 1.5s, aber es änderte nichts an der App.Angular Animationen und Phonegap läuft nicht auf Handy
Ist dies ein Problem mit der Telefonkluft, ein kantiges Problem und/oder wie können wir diese verwenden?
CSS definiert Animation:
.view-enter, .view-leave {
-webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
-moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
-o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
}
.view-enter {
opacity:0;
}
.view-enter.view-enter-active {
opacity:1;
}
.view-leave {
opacity:1;
}
.view-leave.view-leave-active {
left:-100px;
opacity:0;
}
Auch diese große Arbeit in dem Browser des Telefons, nur nicht, wenn es in der phonegap App ist. Verwenden Sie Adobe Build, um die App zu erstellen. Ich hole auch das CSS und zeige auf der Seite an, nur um zu bestätigen, dass die tatsächliche css-Datei im Phonegap-Build enthalten ist (ist es).
Nach einem der Kommentare des Benutzers, hier ist der HTML. Der Rest wird durch die Standardanimationen von angular gehandhabt. Sie funktionieren gut, wenn sie in einem Browser ausgeführt werden, aber nicht, wenn sie innerhalb von Phonegap ausgeführt werden. Das Routing funktioniert, die ng-Ansicht wird geändert, aber die Animation tritt nie auf.
<div class="container-fluid" id="viewer" ng-view ng-animate="{enter: 'view-enter', leave: 'view-leave'}" >
</div>
auf Nexus getestet 4.
Welche Plattform? IOS oder Android? –
Ich endete mit einer vorgefertigten css-Lösung - http://daneden.me/animate/ Funktioniert fantastisch auf IOS mindestens. –
@AdamWare Ich testete es auf Android 4.2, speziell ein Nexus 4. – lucuma