how to blur image in android and set it to relative layout

Question

I want to blur image like this and I need to set it to the RelativeLayout and it should create blur image like this image given below :

I used blurry library from github and it does all my work using this code but I can set it to Imageview only not to RelativeLayout.

Blurry.with(context).capture(view).into(imageView);

So, please give me the solution.

Try with `onto()` mehtod of blurry for relative layout. For ex. `Blurry.with(context).radius(25).sampling(2).onto((ViewGroup) rootView);` — Priyank Patel, Apr 17 '17 at 06:31
@PriyankPatel but it is not working properly it does more blur when I launch new activity. — Pedo, Apr 17 '17 at 11:54

score 2 · Answer 1 · answered Apr 17 '17 at 06:29

May this helps you

Maintain Height and Width by yourself

Example:-

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:adjustViewBounds="true"
        android:alpha="0.3"
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        android:scaleType="fitXY"
        android:src="@drawable/abcd" />
</RelativeLayout>

It is not solution which I needed. It just decrease the brightness of my image thank you. — Pedo, Apr 17 '17 at 11:55

score 1 · Answer 2 · answered Apr 17 '17 at 06:35

You can use BlurTransformation of Picasso and load your image in a custom target(In your case that is RelativeLayout) like

Picasso  
    .with(context)
    .load(UsageExampleListViewAdapter.eatFoodyImages[0])
    .transform(new BlurTransformation(context))
    .into(new Target() {
            @Override
            public void onBitmapLoaded(Bitmap bitmap, Picasso.LoadedFrom from) {

            }

            @Override
            public void onBitmapFailed(Drawable errorDrawable) {

            }

            @Override
            public void onPrepareLoad(Drawable placeHolderDrawable) {

            }
    });

thanks but this way is just blur upto 25 radius and i want it upto 50 or 100 in my question the image which i uploaded has more blur radius and i want that. Please give me a way which does this. And sorry for very late reply because my laptop was not working for a month. — Pedo, May 22 '17 at 07:21

score 1 · Answer 3 · answered Apr 17 '17 at 08:47

1

It can be done without using any library files, just create a layer-list XML file in the drawable folder and use it.

For blurry effect, create blur.xml file in the drawable folder.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/nature" /> <!-- change @drawable/nature with your desired image -->
    <item>
        <shape android:shape="rectangle">

<!-- You can use from 1% transparency to 100% transparency, according to your need,-->
            <solid
                android:color="#80FFFFFF"/>  <!-- Here transparency level is 80%-->
        </shape>
    </item>
    </layer-list>

Now use it as a background image in your layout file.

<RelativeLayout 
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/blur">

Done,...

answered Apr 17 '17 at 08:47

Prashant Kumar Sharma

1,120
1
11
21

Have you properly implemented it.. i have used the same and working properly in my project.. – Prashant Kumar Sharma Apr 17 '17 at 17:02
Okay i will try it one more time – Pedo Apr 18 '17 at 16:22
5

This is not blur. It's just transparency, which is you can simply use opacity attribute in layout XML. – c-an Jun 21 '20 at 11:03
It is not blurred, it works as transparency only. I tried to use instead nature drawable with shape white, grey - it is only transparency. – kirkadev Mar 02 '22 at 20:36

score 0 · Answer 4 · answered Apr 17 '17 at 06:30

0

Try RenderScript and FastBlur techniques explained by trickyandroid.com

http://trickyandroid.com/advanced-blurring-techniques/

answered Apr 17 '17 at 06:30

PEHLAJ

9,980
9
41
53

amit bansode · Answer 5 · 2023-03-08T13:05:15.217

Whoever want more blurry effect, please check the following class I have used. Note the for loop -> more time you loop more you get blurred. (For above question ImageView can be use inside RelativeLayout)

public class BlurTransformation implements Transformation {

RenderScript rs;

public BlurTransformation(Context context) {
    super();
    rs = RenderScript.create(context);
}

@Override
public Bitmap transform(Bitmap bitmap) {
    // Create another bitmap that will hold the results of the filter.
    Bitmap blurredBitmap = bitmap.copy(Bitmap.Config.ARGB_8888, true);
    for (int i = 0; i < 10; i++) {


        // Allocate memory for Renderscript to work with
        Allocation input = Allocation.createFromBitmap(rs, blurredBitmap, Allocation.MipmapControl.MIPMAP_FULL, Allocation.USAGE_SHARED);
        Allocation output = Allocation.createTyped(rs, input.getType());

        // Load up an instance of the specific script that we want to use.
        ScriptIntrinsicBlur script = ScriptIntrinsicBlur.create(rs, Element.U8_4(rs));
        script.setInput(input);

        // Set the blur radius
        script.setRadius(25);

        // Start the ScriptIntrinisicBlur
        script.forEach(output);

        // Copy the output to the blurred bitmap
        output.copyTo(blurredBitmap);
    }
    bitmap.recycle();

    return blurredBitmap;
}

@Override
public String key() {
    return "blur";
}
}

Using this with picasso:

List<Transformation> transformations = new ArrayList<>();
transformations.add(new BlurTransformation(mContext));

Picasso.get().load(Uri.parse(url))
              .tag(mContext)
              .placeholder(defaultresource)
              .transform(transformations)
              .placeholder(defaultresource)
              .into(imageview, new Callback() {
                        @Override
                        public void onSuccess() { }

                        @Override
                        public void onError(Exception e) {
                        }
                    });

Hope this will help you.

how to blur image in android and set it to relative layout

5 Answers5