Android Question Webview to image resulting in too long image.

jroriz

Active Member
Licensed User
Longtime User
I'm trying to share a page rendered by webview as an image.
The ideal would be as a PDF, but as I had difficulty getting this, I'm saving it as an image. This already solves my problem, since the pages are not large.
It turns out that the page contains images, and the resulting image from the generated html is too long, as shown below, and the images are not generated.

Below is a link where you can view an example page that is generated in the code.
https://safetymov1.hospedagemdesites.ws/sistema/app/view4b4x.php

This is my code:
B4X:
Sub Class_Globals
    Private Root As B4XView 'ignore
    Private xui As XUI 'ignore
    Private WebView1 As WebView
    Private xarq As String
    Private Provider As FileProvider
End Sub

'You can add more parameters here.
Public Sub Initialize As Object
    Return Me
End Sub

Public Sub Mostrar(peca As String)

    Provider.Initialize

    xarq = peca & ".png"
    WebView1.LoadUrl("http://safetymov1.hospedagemdesites.ws/sistema/app/view.php?peca=" & peca)
   
End Sub

'This event will be called once, before the page becomes visible.
Private Sub B4XPage_Created (Root1 As B4XView)
    Root = Root1

    Root.LoadLayout("inspecao")

End Sub

Private Sub B4XPage_Disappear
'    B4XPages.ShowPage("Mainpage")
End Sub

Private Sub btnVoltar_Click
    B4XPages.ShowPage("Mainpage")
End Sub

Private Sub btnSalvar_Click
   
    Dim bmp As Bitmap
    bmp = WebView1.CaptureBitmap

    If bmp <> Null Then
        Dim OutputStream As OutputStream
        OutputStream = File.OpenOutput(Provider.SharedFolder, xarq, False)
        bmp.WriteToStream(OutputStream, 100, "PNG")
        OutputStream.Close
        shareFile
    End If
   
End Sub

Sub shareFile
    Dim in As Intent
    in.Initialize(in.ACTION_SEND, "")
    in.SetType("image/png")
    in.PutExtra("android.intent.extra.STREAM", Provider.GetFileUri(xarq))
    in.Flags = 1 'FLAG_GRANT_READ_URI_PERMISSION
    StartActivity(in)
End Sub

It depends on Fileprovider library.

The layout used is attached, just in case, but it's just the webview and a "share" button.

Any help will be welcome. Thanks.
 

Attachments

  • inspecao.bal
    2.3 KB · Views: 97
  • webpage.jpeg
    webpage.jpeg
    47.3 KB · Views: 95

drgottjr

Expert
Licensed User
Longtime User
the capturebitmap method only captures what's visible when the device loads the resource.
there are 2 ways to handle this:
you have to shrink the page so that it fits completely all at once. this, of course, will make the images very small... plus it requires a webview setting. not very difficult.
the other way is a very long-winded routine that i'm afraid i don't have time right now to package for you. since webview is (or used to be) a specialty of forum member ivica golubovic, maybe you'll get lucky and he'll spot your post. if he's covered what you need in one of his libraries, he'll tell you which one. there are 1 or 2 other members who may be familiar with the issue. hang on a bit. unless the routine is already part of some library, it is definitely not a 1-line fix.
attached find a sample of what it does. this is a typical yahoo.com page that never ends. i captured it as a bitmap.
 

Attachments

  • longpage.png
    longpage.png
    43.1 KB · Views: 89
Upvote 0

jroriz

Active Member
Licensed User
Longtime User
the capturebitmap method only captures what's visible when the device loads the resource.
there are 2 ways to handle this:
you have to shrink the page so that it fits completely all at once. this, of course, will make the images very small... plus it requires a webview setting. not very difficult.
the other way is a very long-winded routine that i'm afraid i don't have time right now to package for you. since webview is (or used to be) a specialty of forum member ivica golubovic, maybe you'll get lucky and he'll spot your post. if he's covered what you need in one of his libraries, he'll tell you which one. there are 1 or 2 other members who may be familiar with the issue. hang on a bit. unless the routine is already part of some library, it is definitely not a 1-line fix.
attached find a sample of what it does. this is a typical yahoo.com page that never ends. i captured it as a bitmap.
Bad news...
Well, I do have a plan B: write the page as a pdf on server side and then share it...
Bu I will wait a bit if someone else can help.
 
Upvote 0

drgottjr

Expert
Licensed User
Longtime User
here. this works. be careful when adapting. don't mess it up. the attached image had to be shrunk to be uploaded. actual image is much larger.
 

Attachments

  • webview9.zip
    8.4 KB · Views: 130
  • webpage2.png
    webpage2.png
    297.8 KB · Views: 88
Upvote 0

drgottjr

Expert
Licensed User
Longtime User
i said there wasn't a simple 1-line fix, but i was wrong. while my posted fix works, i was trying to see why it does work. i was especially curious as to why it's necessary to run the routine twice. among other things, what i found was that if you create a webview that's longer than the screen, you can capture your webpage with images! you don't show your webview layout (my little project does), but if you make the layout, eg, 2x the height of the screen, you get the whole webpage even though you can't see the whole page on the device (you have to scroll up and down to see it). in other words, if the webview layout = screen dimensions, then CaptureBitmap gives you a bitmap of the screen (which is what i said). if the webview layout > screen dimensions, then CaptureBitmap gives you more. under normal circumstances you would usually set the webview layout = screen dimensions and you scroll up and down like with a desktop browser.

initially, i set webview height to 3x screen, but that was too much; i got the whole page + space below the images. i ratcheted back to 2x, and that was better. so instead of my inline java routine, i set webview height to 2x screen height and used your bmp = WebView1.CaptureBitmap statement and got the whole page.

that said, with my inline code, you set the webview height = screen height and the inline code routine is run twice. on the other hand, if you use bmp = WebView1.CaptureBitmap, you have to figure out how "long" to make the webview in advance. if it's too short, you make it longer. too long? make it shorter.
you could make the layout instructions in programming after seeing how the download went. some online research pointed to the layout size issue. it was reported to google some years ago. numerous unsatisfactory webview settings fixes were posted. the inline routine or the 1-line fix were as close as i could come.
 
Upvote 0
Top