How to enable upload from webview in Sketchware?

Now that Sketchware has a block to add java code directly in the project, it is possible to enable file upload in webview.

To enable file upload in webview in sketchware app, follow the steps given below.

1. Insert a webview in VIEW area in the sketchware project. Note the ID of webview, usually it is webview1.

2. In LOGIC area of project, in onCreate event, add the block add source directly and copy the following code in it:

webview1.setWebChromeClient(new WebChromeClient() {
// For 3.0+ Devices
protected void openFileChooser(ValueCallback uploadMsg, String acceptType) { mUploadMessage = uploadMsg; Intent i = new Intent(Intent.ACTION_GET_CONTENT); i.addCategory(Intent.CATEGORY_OPENABLE);
i.setType("image/*"); startActivityForResult(Intent.createChooser(i, "File Browser"), FILECHOOSER_RESULTCODE);
}

// For Lollipop 5.0+ Devices
public boolean onShowFileChooser(WebView mWebView, ValueCallback<Uri[]> filePathCallback, WebChromeClient.FileChooserParams fileChooserParams) {
if (uploadMessage != null) {
uploadMessage.onReceiveValue(null);
uploadMessage = null; } uploadMessage = filePathCallback; Intent intent = fileChooserParams.createIntent(); try {
startActivityForResult(intent, REQUEST_SELECT_FILE);
} catch (ActivityNotFoundException e) {
uploadMessage = null; Toast.makeText(getApplicationContext(), "Cannot Open File Chooser", Toast.LENGTH_LONG).show(); return false; }
return true; }

//For Android 4.1 only
protected void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType, String capture) {
mUploadMessage = uploadMsg; Intent intent = new Intent(Intent.ACTION_GET_CONTENT); intent.addCategory(Intent.CATEGORY_OPENABLE); intent.setType("image/*"); startActivityForResult(Intent.createChooser(intent, "File Browser"), FILECHOOSER_RESULTCODE);
}

protected void openFileChooser(ValueCallback<Uri> uploadMsg) {
mUploadMessage = uploadMsg; Intent i = new Intent(Intent.ACTION_GET_CONTENT); i.addCategory(Intent.CATEGORY_OPENABLE);
i.setType("image/*"); startActivityForResult(Intent.createChooser(i, "File Chooser"), FILECHOOSER_RESULTCODE);
}


});

Note that if the ID of webview is not webview1, change it accordingly in the code above. This code should be at the beginning of onCreate before the WebView loadUrl block.

3. Add the block webview loadUrl and write the url to be loaded in webview.

4. Add a new FilePicker component fp.

5. Add a new More Block extra.

6. To define this block extra, use an add source directly block and put following code in it:
}

private ValueCallback<Uri> mUploadMessage;
public ValueCallback<Uri[]> uploadMessage;
public static final int REQUEST_SELECT_FILE = 100;

private final static int FILECHOOSER_RESULTCODE = 1;
{

7. Add the event FilePicker onFilesPicked. Here use an add source directly block and put following code:

}
break;

case REQUEST_SELECT_FILE:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
if (uploadMessage == null) return; uploadMessage.onReceiveValue(WebChromeClient.FileChooserParams.parseResult(_resultCode, _data)); uploadMessage = null; }
break;

case FILECHOOSER_RESULTCODE:
if (null == mUploadMessage){
return; }
Uri result = _data == null || _resultCode != RESULT_OK ? null : _data.getData(); mUploadMessage.onReceiveValue(result);
mUploadMessage = null;

if (true){

8. Save and run the project. Now the user can upload any file through WebView link.

The video below demonstrates the same.

Comments

  1. Hello sir I want code for all Android versions
    Please help me

    ReplyDelete
  2. Replies
    1. If it is not working, Change Uri[0] to Uri[1] in Second add source directly block.

      Delete
  3. Replies
    1. You have to put the first part of code as first block in onCreate, and put the second code as last block in onCreate.

      Delete
    2. Change Uri[0] to Uri[1] in Second add source directly block.

      Delete
    3. i can't find this block! where is it? i am using the latest version of this app!

      Delete
    4. Amigos el problema de los errores que estamos teniendo es por que estamos copiando los códigos desde Chrome de la página traducida al español u otro idioma debemos de copiar los codigos de la página en idioma inglés sin traducirla y seguir los pasos tal y como se muestra en el video y nuestra aplicación quedará funcional a la primera a mi me estaba pasando asta que me di cuenta que algunas palabras en los códigos cambiaban al traducirse la página automáticamente y es lo que te produce el error al compilar la aplicación ya abia echo como 8 intentos fallidos asta que compare los códigos con lo que se muestran en el. Video

      Delete
    5. You are right. Translated pages change the codes as well. Better to copy codes when it is in english.

      Delete
  4. Replies
    1. You have to put the first part of code as first block in onCreate, and put the second code as last block in onCreate.

      Delete
    2. Change Uri[0] to Uri[1] in Second add source directly block.

      Delete
  5. How can I auto matic take photo when bottom clicked (not lunch camera)

    ReplyDelete
  6. How can I auto matic take photo when bottom clicked (not lunch camera)

    ReplyDelete
  7. i can't find this block! where is it?

    ReplyDelete
  8. I successfully did and implemented the upload but it didn't allow my webview progress to work again..

    ReplyDelete
  9. Not work please update new version

    ReplyDelete
  10. Respected sir ,
    Problem creates when i choose file my application is stop

    ReplyDelete
  11. what if this error appears

    1. ERROR in /storage/emulated/0/.sketchware/mysc/ 601/app/src/main/java/com/kicau/mania/ MainActivity.java (at line 224) @Override protected void onActivityResult(int requestCode, intresultCode, Intent intent) { if (requestCode PICKFILE_REQUEST_CODE) (Uri result -intentnull I| resultCode!- RESULT_OK? null: intent.getData0; The method onActivityResult(int, int, Intent) of type new View.OnClickListener00 must override or implement asupertype method 1 problem (1 error)

    ReplyDelete
  12. Getting 2 duplicate case (2 errors), how to solve

    ReplyDelete
  13. My sketchware is the last version, and all is working well. Congratulations.

    ReplyDelete
  14. Pour quoi chez moi quand j'introduis les codes au niveau de add source on me dit erreur j'ai essayé plusieurs code mais toujours l'erreur apparait
    Même dans un autre téléphone c'est les mêmes erreurs aidez moi s'il vous plaît

    ReplyDelete
  15. Upload video and save video in Firebase,

    ReplyDelete
  16. How can I get the path of selected file in a textview.
    Give me the code please.

    ReplyDelete

Post a Comment

Popular posts from this blog

A Flash Light App in Sketchware

Create Music Player app in Sketchware

Simple car racing android game in Sketchware

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

Firebase auth in Sketchware for Login Activity