Android Question Wrong sizes playing a video through WebView

Mattiaf · Oct 6, 2022

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:

B4X: Copy

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

B4X: Copy

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 · Oct 7, 2022

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 · Oct 7, 2022

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 · Oct 7, 2022

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 · Oct 7, 2022

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

Mattiaf · Oct 7, 2022

Erel said:
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:

B4X: Copy

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 · Oct 7, 2022

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

Mattiaf · Oct 7, 2022

agraham said:
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 · Oct 7, 2022

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

Mattiaf · Oct 7, 2022

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

Mattiaf · Oct 7, 2022

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

HTML: Copy

<!--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 · Oct 9, 2022

Mattiaf said:
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 · Oct 9, 2022

Erel said:
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: Copy

<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: Copy

<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

HTML: Copy

<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 · Oct 10, 2022

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.

Mattiaf said:
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.

Android Question Wrong sizes playing a video through WebView

Mattiaf

Active Member

Erel

B4X founder

Mattiaf

Active Member

agraham

Expert

Mattiaf

Active Member

Mattiaf

Active Member

agraham

Expert

Mattiaf

Active Member

agraham

Expert

Mattiaf

Active Member

Mattiaf

Active Member

Erel

B4X founder

Mattiaf

Active Member

Erel

B4X founder

Similar Threads