Posts

Flash light app in Sketchware pro

Image
 Follow the steps given below to create a Flash light android app in Sketchware pro. 1. Create a new app in Sketchware pro. 2. Switch on AppCompat and Design. 3. In View area (main.xml), add a Linear Vertical with gravity set to center_horizontal and center_vertical. Inside this add an ImageView imageview1 . 4. In image manager, add two images ic_flash_on_black and ic_flash_off_black . 5. For imageview1, select ic_flash_off_black as image. 6. In MainActivity, add import event and add following imports in it. import android.hardware.camera2.CameraManager; import android.hardware.camera2.CameraAccessException; 7. Add Camera Component cam. 8. Create two boolean variables hasCameraFlash and flashLightStatus and add a String variable cameraId . 9. Add a custom variable cameraManager of type CameraManager. 10. In onCreate , define hasCameraFlash, cameraManager, and cameraId. Register a callback for cameraManager CameraManager.TorchCallback to listen for changes in the flashlight stat...

Add encryption in firebase group chat

Image
 Brief summary of this post: 1. The user enters a passphrase which is unique to the group chat and has to be shared to the user for granting him access. 2. The passphrase is saved in SharedPreferences. 3. A master key is generated using the passphrase. 4. While sending message, a secret key is generated using the master key and message ID. The message is encrypted using this secret key. 5. On retrieving message, it is decrypted using a secret key generated using master key and message ID. Steps: 1. In Button to enter the group chat page, add a dialog box (dialog2) with EditText (dialog_text1) where user can enter the passphrase. On entering the passphrase it is saved in SharedPreferences (sp:sp) and user moves to group chat activity using intent component. Code to add an EditText to Dialog component: final EditText dialog_text1 = new EditText(AdminpageActivity.this); dialog_text1.setLayoutParams(linear2.getLayoutParams()); dialog2.setView(dialog_text1); Code to get text from EditTe...

Using Ambilwarna Color Picker in settings to set text color and background color

Image
To add Ambilwarna Color Picker library in Sketchware. 1. In the Sketchware project, in options menu select Local library . Clicking on options menu will display the dexer dialog box as shown in image below. Select D8 or Dx in the dialog. 2. It will show dialog to write library dependency. Write the following dependency - com.github.yukuku:ambilwarna:2.0.1 and click on start. It will search and download the library in Sketchware. 3. Select the Ambilwarna library in Local library. To create the settings project, follow the steps given below: 1. In main.xml , add a Settings button and and EditText edittext1 . 2. In MainActivity , add a Shared preferences component s_pref:s_pref and an Intent component intent . 3. In onStart event, use following codes to retrieve text color and background color from shared preferences and set the text color and background color of edittext1. int textcolor = s_pref.getInt("textcolor", Color.BLACK); edittext1.setTextColor(textcolor); int bgco...

Retrieve contact list in Sketchware

Image
 To read contact list in Sketchware pro, follow the steps given below. 1. In the Sketchware project, in main.xml, add a ListView. Also add a custom view for ListView items. For the ListView, select the custom view. 2. Switch on AppCompat and design. 3. In permission manager, select android.permission.READ_CONTACTS . 4. In Activity, add Import event. Put following codes in the import event: import android.Manifest; import android.content.pm.PackageManager; import android.database.Cursor; import android.provider.ContactsContract; import androidx.core.app.ActivityCompat; import androidx.core.content.ContextCompat; 5. Create a more block getAllContacts of type List Map. In this more block, put following codes: ArrayList<HashMap<String, Object>> contactList = new ArrayList<>(); ContentResolver contentResolver = MainActivity.this.getContentResolver(); Cursor cursor = contentResolver.query(ContactsContract.CommonDataKinds.Phone.CONTENT_URI, null, null, null, ...

A simple sqlite example in Sketchware

Image
 In this example, the user can save details of pupils (name, age and place) in sqlite database in android app, and view the data in a ListView. Create a new project in Sketchware. In Options/Configuration, click on Java/Kotlin manager. Create a new Java class file with name DbHandler. Put following codes as contents of this DbHandler.java file. package com.my.newproject2; import android.content.ContentValues; import android.content.Context; import android.database.sqlite.SQLiteDatabase; import android.database.sqlite.SQLiteOpenHelper; import android.database.Cursor; public class DbHandler extends SQLiteOpenHelper { private static final String DB_NAME = "studentdb"; private static final int DB_VERSION = 1; private static final String TABLE_NAME = "students"; private static final String ID_COL = "id"; private static final String NAME_COL = "name"; private static final String AGE_COL = "age"; private s...

An app for encrypting text in Sketchware

Image
Create a new app with four pages or Activity: MainActivity, NewnoteActivity, OldnoteActivity, ViewnoteActivity . In main.xml add two buttons. On button_new click, move to NewnoteActivity. On button_old click, move to OldnoteActivity. In newnote.xml View, add an Edittext (edittext1) and a Button (fab1) . In NewnoteActivity , add a Shared preferences component (sp:sp) . Add a more block called newitems and put following code in it: } byte[] cipherText; byte[] secretKeyen; byte[] IV = new byte[16]; { Add another more block called encrypt and put following code in it: } public static byte[] encrypt(byte[] plaintext, javax.crypto.SecretKey key, byte[] IV) throws Exception{ javax.crypto.Cipher cipher = javax.crypto.Cipher.getInstance("AES"); javax.crypto.spec.SecretKeySpec keySpec = new javax.crypto.spec.SecretKeySpec(key.getEncoded(), "AES"); javax.crypto.spec.IvParameterSpec ivSpec = new javax.crypto.spec.IvParameterSpec(IV); cipher.init(javax.crypto...

Creating a Drawing View in Sketchware

Image
 To create a DrawingView with undo button, follow the instructions given below. 1. Create a new project in Sketchware. 2. In main.xml , add a LinearLayout linear1 with height wrap_content, weight 1, and padding 0. Add a LinearHorizontal below it, containing following ImageViews: imageview_stroke_width , imageview_stroke_color , imageview_background , imageview_undo,  and  imageview_clear. 3. Create a more block canvas and put following codes in it. Here we create a new View class called DrawingView and a new class called PathPaint. } DrawingView dv; private Paint mPaint; private Canvas mCanvas; private ArrayList<PathPaint> all_paths = new ArrayList<>(); public class DrawingView extends View { private Bitmap mBitmap; private Paint mBitmapPaint; Context context; private Paint circlePaint; private Path circlePath; private Path mPath; public DrawingView(Context c) { super(c); context=c; mPath = new Path(); mBitmapPaint = new Paint(Paint.DITHER_FLAG); circlePath...

Create a full screen dialog with CropImageView

Image
To create a fullscreen dialog with CropImageView in Sketchware, follow the steps given below. 1. Add an ImageView imageview1 for displaying image. 2. Add a FilePicker component fp: image/* for picking images. 3. In imageview1 onClick event use block FilePicker fp pick files . 4. Download CropUtils.zip from this url: http://apktutor.com/wp-content/uploads/2021/11/CropUtils.zip 5. Extract CropUtils.java at .sketchware/mysc/(Project number)/app/src/main/java/(package name)/CropUtils.java 6. Open CropUtils.java and change package name ( package com.my.dmchat; ) to your project's package name. 7. Create a more block extra . Here declare a CropImageView crp , a Bitmap image and define rotateBitmap(Bitmap) . } CropUtils.CropImageView crp; Bitmap image; public Bitmap rotateBitmap(Bitmap bitmap){ android.graphics.Matrix matrix = new android.graphics.Matrix(); matrix.postScale((float)1, (float)1); matrix.postRotate(90); Bitmap bitmap2 = Bitmap.createBitmap(bitmap, 0, 0, bitmap.getWidt...

Image Slider using ViewPager in Sketchware

Image
 To add a front screen with sliding images using ViewPager in Sketchware, follow the instructions given below. 1. Create a new project in Sketchware. 2. Switch on AppCompat and design. 3. In main.xml add a  linear1 and linear2. Set padding of both these linears to 0. Set gravity of linear2 to center_horizontal. We will add ViewPager to linear1, and TabLayout to linear2. 4. Add four images: store, home, gift, and fast_food. 5. Create a CustomView custom2.xml . In this View, add an ImageView with scale type fit_center. 6. Create a more block extra . Add following codes in it. } androidx.viewpager.widget.ViewPager viewPager1; int[] image_list = { R.drawable.store, R.drawable.home, R.drawable.gift, R.drawable.fast_food }; private class MyPagerAdapter extends androidx.viewpager.widget.PagerAdapter { public int getCount() { return image_list.length; } public Object instantiateItem(ViewGroup collection, int position) { View view = getLayoutInflater().inflate(R.layout.custom2, null);...

Get frames in a video in Sketchware

Image
 This sample shows how to get the frames in a video and display it in a GridView in Sketchware. 1. Create a new project in Sketchware. 2. In main.xml add a LinearLayout linear1 . Below this add a ListView listview1 . 3. Create a more block custom.xml . Add an ImageView imageview1 in it. 4. For listview1 , select custom.xml as Custom View. Set height of linear1 to match_parent . 5. In View main.xml add a Floating Action Button _fab . 6. Add a FilePicker Component fp: video/* , and a Camera component cam . 7. Create a More block extra and declare GridView gridview1 and a list of bitmap images frames using following codes: } GridView gridview1; ArrayList<Bitmap> frames; { 8. Create a String path , a Map variable map , a List String list and a List Map imagelist . 9. In onCreate event put following codes. gridview1 = new GridView(this); gridview1.setLayoutParams(new GridView.LayoutParams(GridView.LayoutParams.MATCH_PARENT, GridView.LayoutParams.MATCH_PARENT)); gridview1....