Create Imageview with rounded corners in Sketchware

To create an ImageView showing image with rounded corners follow the steps given below.

1. In your Sketchware android project, add an ImageView imageview1, and set your desired image in imageview1.


2. In LOGIC area of your project, in onCreate event, add two add source directly blocks.

3. In the first add source directly block, add the following code which creates a bitmap image from imageview1.
Bitmap bm = ((android.graphics.drawable.BitmapDrawable) imageview1.getDrawable()).getBitmap();

4. Then apply class getRoundedCornerBitmap(Bitmap, int) to round the corners of bitmap image, and then set it as image of imageview1, using following code in the same block.
imageview1.setImageBitmap(getRoundedCornerBitmap(bm, 360));


Note that in above code, imageview1 is id of Imageview and it should be changed as per the id of your Imageview.

The underlined text 360 is the extent to which the corners are rounded. It can be changed between 0 and 360 as per the requirement. 360 is maximum, whereas 0 is minimum. 0 creates a square or rectangle.

5. In second add source directly block, add the following code which defines the class getRoundedCornerBitmap(Bitmap, int).

}
public static Bitmap getRoundedCornerBitmap(Bitmap bitmap, int pixels) { Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888); Canvas canvas = new Canvas(output); final int color = 0xff424242; final Paint paint = new Paint(); final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight()); final RectF rectF = new RectF(rect); final float roundPx = pixels; paint.setAntiAlias(true); canvas.drawARGB(0, 0, 0, 0); paint.setColor(color); canvas.drawRoundRect(rectF, roundPx, roundPx, paint); paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN)); canvas.drawBitmap(bitmap, rect, rect, paint); return output;


This should be the last block in onCreate event in Sketchware.

6. Save and run the project. You will find your image with rounded corners in Imageview.

Comments

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