Sketchware Developer
Thursday, June 23, 2022
Saturday, November 2, 2019
Enable Fullscreen Youtube videos
1. Create a new project in Sketchware.
2. In VIEW area add a WebView webview1.
3. Create a more block extra.
4. In the more block extra, use an add source directly blocks and put codes to define a new WebChromeClient class with name CustomWebClient.
}
public class CustomWebClient extends WebChromeClient {
private View mCustomView;
private WebChromeClient.CustomViewCallback mCustomViewCallback;
protected FrameLayout frame;
// Initially mOriginalOrientation is set to Landscape
private int mOriginalOrientation = android.content.pm.ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE;
private int mOriginalSystemUiVisibility;
// Constructor for CustomWebClient
public CustomWebClient() {}
public Bitmap getDefaultVideoPoster() {
if (MainActivity.this == null) {
return null; }
return BitmapFactory.decodeResource(MainActivity.this.getApplicationContext().getResources(), 2130837573); }
public void onShowCustomView(View paramView, WebChromeClient.CustomViewCallback viewCallback) {
if (this.mCustomView != null) {
onHideCustomView();
return; }
this.mCustomView = paramView;
this.mOriginalSystemUiVisibility = MainActivity.this.getWindow().getDecorView().getSystemUiVisibility();
// When CustomView is shown screen orientation changes to mOriginalOrientation (Landscape).
MainActivity.this.setRequestedOrientation(this.mOriginalOrientation);
// After that mOriginalOrientation is set to portrait.
this.mOriginalOrientation = android.content.pm.ActivityInfo.SCREEN_ORIENTATION_PORTRAIT;
this.mCustomViewCallback = viewCallback; ((FrameLayout)MainActivity.this.getWindow().getDecorView()).addView(this.mCustomView, new FrameLayout.LayoutParams(-1, -1)); MainActivity.this.getWindow().getDecorView().setSystemUiVisibility(3846);
}
public void onHideCustomView() {
((FrameLayout)MainActivity.this.getWindow().getDecorView()).removeView(this.mCustomView);
this.mCustomView = null;
MainActivity.this.getWindow().getDecorView().setSystemUiVisibility(this.mOriginalSystemUiVisibility);
// When CustomView is hidden, screen orientation is set to mOriginalOrientation (portrait).
MainActivity.this.setRequestedOrientation(this.mOriginalOrientation);
// After that mOriginalOrientation is set to landscape.
this.mOriginalOrientation = android.content.pm.ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE; this.mCustomViewCallback.onCustomViewHidden();
this.mCustomViewCallback = null;
}
}
{
5. In onCreate event, use add source directly block and put codes to create a new CustomWebClient and set it as the WebChromeClient for the WebView.
webview1.setWebChromeClient(new CustomWebClient());
After that use webview loadUrl block to load youtube.
6. Now add a new event, 'On back button press', in LOGIC area of your app. In this event use if..else.. block. Add Webview goBack block as shown in image below. It should read, if WebView canGoBack then WebView goBack else Finish Activity.
7. Save and Run the project. You can now watch YouTube videos in fullscreen mode in your app.
2. In VIEW area add a WebView webview1.
3. Create a more block extra.
4. In the more block extra, use an add source directly blocks and put codes to define a new WebChromeClient class with name CustomWebClient.
}
public class CustomWebClient extends WebChromeClient {
private View mCustomView;
private WebChromeClient.CustomViewCallback mCustomViewCallback;
protected FrameLayout frame;
// Initially mOriginalOrientation is set to Landscape
private int mOriginalOrientation = android.content.pm.ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE;
private int mOriginalSystemUiVisibility;
// Constructor for CustomWebClient
public CustomWebClient() {}
public Bitmap getDefaultVideoPoster() {
if (MainActivity.this == null) {
return null; }
return BitmapFactory.decodeResource(MainActivity.this.getApplicationContext().getResources(), 2130837573); }
public void onShowCustomView(View paramView, WebChromeClient.CustomViewCallback viewCallback) {
if (this.mCustomView != null) {
onHideCustomView();
return; }
this.mCustomView = paramView;
this.mOriginalSystemUiVisibility = MainActivity.this.getWindow().getDecorView().getSystemUiVisibility();
// When CustomView is shown screen orientation changes to mOriginalOrientation (Landscape).
MainActivity.this.setRequestedOrientation(this.mOriginalOrientation);
// After that mOriginalOrientation is set to portrait.
this.mOriginalOrientation = android.content.pm.ActivityInfo.SCREEN_ORIENTATION_PORTRAIT;
this.mCustomViewCallback = viewCallback; ((FrameLayout)MainActivity.this.getWindow().getDecorView()).addView(this.mCustomView, new FrameLayout.LayoutParams(-1, -1)); MainActivity.this.getWindow().getDecorView().setSystemUiVisibility(3846);
}
public void onHideCustomView() {
((FrameLayout)MainActivity.this.getWindow().getDecorView()).removeView(this.mCustomView);
this.mCustomView = null;
MainActivity.this.getWindow().getDecorView().setSystemUiVisibility(this.mOriginalSystemUiVisibility);
// When CustomView is hidden, screen orientation is set to mOriginalOrientation (portrait).
MainActivity.this.setRequestedOrientation(this.mOriginalOrientation);
// After that mOriginalOrientation is set to landscape.
this.mOriginalOrientation = android.content.pm.ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE; this.mCustomViewCallback.onCustomViewHidden();
this.mCustomViewCallback = null;
}
}
{
5. In onCreate event, use add source directly block and put codes to create a new CustomWebClient and set it as the WebChromeClient for the WebView.
webview1.setWebChromeClient(new CustomWebClient());
After that use webview loadUrl block to load youtube.
6. Now add a new event, 'On back button press', in LOGIC area of your app. In this event use if..else.. block. Add Webview goBack block as shown in image below. It should read, if WebView canGoBack then WebView goBack else Finish Activity.
7. Save and Run the project. You can now watch YouTube videos in fullscreen mode in your app.
crd#Sanjeev Kumar
Download a file from web link
1. Create a new project in Sketchware. In VIEW area add an EditText edittext1 and a Button button1. Add a LinearH progresslinear, inside this add a circular ProgressBar progressbar1 and a LinearV containing a TextView textview2, and horizontal ProgressBar progressbar2.
2. Add a RequestNetwork component network. This is required only for adding INTERNET permissions in the Sketchware app.
3. Add four String variables path, filename, myurl and result, and two Number variables size and sumCount.
4. In onCreate event make progresslinear GONE.
5. Create a More block called extra. Here use codes and blocks as shown in image below.
i. In an add sources directly block put a } to close _extra(){ and then define an AsyncTask with name DownloadTask.
4. In onCreate event make progresslinear GONE.
5. Create a More block called extra. Here use codes and blocks as shown in image below.
i. In an add sources directly block put a } to close _extra(){ and then define an AsyncTask with name DownloadTask.
}
private class DownloadTask extends AsyncTask<String, Integer, String> {
ii. In another add source directly block, add onPreExecute method of AsyncTask.
ii. In another add source directly block, add onPreExecute method of AsyncTask.
@Override
protected void onPreExecute() {
iii. Use blocks to make progresslinear VISIBLE and set "Starting Download" as text of textview2, in onPreExecute.
iv. Close onPreExecute Method with a }.
}
v. Define doInBackground method of AsyncTask. Use HttpURLConnection to openConnection() for the url and create an InputStream for downloading the url.
In the code below 'in' is the InputStream, address[0] is the url, and filename is String variable retrieved from url, and result is the String variable which is used later in onPostExecute.
protected String doInBackground(String... address) {
try {
filename= URLUtil.guessFileName(address[0], null, null);
int resCode = -1;
java.io.InputStream in = null;
java.net.URL url = new java.net.URL(address[0]);
java.net.URLConnection urlConn = url.openConnection();
if (!(urlConn instanceof java.net.HttpURLConnection)) {
throw new java.io.IOException("URL is not an Http URL"); }
java.net.HttpURLConnection httpConn = (java.net.HttpURLConnection) urlConn; httpConn.setAllowUserInteraction(false); httpConn.setInstanceFollowRedirects(true); httpConn.setRequestMethod("GET"); httpConn.connect();
resCode = httpConn.getResponseCode();
if (resCode == java.net.HttpURLConnection.HTTP_OK) {
in = httpConn.getInputStream();
size = httpConn.getContentLength();
} else { result = "There was an error"; }
vi. Set String path to Join DIRECTORY_DOWNLOADS and / and filename.
vii. After that use block to write empty String to path. This is required for adding WRITE EXTERNAL STORAGE permissions to the Sketchware app.
viii. Use codes to create an OutputStream and write data from InputStream to a File at path in sdcard.
Here publishProgress( (int)Math.round( sumCount*100 / size)); is use to display the percentage of download completed. This is displayed using the onProgressUpdate method of AsyncTask.
java.io.File file = new java.io.File(path);
java.io.OutputStream output = new java.io.FileOutputStream(file);
try {
int bytesRead;
sumCount = 0;
byte[] buffer = new byte[1024];
while ((bytesRead = in.read(buffer)) != -1) {
output.write(buffer, 0, bytesRead);
sumCount += bytesRead;
if (size > 0) {
publishProgress((int)Math.round(sumCount*100 / size));
}
}
} finally {
output.close();
}
result = filename + " saved";
in.close();
} catch (java.net.MalformedURLException e) {
result = e.getMessage();
} catch (java.io.IOException e) {
result = e.getMessage();
} catch (Exception e) {
result = e.toString();
}
return result;
}
Upto here is the doInBackground method.
ix. Define onProgressUpdate method of AsyncTask. Here we display the data received from publishProgress(..) used in doInBackground method. Thus we display the percentage of download completed in textview2 and progressbar2.
protected void onProgressUpdate(Integer... values) {
textview2.setText(values[values.length - 1] + "% downloaded");
progressbar2.setProgress(values[values.length - 1]);
}
x. Define onPostExecute method of AsyncTask. Here we display the String result returned by doInBackground method as a Toast message.
protected void onPostExecute(String s){
showMessage(s);
xi. Use block to make progresslinear GONE and add } at end to close onPostExecute method.
}
We do not put } at end to close AsyncTask because we already placed a } in beginning of this more block.
filename= URLUtil.guessFileName(address[0], null, null);
int resCode = -1;
java.io.InputStream in = null;
java.net.URL url = new java.net.URL(address[0]);
java.net.URLConnection urlConn = url.openConnection();
if (!(urlConn instanceof java.net.HttpURLConnection)) {
throw new java.io.IOException("URL is not an Http URL"); }
java.net.HttpURLConnection httpConn = (java.net.HttpURLConnection) urlConn; httpConn.setAllowUserInteraction(false); httpConn.setInstanceFollowRedirects(true); httpConn.setRequestMethod("GET"); httpConn.connect();
resCode = httpConn.getResponseCode();
if (resCode == java.net.HttpURLConnection.HTTP_OK) {
in = httpConn.getInputStream();
size = httpConn.getContentLength();
} else { result = "There was an error"; }
vi. Set String path to Join DIRECTORY_DOWNLOADS and / and filename.
vii. After that use block to write empty String to path. This is required for adding WRITE EXTERNAL STORAGE permissions to the Sketchware app.
viii. Use codes to create an OutputStream and write data from InputStream to a File at path in sdcard.
Here publishProgress( (int)Math.round( sumCount*100 / size)); is use to display the percentage of download completed. This is displayed using the onProgressUpdate method of AsyncTask.
java.io.File file = new java.io.File(path);
java.io.OutputStream output = new java.io.FileOutputStream(file);
try {
int bytesRead;
sumCount = 0;
byte[] buffer = new byte[1024];
while ((bytesRead = in.read(buffer)) != -1) {
output.write(buffer, 0, bytesRead);
sumCount += bytesRead;
if (size > 0) {
publishProgress((int)Math.round(sumCount*100 / size));
}
}
} finally {
output.close();
}
result = filename + " saved";
in.close();
} catch (java.net.MalformedURLException e) {
result = e.getMessage();
} catch (java.io.IOException e) {
result = e.getMessage();
} catch (Exception e) {
result = e.toString();
}
return result;
}
Upto here is the doInBackground method.
ix. Define onProgressUpdate method of AsyncTask. Here we display the data received from publishProgress(..) used in doInBackground method. Thus we display the percentage of download completed in textview2 and progressbar2.
protected void onProgressUpdate(Integer... values) {
textview2.setText(values[values.length - 1] + "% downloaded");
progressbar2.setProgress(values[values.length - 1]);
}
x. Define onPostExecute method of AsyncTask. Here we display the String result returned by doInBackground method as a Toast message.
protected void onPostExecute(String s){
showMessage(s);
xi. Use block to make progresslinear GONE and add } at end to close onPostExecute method.
}
We do not put } at end to close AsyncTask because we already placed a } in beginning of this more block.
6. In button1 onClick event set String myurl to edittext1 getText and use add source directly block to put following code in it:
new DownloadTask().execute(myurl);
This code calls the AsyncTask on Button Click, to download the URL from edittext1 in background.
7. Save and run the project. In the app, write any url in EditText field and click the button. If the link is valid it will be downloaded.
Crd#Developer
Monday, October 28, 2019
Create Menu App Project
1. Start a new project.
2. Activity onCreate.
3. 3 Add source directly.
#Codes.........
Code1
}
................................................................
Code2
@Override
public boolean onCreateOptionsMenu (Menu menu){
menu.add(0, 0, 0, "About");
return true;
}
................................................................
Code3
@Override
public boolean onOptionsItemSelected(MenuItem item){
switch (item.getItemId()){
case 0:
_move();
break;
}
return super.onOptionsItemSelected(item);
................................................................
4. Finally you will get to menu in your app.
Splash Loading Screen App Project
1. Create new project.
2. Create new XML.
3. Create timer and intent from component.
4. Create number from variable.
5. Add ImageView for Loading.
#OnCreate
#OnStart
PDF Reader App Project
1. Create new project.
2. Add such as from photo.
3. Activity onCreate
Add source directly code
touch = new
ZoomableImageView(this);
linear2.addView(touch);
......................................................................
4. Add file picker from component.
5. Add button1
Add source directly code
if (renderer !=null){
renderer.close();
}
......................................................................
6. Add TextView1
7. Add TextView2
8. Add TextView3
9. File picker
#Code
Add source directly code 1
try {
renderer = new android.graphics.pdf.PdfRenderer(new ParcelFileDescriptor(ParcelFileDescriptor.open(new java.io.File(pdfFile), ParcelFileDescriptor.MODE_READ_ONLY)));
......................................................................
Add source directly code 2
pageCount = renderer.getPageCount();
................................................................
Add source directly code 3
} catch (Exception e){ }
......................................................................
10. display More Block
Add source directly code
android.graphics.pdf.PdfRenderer.Page page = renderer.openPage((int)_page);
Bitmap mBitmap = Bitmap.createBitmap((int)getDip(page.getWidth()), (int)getDip(page.getHeight()), Bitmap.Config.ARGB_8888);
page.render(mBitmap, null, null, android.graphics.pdf.PdfRenderer.Page.RENDER_MODE_FOR_DISPLAY);
touch.setImageBitmap(mBitmap);
page.close();
......................................................................
11. extra More Block
Add source directly codes
#Code1
}
private
android.graphics.pdf.PdfRenderer
renderer;
ZoomableImageView touch;
......................................................................
#Code2
public class ZoomableImageView extends ImageView {
Matrix matrix = new Matrix();
static final int NONE = 0;
static final int DRAG = 1;
static final int ZOOM = 2;
static final int CLICK = 3;
int mode = NONE;
PointF last = new PointF();
PointF start = new PointF();
float minScale = 1f;
float maxScale = 4f;
float[] m;
float redundantXSpace, redundantYSpace;
float width, height;
float saveScale = 1f;
float right, bottom, origWidth, origHeight, bmWidth, bmHeight;
ScaleGestureDetector mScaleDetector;
Context context;
public ZoomableImageView(Context context) {
super(context);
super.setClickable(true);
this.context = context;
mScaleDetector = new ScaleGestureDetector(context, new ScaleListener());
matrix.setTranslate(1f, 1f);
m = new float[9];
setImageMatrix(matrix); setScaleType(ScaleType.MATRIX);
setOnTouchListener(new OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
mScaleDetector.onTouchEvent(event);
matrix.getValues(m);
float x = m[Matrix.MTRANS_X];
float y = m[Matrix.MTRANS_Y];
PointF curr = new PointF(event.getX(), event.getY());
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN: last.set(event.getX(), event.getY()); start.set(last); mode = DRAG;
break;
case MotionEvent.ACTION_POINTER_DOWN: last.set(event.getX(), event.getY()); start.set(last);
mode = ZOOM;
break;
case MotionEvent.ACTION_MOVE:
if (mode == ZOOM || (mode == DRAG && saveScale > minScale)) {
float deltaX = curr.x - last.x;
float deltaY = curr.y - last.y;
float scaleWidth = Math.round(origWidth * saveScale);
float scaleHeight = Math.round(origHeight * saveScale);
if (scaleWidth < width) {
deltaX = 0;
if (y + deltaY > 0) deltaY = -y;
else if (y + deltaY < -bottom) deltaY = -(y + bottom);
} else if (scaleHeight < height) {
deltaY = 0;
if (x + deltaX > 0) deltaX = -x;
else if (x + deltaX < -right) deltaX = -(x + right);
} else {
if (x + deltaX > 0) deltaX = -x;
else if (x + deltaX < -right) deltaX = -(x + right);
if (y + deltaY > 0) deltaY = -y;
else if (y + deltaY < -bottom) deltaY = -(y + bottom);
}
matrix.postTranslate(deltaX, deltaY);
last.set(curr.x, curr.y);
}
break;
case MotionEvent.ACTION_UP:
mode = NONE;
int xDiff = (int) Math.abs(curr.x - start.x);
int yDiff = (int) Math.abs(curr.y - start.y);
if (xDiff < CLICK && yDiff < CLICK) performClick();
break;
case MotionEvent.ACTION_POINTER_UP:
mode = NONE;
break;
}
setImageMatrix(matrix);
invalidate();
return true;
}
});
}
@Override
public void setImageBitmap(Bitmap bm) {
super.setImageBitmap(bm);
bmWidth = bm.getWidth();
bmHeight = bm.getHeight(); }
public void setMaxZoom(float x) {
maxScale = x; }
private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {
@Override
public boolean onScaleBegin(ScaleGestureDetector detector) {
mode = ZOOM;
return true;}
@Override
public boolean onScale(ScaleGestureDetector detector) {
float mScaleFactor = detector.getScaleFactor();
float origScale = saveScale;
saveScale *= mScaleFactor;
if (saveScale > maxScale){
saveScale = maxScale;
mScaleFactor = maxScale / origScale;
} else if (saveScale < minScale) {
saveScale = minScale;
mScaleFactor = minScale / origScale;}
right = width * saveScale - width - (2 * redundantXSpace * saveScale);
bottom = height * saveScale - height - (2 * redundantYSpace * saveScale);
if (origWidth * saveScale <= width || origHeight * saveScale <= height) {
matrix.postScale(mScaleFactor, mScaleFactor, width / 2, height / 2);
if (mScaleFactor < 1) {
matrix.getValues(m);
float x = m[Matrix.MTRANS_X];
float y = m[Matrix.MTRANS_Y];
if (mScaleFactor < 1) {
if (Math.round(origWidth * saveScale) < width) {
if (y < -bottom) matrix.postTranslate(0, -(y + bottom));
else if (y > 0) matrix.postTranslate(0, -y);
} else {
if (x < -right) matrix.postTranslate(-(x + right), 0);
else if (x > 0) matrix.postTranslate(-x, 0);}
}
}
} else {
matrix.postScale(mScaleFactor, mScaleFactor, detector.getFocusX(), detector.getFocusY()); matrix.getValues(m);
float x = m[Matrix.MTRANS_X];
float y = m[Matrix.MTRANS_Y];
if (mScaleFactor < 1) {
if (x < -right) matrix.postTranslate(-(x + right), 0);
else if (x > 0) matrix.postTranslate(-x, 0);
if (y < -bottom) matrix.postTranslate(0, -(y + bottom));
else if (y > 0) matrix.postTranslate(0, -y);}
}
return true;
}
}
@Override
protected void onMeasure (int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
width = MeasureSpec.getSize(widthMeasureSpec);
height = MeasureSpec.getSize(heightMeasureSpec);
float scale;
float scaleX = width / bmWidth;
float scaleY = height / bmHeight;
scale = Math.min(scaleX, scaleY); matrix.setScale(scale, scale); setImageMatrix(matrix);
saveScale = 1f;
redundantYSpace = height - (scale * bmHeight) ;
redundantXSpace = width - (scale * bmWidth);
redundantYSpace /= 2;
redundantXSpace /= 2; matrix.postTranslate(redundantXSpace, redundantYSpace);
origWidth = width - 2 * redundantXSpace;
origHeight = height - 2 * redundantYSpace;
right = width * saveScale - width - (2 * redundantXSpace * saveScale);
bottom = height * saveScale - height - (2 * redundantYSpace * saveScale); setImageMatrix(matrix);}
}
......................................................................
#Code3
{
......................................................................
12. Finally run this app.
Subscribe to:
Posts (Atom)