I want to blur a Bitmap object in Android, currently I have the following code which blurs an ImageView:
private fun blurImageView(radius: Float) {
if (Build.VERSION.SDK_INT >= 31) {
binding.activityMainImageView.setRenderEffect(
RenderEffect.createBlurEffect(radius, radius, Shader.TileMode.CLAMP)
)
}
}
I want to get the underlying Bitmap object, so I tried to achieve that by doing the following:
binding.activityMainImageView.drawToBitmap()
But it doesn't seem to be working.
So how would I go around simply blurring a Bitmap object, is this possible with RenderScript at all? If not, what are my options to create a blur effect on a Bitmap object and get the underlying Bitmap object?
The developer documentation has given no info on how you could go around doing this.
You can create a bitmap blur effect in Android using RenderScript API!
The code maybe like this:
public Bitmap blur(Bitmap image) {
if (null == image){
return null;
}
Bitmap outputBitmap = Bitmap.createBitmap(image);
final RenderScript renderScript = RenderScript.create(this);
Allocation tmpIn = Allocation.createFromBitmap(renderScript, image);
Allocation tmpOut = Allocation.createFromBitmap(renderScript, outputBitmap);
//Intrinsic Gausian blur filter
ScriptIntrinsicBlur theIntrinsic = ScriptIntrinsicBlur.create(renderScript, Element.U8_4(renderScript));
theIntrinsic.setRadius(25); //should be 0-25
theIntrinsic.setInput(tmpIn);
theIntrinsic.forEach(tmpOut);
tmpOut.copyTo(outputBitmap);
return outputBitmap;
}
Then use:
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.test_pic);
Bitmap blurredBitmap = blur(bitmap);
Hope this can help you!
Related
How can I add a blur effect to a background in an Android app? I would like to know some source with the resources and the steps to add this effect. I understand that I have to add a filter, but I don't know where I am going to add it Please can someone help me? I will put the layout of the section that I want to change, As you can see, it has a normal background, but I want to put the blur effect on that section
<?xml version="1.0" encoding="utf-8" ?>
Here are some libraries for you:
https://github.com/Manabu-GT/EtsyBlur
https://github.com/Manabu-GT/GlassView
Usually, we call this feature Glass View, so you can also google it.
You can try to use RenderScript to blur the Bitmap of image:
public Bitmap blurBitmap(Bitmap bitmap,Context context){
//Let's create an empty bitmap with the same size of the bitmap we want to blur
Bitmap outBitmap = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
//Instantiate a new Renderscript
RenderScript rs = RenderScript.create(context);
//Create an Intrinsic Blur Script using the Renderscript
ScriptIntrinsicBlur blurScript = null;
if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.JELLY_BEAN_MR1) {
blurScript = ScriptIntrinsicBlur.create(rs, Element.U8_4(rs));
//Create the Allocations (in/out) with the Renderscript and the in/out bitmaps
Allocation allIn = Allocation.createFromBitmap(rs, bitmap);
Allocation allOut = Allocation.createFromBitmap(rs, outBitmap);
//Set the radius of the blur
blurScript.setRadius(25.f);
//Perform the Renderscript
blurScript.setInput(allIn);
blurScript.forEach(allOut);
//Copy the final bitmap created by the out Allocation to the outBitmap
allOut.copyTo(outBitmap);
}
//recycle the original bitmap
bitmap.recycle();
//After finishing everything, we destroy the Renderscript.
rs.destroy();
return outBitmap;
}
public Bitmap drawableToBitmap(Drawable drawable) {
int width = drawable.getIntrinsicWidth();
int heigh = drawable.getIntrinsicHeight();
drawable.setBounds(0, 0, width, heigh);
Bitmap.Config config = drawable.getOpacity() != PixelFormat.OPAQUE ? Bitmap.Config.ARGB_8888
: Bitmap.Config.RGB_565;
Bitmap bitmap = Bitmap.createBitmap(width, heigh, config);
Canvas canvas = new Canvas(bitmap);
drawable.draw(canvas);
return bitmap;
}
public void blurImage(View imageView, Context context){
Drawable drawable = imageView.getBackground();
Bitmap bitmap = drawableToBitmap(drawable);
Bitmap out = blurBitmap(bitmap,context);
BitmapDrawable bitmapDrawable = new BitmapDrawable(context.getResources(),
out);
imageView.setBackground(bitmapDrawable);
}
Use it with a view id is view in a Activity:
View view = findViewById(R.id.view);
blurImage(view,this);
I am trying to make my image as darker blur.How can I do that darker blur?
I am making my image as blur ,working fine but that one not darker.That too I am using Network image view,my images are dynamic coming from service api. How can I make my images darker blur.
Thanks in advance.
I am using the below code.
public static Bitmap blur(Context ctx, Bitmap image) {
int width = Math.round(image.getWidth() * BITMAP_SCALE);
int height = Math.round(image.getHeight() * BITMAP_SCALE);
Bitmap inputBitmap = Bitmap.createScaledBitmap(image, width, height, false);
Bitmap outputBitmap = Bitmap.createBitmap(inputBitmap);
RenderScript rs = RenderScript.create(ctx);
ScriptIntrinsicBlur theIntrinsic = ScriptIntrinsicBlur.create(rs, Element.U8_4(rs));
Allocation tmpIn = Allocation.createFromBitmap(rs, inputBitmap);
Allocation tmpOut = Allocation.createFromBitmap(rs, outputBitmap);
theIntrinsic.setRadius(BLUR_RADIUS);
theIntrinsic.setInput(tmpIn);
theIntrinsic.forEach(tmpOut);
tmpOut.copyTo(outputBitmap);
return outputBitmap;
}
you can use setColorFilter
imageView =(ImageView) findViewById(R.id.image_view) ;
imageView.getDrawable().setColorFilter(0x76ffffff, PorterDuff.Mode.MULTIPLY );
average black color 0xff555555
Check my answer here
or you might like to work with this github project https://github.com/wasabeef/Blurry
Blurry.with(context)
.radius(10)
.sampling(8)
.color(Color.argb(66, 255, 255, 0))
.async()
.onto(rootView);
Hello I have a problem with blur images..
I want in one Imageview set blur background and original image..
I try put all of one imageview.. now I testing two imageviews but it's the same..
my code
// Then later, when you want to display image
ImageLoader.getInstance().displayImage(listKone.get(i).getCestaObrazok(), imgHorse); // Default options will be used
// ↑ thise method have link where are my image and download image and show it in imgHorse ImageView
imgHorseB=imgHorse;
ImageLoader.getInstance().displayImage(listKone.get(i).getCestaObrazok(), imgHorseB); // Default options will be used
BitmapDrawable drawable = (BitmapDrawable) imgHorseB.getDrawable();
Bitmap bitmap = drawable.getBitmap();
Bitmap blurredBitmap = blur(bitmap);
imgHorseB.setImageBitmap(blurredBitmap);
public Bitmap blur(final Bitmap image) {
if (null == image) return null;
Bitmap outputBitmap = Bitmap.createBitmap(image);
final RenderScript renderScript = RenderScript.create(activity);
Allocation tmpIn = Allocation.createFromBitmap(renderScript, outputBitmap);
Allocation tmpOut = Allocation.createFromBitmap(renderScript, outputBitmap);
//Intrinsic Gausian blur filter
ScriptIntrinsicBlur theIntrinsic = ScriptIntrinsicBlur.create(renderScript, Element.U8_4(renderScript));
theIntrinsic.setRadius(BLUR_RADIUS);
theIntrinsic.setInput(tmpIn);
theIntrinsic.forEach(tmpOut);
tmpOut.copyTo(outputBitmap);
return outputBitmap;
}
after methode blur have blure image in all bitmaps.. If debbug code blur effect nothing but on thise line theIntrinsic.forEach(tmpOut);is blur image in both bitmapsimage and enter code here I don't know why..
and after finish thise methode blur image is in bluredBitmap and bitmap but it's wrong..
Please help me
#SuppressLint("NewApi")
public static Bitmap blurRenderScript(Context context,Bitmap smallBitmap, int radius) {
try {
smallBitmap = RGB565toARGB888(smallBitmap);
} catch (Exception e) {
e.printStackTrace();
}
Bitmap bitmap = Bitmap.createBitmap(
smallBitmap.getWidth(), smallBitmap.getHeight(),
Bitmap.Config.ARGB_8888);
RenderScript renderScript = RenderScript.create(context);
Allocation blurInput = Allocation.createFromBitmap(renderScript, smallBitmap);
Allocation blurOutput = Allocation.createFromBitmap(renderScript, bitmap);
ScriptIntrinsicBlur blur = ScriptIntrinsicBlur.create(renderScript,
Element.U8_4(renderScript));
blur.setInput(blurInput);
blur.setRadius(radius); // radius must be 0 < r <= 25
blur.forEach(blurOutput);
blurOutput.copyTo(bitmap);
renderScript.destroy();
return bitmap;
}
Bitmap blurred = blurRenderScript(activity,bitmap, 25);
//second parametre is radius
imgHorseB.setScaleType(ImageView.ScaleType.FIT_XY);
imgHorseB.setImageBitmap(blurred);
I want blur to ImageView
This code not work and on ScriptIntrinsicBlur line force close
Blur Class :
private static final float BLUR_RADIUS = 20f;
public Bitmap blur(Bitmap image) {
if (null == image)
return null;
Bitmap outputBitmap = Bitmap.createBitmap(image);
final RenderScript renderScript = RenderScript.create(this);
Allocation tmpIn = Allocation.createFromBitmap(renderScript, image);
Allocation tmpOut = Allocation.createFromBitmap(renderScript, outputBitmap);
ScriptIntrinsicBlur theIntrinsic = ScriptIntrinsicBlur.create(renderScript, Element.U8_4(renderScript));
theIntrinsic.setRadius(BLUR_RADIUS);
theIntrinsic.setInput(tmpIn);
theIntrinsic.forEach(tmpOut);
tmpOut.copyTo(outputBitmap);
return outputBitmap;
}
Set blur code :
bmp = BitmapFactory.decodeStream(urlImage.openConnection().getInputStream());
bmp = blur(bmp);
imgPost.setImageBitmap(bmp);
And erro log :
http://i.stack.imgur.com/sL2BT.jpg
Per the ScriptIntrinsicBlur documentation, the class was added in API 17 and therefore does not exist prior to that. You can use the Renderscript Support Library to gain access Renderscript back to API 8, including android.support.v8.renderscript.ScriptIntrinsicBlur
Using the glide android library I get the image as a bitmap (see glide documentation) and then I try to blur the bitmap, using renderscript and ScriptIntrinsicBlur, which is a gaussian blur. (Taken from this stackoverflow post)
Glide.with(getApplicationContext())
.load(ImageUrl)
.asBitmap()
.into(new SimpleTarget<Bitmap>(300,200) {
#Override
public void onResourceReady(Bitmap resource, GlideAnimation glideAnimation) {
RenderScript rs = RenderScript.create(mContext); // context = this. this referring to the activity
final Allocation input = Allocation.createFromBitmap( rs, resource, Allocation.MipmapControl.MIPMAP_NONE, Allocation.USAGE_SCRIPT );
final Allocation output = Allocation.createTyped( rs, input.getType() );
final ScriptIntrinsicBlur script = ScriptIntrinsicBlur.create( rs, Element.U8_4( rs ) );
script.setRadius(8f);
script.setInput(input);
script.forEach(output);
output.copyTo(resource);
mImageView.setImageBitmap(resource);
}
});
The problem is that this is the output, rather than a blurred image:
Any help would be much appreciated thanks. :)
As it's support only U8_4 and U8 format. You'll have to convert your bitmap to ARGB_8888 before you send it to RenderScript by this example.
Bitmap U8_4Bitmap;
if(sentBitmap.getConfig() == Bitmap.Config.ARGB_8888) {
U8_4Bitmap = sentBitmap;
} else {
U8_4Bitmap = sentBitmap.copy(Bitmap.Config.ARGB_8888, true);
}
//==============================
Bitmap bitmap = Bitmap.createBitmap(U8_4Bitmap.getWidth(), U8_4Bitmap.getHeight(), U8_4Bitmap.getConfig());
final RenderScript rs = RenderScript.create(context);
final Allocation input = Allocation.createFromBitmap(rs,
U8_4Bitmap,
Allocation.MipmapControl.MIPMAP_NONE,
Allocation.USAGE_SCRIPT);
final Allocation output = Allocation.createTyped(rs, input.getType());
final ScriptIntrinsicBlur script = ScriptIntrinsicBlur.create(rs, output.getElement());
script.setRadius(radius);
script.setInput(input);
script.forEach(output);
output.copyTo(bitmap);
rs.destroy();
return bitmap;
Is it possible that the input image is not a U8_4 (i.e. RGBA8888)? Can you switch from using "Element.U8_4(rs)" to instead use "output.getElement()"? That would probably do the right thing. If it turns out that the image is not RGBA8888, you might at least get a Java exception describing what the underlying format is (if it isn't something supported with our Blur).