7

Does The WebView Control on Android OS support hardware accelerated css3 animations? And all the webkit css (for example: -webkit-transition bla bla) that I have that work on Safari Mobile do they work the same on android?

Shai UI
  • 45,518
  • 63
  • 187
  • 278

2 Answers2

7

Yes, according to this page.. It supports starting from version 3.0 til last, beloved Jelly Bean ;)

On the other side developers experienced not super successful results. Quote from here:

CSS animations are supported by Android devices — but only if a single property is changed. As soon as you try to animate more than one property at once, the entire element disappears. In non-native Android browsers, the element will be visible for the duration of the animation, but will hide immediately after it’s finished.

and update from the same source:

..it turns out Android 4.0 actually addresses this issue. Still, we need to urge the authors of these resources to explicitly mention that full support isn’t available in previous versions of Android..

So final answer 4.0+ version support it in a good way..

UPDATE: From KitKat WebView is powered by Chromium (same engine as in Chrome browser) so from this Android version advanced HTML5 and CSS features should be fully supported.. More about this here

Hope u find it useful.. ;)

Ewoks
  • 11,626
  • 6
  • 53
  • 65
  • Your answer is about Browser application, but the question is about WebView control. I tested a CSS rotation animation (see http://stackoverflow.com/a/6410923/65899) inside a WebView, and it worked only on the latest 4.4 KitKat. – amartynov Jan 27 '14 at 07:44
  • Thanks. Android WebView in KitKat is powered by Chromium engine, before it was powered by WebKit (basically same as old default browser..) so I updated the answer – Ewoks Jan 27 '14 at 10:01
  • 3
    My fault: I was trying to animate `:before` pseudo-element, and WebView had a bug until KitKat (probably this one https://bugs.webkit.org/show_bug.cgi?id=92591). Except this, your answer is absolutely right. – amartynov Jan 27 '14 at 18:49
3

If you want webkit transitions to be animated hardware accelerated in an Android Webview you'll need to enable hardware acceleration in the manifest file like so:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    ... >

    ...

    <application ... android:hardwareAccelerated="true">
        ...
    </application>

</manifest>

It's not perfect, but it improves the rendering a lot.

Dodi Raditya
  • 31
  • 1