Android issue with videos, playing only audio no video using WebView

video

#1

Hi everyone, I’m dealing with this issue that is driving me crazy!

I’m using Wordpress API to fetch blog content to my application and I’m using WebView to render post content. On iOS it rendered perfect and when you tap the video it plays automatically on fullscreen, but on Android (emulator and device) only plays audio, no video and no fullscreen.

I’m using {N} + Angular . These are my files

AndroidManifest.xml

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

	<supports-screens
		android:smallScreens="true"
		android:normalScreens="true"
		android:largeScreens="true"
		android:xlargeScreens="true"/>

	<uses-sdk
		android:minSdkVersion="17"
		android:targetSdkVersion="__APILEVEL__"/>

	<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
	<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
	<uses-permission android:name="android.permission.INTERNET"/>

	<application
		android:name="com.tns.NativeScriptApplication"
		android:allowBackup="true"
		android:icon="@drawable/icon"
		android:label="@string/app_name"
		android:theme="@style/AppTheme"
		android:hardwareAccelerated="true">

		<activity
			android:name="com.tns.NativeScriptActivity"
			android:label="@string/title_activity_kimera"
			android:configChanges="keyboardHidden|orientation|screenSize"
			android:theme="@style/LaunchScreenTheme"
			android:hardwareAccelerated="true">

			<meta-data android:name="SET_THEME_ON_LAUNCH" android:resource="@style/AppTheme" />

			<intent-filter>
				<action android:name="android.intent.action.MAIN" />
				<category android:name="android.intent.category.LAUNCHER" />
			</intent-filter>
		</activity>
		<activity android:name="com.tns.ErrorReportActivity"/>
	</application>
</manifest>

post.html

<ActionBar android.icon="res://logo_actionbar" android.iconVisibility="always" class="action-bar">
    <ActionItem text="Item" ios.position="right" android:visibility="collapse">
        <StackLayout orientation="horizontal"
        ios:horizontalAlignment="right">
            <Image src="res://logo_actionbar" class="action-image"></Image>
            <Label text="Beyond"  class="action-label"></Label>
        </StackLayout>
    </ActionItem>
</ActionBar>
<GridLayout class="m-5" rows="auto, *" *ngIf="post">
        <Label row="0" class="h2" [text]="post.title.rendered" textWrap="true"></Label>
        <WebView row="1" height="auto" class="html" [src]="post.content.rendered" ></WebView>
</GridLayout>
<ActivityIndicator busy="true"  *ngIf="!(post || errMess)" width="50" height="50" class="activity-indicator"></ActivityIndicator>
<Label *ngIf="errMess" [text]="'Error: ' + errMess"></Label>

Any ideas?


#2

I’ve created a simple repo to help you to recreate the issue:

Also I’ve reported this issue at NativeScript repository at Github


#3

have you tried this on real android device?
@israes


#4

Yes, on a real device doesn’t play ;(
@multishiv19


#5

Good news everyone!

@NickIliev has answered on Github

@multishiv19 you were right, I was trying with my old huawei phone that runs android 4.3 and of course did not work. I borrowed a coworker phone that have Android 6.0 and works like a charm!

Beginner mistake.


#6

@israes
Awesome. Glad it worked for you :slight_smile: