Android 毛玻璃效果实现(Glide)

    xiaoxiao2025-04-17  13

    Android 毛玻璃效果实现

    前段时间公司要做一个类似于慕课网APP个人界面的毛玻璃的效果,如下图所示,个人头像是从服务器获取的,找了很多资料,都没有找到简洁方便的实现方式,后来在Github上看到glide-transformations这个库,如获至宝,这个库和Glide一起使用,有很多常用的效果都可以通过它搞定,如:圆角图片等等,并且使用起来很简单,通过它毛玻璃效果可以很很轻松地实现啦,一行代码就搞定。

    首先要导入两个库

    compile 'com.github.bumptech.glide:glide:3.7.0' compile 'jp.wasabeef:glide-transformations:2.0.1'

    布局文件:

    <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content"> <ImageView android:id="@+id/iv_blur" android:layout_width="match_parent" android:layout_height="200dp" /> <ImageView android:id="@+id/iv_avatar" android:layout_width="60dp" android:layout_height="60dp" android:layout_centerInParent="true"/> </RelativeLayout> </LinearLayout>

    代码:

    /** * Created by keithwang on 16/8/14. */ public class BlurTestActivity extends BaseActivity{ private ImageView blurImageView; private ImageView avatarImageView; @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_blur_test); findViews(); initData(); } private void findViews(){ blurImageView = (ImageView) findViewById(R.id.iv_blur); avatarImageView = (ImageView) findViewById(R.id.iv_avatar); } private void initData(){ Glide.with(this).load(R.drawable.placeholder_avatar) .bitmapTransform(new BlurTransformation(this, 25), new CenterCrop(this)) .into(blurImageView); Glide.with(this).load(R.drawable.placeholder_avatar) .bitmapTransform(new CropCircleTransformation(this)) .into(avatarImageView); } }

    运行起来效果如下所示: BlurTransformation 这个就是毛玻璃的实现类

    转载请注明原文地址: https://ju.6miu.com/read-1298169.html
    最新回复(0)