Loading images in WebView in Sketchware

We can use WebView for loading images from any url or for loading images from drawable folder, assets folder, or resource folder of our app.

1. To load an image from a website in WebView, we can directly write the url of the image in the WebView loadUrl block. Even animated gifs can be loaded directly to WebView.

WebView webview1 loadUrl http://.....jpg

2. We can modify the width and height of this image loaded in WebView by using following code in WebView loadUrl block:

WebView webview1 loadUrl data:text/html,<img width=100% height="" src="(imageUrl)">
We can make it fit the width of the screen by setting width=100% in above code.

3. We can also load the images added using Image Manager in Sketchware (images in drawable folder) with following code:

WebView webview1 loadUrl file:///android_res/drawable/image
Note that in above code image is name of the image and has to be changed accordingly.
Note that animations do not work with this method.

4. Another way to load an image in WebView is to add a sound using sound manager, and then replace it with an image with same name and extension (.mp3) in the .sketchware/resources/sounds/608(or other)/ folder.

After that the image can be loaded in WebView using following block:

WebView webview1 loadUrl file:///android_res/raw/image
Note that in above code image is name of the image and has to be changed accordingly.
This method can also be used to insert and load .gif images in webview.

5. An image can also be loaded from assets folder into WebView. The assets folder can be created by editing the apk file in APK Editor Pro and then the image can be added to that folder. To load the image from assets folder we can use following code:

WebView webview1 loadUrl file:///android_asset/image

Note that in above code image is name of the image in assets folder and has to be changed accordingly. 

6. In new versions of sketchware, the image can be put in assets folder in source code of app at /sdcard/.sketchware/mysc/project_number(653)/app/src/main/assets/ 
folder and loaded in WebView using following code:

WebView webview1 loadUrl file:///android_asset/image


7. To enable zooming images or HTML files loaded in WebView, use an add source directly block in onCreate of the project and put following code in it:
WebSettings webSettings = webview1.getSettings();
webSettings.setJavaScriptEnabled(true); webSettings.setUseWideViewPort(true);
webSettings.setLoadWithOverviewMode(true);
webSettings.setSupportZoom(true);
webSettings.setBuiltInZoomControls(true);
webSettings.setDisplayZoomControls(false);

The code above enables pinch zoom in WebView. It is applicable to anything loaded in WebView and not just the image. It also loads the WebView with overview mode which means the width of the page fits the screen width when loaded initially, but can be zoomed.

8. To remove the ScrollBar of WebView which appears while zooming WebView, use following code in onCreate event using add source directly block:
webview1.setVerticalScrollBarEnabled(false);
webview1.setHorizontalScrollBarEnabled(false);

Comments

  1. Please I wanna code to prevent the emergence of keyboard your phone in calculator that designed and I am in sketchware

    ReplyDelete
  2. Is there any way you can get a code to save the files downloaded by webview into the memory of my friend SD card?

    ReplyDelete
  3. I need clde to download image by long press on image please

    ReplyDelete

Post a Comment

Popular posts from this blog

A Flash Light App in Sketchware

Create Music Player app in Sketchware

In Sketchware: How to create a calculator for any simple formula?

Simple car racing android game in Sketchware

Firebase auth in Sketchware for Login Activity