Phonegap - Android 4.4 - HTML5 video tag only audio

467 views
Skip to first unread message

Tanase Butcaru

unread,
Mar 25, 2015, 1:42:18 AM3/25/15
to phon...@googlegroups.com

HTML5 video tag doesn't work properly on android 4.4 (.2 & .4) webView - only the audio is playing. With 5.0.1 it works just fine!

If I enable controls on video tag and enter fullscreen mode then I have video working, but when I'm out of fullscreen the video screen is black.

I have android:hardwareAccelerated="true" and I also tried this plugin which is outdated now (same issue though).

It doesn't matter if I control video with JS or I interact with the video controls. Tried both, same behaviour. Tried with all video file formats, no change.

I know there are similar questions on the web, but all are 1-2 years old and solutions provided for them are outdated or not working.

* Using latest version of phonegap/cordova. I have also created a sample app to test the video tag, thought maybe was something related to my app, but the problem persists.



Kerri Shotts

unread,
Mar 25, 2015, 3:12:35 PM3/25/15
to phon...@googlegroups.com
Care to share your minimal test case? Might be useful for others to test with quickly.

Tanase Butcaru

unread,
Mar 25, 2015, 4:05:56 PM3/25/15
to phon...@googlegroups.com
Sure! I should've done this in the first place.
Here we go:
1. create a sample phonegap app:
cordova create helloworld com.helloworld.cdv "Phonegap Test"

2. add latest android platform after entering helloworld dir:
cordova platform add android@latest

3. open index.html and add the following after "deviceready" div ending tag:
<video id="vid" controls webkit-playsinline></video>

4. open index.js and add the following inside ``onDeviceReady`` method:
       //video test
       
var videoObject = document.getElementById('vid');
        videoObject
.src = 'http://demo.touchmediahost.com/kmapp/vid.mp4';
        videoObject
.load();

        videoObject
.addEventListener('canplay', function(){
           
//video can be played!!
            videoObject
.play();
       
})

5. Setup 2 AVDs like this: (1) Nexus S with Android 4.4.2 (API 19), Intel Atom x86 and (2) Nexus 5 with Android 5.0.1 (API 21), Intel Atom x86.
6. For each AVD run ``cordova emulate android``.

You'll see that on lollipop the video is displaying the image and the sound is working & on kitkat the image is black and it only works on fullscreen mode.

All files are the default ones; in AndroidManifest.xml the hardware accel si true by default.
Also tested on my real device with kitkat 4.4.4.
Message has been deleted

Tanase Butcaru

unread,
Apr 19, 2015, 11:21:44 AM4/19/15
to phon...@googlegroups.com

Solved: upgrading android project to cordova-android 4.0.0 and switching to crosswalk webview via cordova plugin

Reply all
Reply to author
Forward
0 new messages