Android Question Wrong sizes playing a video through WebView

[Mattiaf]

Hi, I'm opening a website where there is a videostreaming and everything works fine on computer, smartphone, whatever browser I use.
When displayed the correct way is like this

with at the botton a bar where starts from pause/play button at the left and at the right, as you can see from the image, volume and fullscreen button.
Unfortunately using the control WebView, it is being displayed like this

so basically the fullscreen button disappear, doesn't matter how I anchor the control WebView or I zoom in/out ...
I use the control WebView and the event WebView1_OverrideUrl in order to suppress any kind of ads/ pop up that might open.
This is the code I'm using:

Sub Process_Globals
    'These global variables will be declared once when the application starts.
    'These variables can be accessed from all modules.
    Private xui As XUI
End Sub

Sub Globals
    'These global variables will be redeclared each time the activity is created.
    Dim WebView1 As WebView
    Dim Button1 As Button
End Sub

Sub Activity_Create(FirstTime As Boolean)
    Activity.LoadLayout("Layout")
End Sub

Sub Activity_Resume

End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub

Sub Button1_Click
    WebView1.JavaScriptEnabled=True
 
    WebView1.LoadUrl("https://boo7oom.com/embed.php?id=live102")

End Sub

Sub WebView1_OverrideUrl (Url As String) As Boolean
    If Url.StartsWith("https://boo7oom.com")=True Then
        Return False
        Else
            Return True
    End If
End Sub

do you have any idea on why the WebView is cutting some mm on the right side?

To follow, other test I did:
- I've just tried with the following post WebView Not Displaying Web Page
- Tried using a User Agent like chrome as the following code

Sub Activity_Create(FirstTime As Boolean)
    Activity.LoadLayout("Layout")
   
    Dim WebViewSetting1 As WebViewSettings
    WebViewSetting1.setMediaPlaybackRequiresUserGesture(WebView1,False)
    WebViewSetting1.setUserAgentString(WebView1,"Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:56.0) Gecko/20100101 Firefox/56.0")
       
    WebView1.JavaScriptEnabled=True
    WebView1.LoadUrl("https://boo7oom.com/embed.php?id=live102"
End Sub

but still the fullscreen button is over the screen or disappeared...
Many thanks

 

[Erel]

It is possible that the website hides this button for some reason. If you can access the video url directly then switch to ExoPlayer.

 

[Mattiaf]

Hi Erel, how is possible that the website hide the fullscreen button to webview but not to Chrome or samsung browsers ( both on my smartphone)?

 

[agraham]

From the difference in the proportions of the volume control bar between the two shots it looks like the video might be being rendered larger than the webview and the full screen button of out of sight to the right.

 

[Mattiaf]

yeah unfortunately thats correct... is there a way i can try to solve it? ?

 

[Mattiaf]

It is possible that the website hides this button for some reason. If you can access the video url directly then switch to ExoPlayer.

Just tried with ExoPlayer and downloaded the example, inserted my link but I'm getting the following Error:

com.google.android.exoplayer2.source.UnrecognizedInputFormatException: None of the available extractors (FlvExtractor, FlacExtractor, WavExtractor, FragmentedMp4Extractor, Mp4Extractor, AmrExtractor, PsExtractor, OggExtractor, TsExtractor, MatroskaExtractor, AdtsExtractor, Ac3Extractor, Ac4Extractor, Mp3Extractor, JpegExtractor) could read the stream.

 

[agraham]

Looks like ExoPlayer can't decode whatever coding format the stream uses.

 

[Mattiaf]

Looks like ExoPlayer can't decode whatever coding format the stream uses.

yeah and also WebView is a stand alone component which means I can't edit its rendering engine... Does it means I can't do anything to solve it?

 

[agraham]

Sorry but I have no idea as I have never looked at it.

 

[Mattiaf]

If it might be helpful, I'll zip the project and upload on DropBox
Many thanks

 

[Mattiaf]

Looking at the html code through my computer, I can see that that's an Iframe and there is this html

<!--player by nstream.to--><iframe src="https://r93w0mxwclykj2.wholesaledisturbed.com/embed/ez3sjcbvjr4" width="100%" height="100%"  scrolling="no" frameborder="0" allowfullscreen="true"></iframe>

Might it be that the property allowfullscreen="true" will change to false once I'm streaming it into webview?

 

[Erel]

Just tried with ExoPlayer and downloaded the example, inserted my link but I'm getting the following Error:

You need to pass the direct link to the video. Not a link to a web page.

 

[Mattiaf]

You need to pass the direct link to the video. Not a link to a web page.

Hi Erel, can you please gently indicate me which one is the direct link in the html?

<html><head>

                                <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
                                <meta name="robots" content="noindex,nofollow">
                                <meta http-equiv="expires" content="0">
                                <meta http-equiv="pragma" content="no-cache">
                                <link rel="shortcut icon" href="https://i.imgur.com/zXznFUY.png?2">
                                <meta http-equiv="cache-control" content="no-cache, must-revalidate">
                                <meta name="viewport" content="width=device-width, initial-scale=1">
<title>Embed</title>

<style type="text/css">
    body {
    margin:0px;
    border:0px;
    background: url() no-repeat center center fixed #29485f;
}

    </style>
    

</head>
<body>

<script src="//grimsecretary.com/c/Dm9.6mb/2l5UlaSTWbQ/9QNGDtUT1VM/DfQIzZM/C/0W0/NaTLUcwcNGDvMtxQ"></script><script>
(function(options){

........HTML WAY TO LONG TO BE POSTED HERE......

<script type="text/javascript" src="//clearancejoinjavelin.com/09/94/c8/0994c8063cadb716c80eb131a8e2f0eb.js"></script>
<script data-cfasync="false" src="//dlooqrhebkjoh.cloudfront.net/?qoold=964423"></script>
<iframe allow="encrypted-media" src="https://buzztv.stream/hd2.php" width="100%" height="100%" marginwidth="0" marginheight="0" scrolling="no" border="0" frameborder="0" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true">
</iframe>

<script id="_wauzv5">var _wau = _wau || []; _wau.push(["dynamic", "bvd5o9lofr", "zv5", "c4302bffffff", "small"]);</script><script async="" src="//waust.at/d.js"></script>


</body></html>

I will try ... is this one ? https://buzztv.stream/hd2.php

that bring to this

<html><head>

<link rel="dns-prefetch" href="//cdnondemand.org"><link rel="preconnect" href="//cdnondemand.org"><link rel="dns-prefetch" href="//velocitycdn.com"><link rel="preconnect" href="//velocitycdn.com"></head>

<body style="margin:0px; padding:0px">

<!--player by nstream.to--><iframe src="https://l9re2egecvl6ky.wholesaledisturbed.com/embed/ez3sjcbvjr4" width="100%" height="100%" scrolling="no" frameborder="0" allowfullscreen="true"></iframe>
<!-- BANNER  -->
<div id="html1" style="position: fixed; left: 110px; top: 70px; width: 910px; height: 950px; z-index: 910; display: none;">   
<div id="button1" style="position: fixed; left: 1px; top: 0px; width: 100%; height: 100%; visibility: visible;"><span onmouseup="document.getElementById('html1').style.display='none'"><span onmouseup="document.getElementById('html1').style.display='none'"><img src="SCCfwxq.png" alt="" height="100%" width="100%"></span></span></div> </div>
<!--  BANNER -->

    <!-- ADS -->

where we can see

<iframe src="https://l9re2egecvl6ky.wholesaledisturbed.com/embed/ez3sjcbvjr4" width="100%" height="100%" scrolling="no" frameborder="0" allowfullscreen="true"></iframe>

but that link brings to https://nstream.to/

By the way, all this process is unsustainable for the app, so I gently would ask you why the webview can't render the website the way that samsung or chrome ( on smartphone) browsers do..... I've even tried desktop mode, no solution...

Much thanks Erel

 

[Erel]

You can use the browser developer tools and monitor the network calls.
However it looks like they are preventing direct access to the video so it will probably won't work.

so I gently would ask you why the webview can't render the website

WebView is a native view. There isn't much that you can do if it is not working. On newer versions of Android you can update the WebView component from Google Play. It might help.