Angular Анимация и Phonegap не работают на мобильных устройствах

Я добавил несколько анимаций ng-view (angular v 1.1.5) в приложение phonegap. Они отлично работают в браузере при тестировании как с использованием пульсации, так и при указании браузера мобильного телефона (в этом случае на Android-хром), но при установке с помощью телефонного разговора анимация не запускается. Я не уверен, что проблема связана с телефонной связью или с angular. Сначала я думал, что это просто анимация слишком быстро, поэтому я замедлил их до 1,5 с, но ничего не изменил в приложении.

Является ли это проблемой разрыва в телефоне, проблемой angular и/или как мы можем их использовать?

Определенная CSS анимация:

.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;
}

Опять же, они отлично работают в браузере телефона, только когда он находится в приложении phonegap. Использование Adobe build для создания приложения. Я также получаю css и показываю на странице только для подтверждения того, что фактический файл css включен в сборку phonegap (он есть).

По одному из комментариев пользователя, вот HTML. Остальное обрабатывается angular анимациями по умолчанию. Они отлично работают при запуске в браузере, но не при запуске в телефонной заторе. Маршрутизация работает, ng-view изменен, но анимация никогда не возникает.

   <div class="container-fluid" id="viewer" ng-view ng-animate="{enter: 'view-enter', leave: 'view-leave'}" >


     </div>

Протестировано на Nexus 4.

Ответы

Ответ 1

Это определенно проблема с браузером Android 4.2. Первый ключ заключается в том, что он отлично работает на рабочем столе и в Chrome, но не в Phonegap. InAppBrowser использует браузер Android для Android.

Поддержка анимаций (и HTML5 в целом) была довольно ужасной в Android 4.2. Здесь удобное изложение этих причуд.

Надеюсь, вам удастся обновить версию Android с июня!

Ответ 2

Вы можете посмотреть CocoonJS (работает с Кордорой) или Crosswalk в качестве путей для ускорения всех способов замедления работы браузера при развертывании на более ранних версиях Android.