BlurImageView

介绍:

Medium上采用了的一种新的图片load方式,先显示一张虚化图,再显示完整的图片。

运行效果:

使用说明:

MainActivity.java

package com.wingjay.blurimageview;
import android.os.Bundle;
import android.support.design.widget.FloatingActionButton;
import android.support.design.widget.Snackbar;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.text.TextUtils;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import com.wingjay.blurimageviewlib.BlurImageView;
import butterknife.Bind;
import butterknife.ButterKnife;
import butterknife.OnClick;
public class MainActivity extends AppCompatActivity {
    @Bind(R.id.blur_factor)
    EditText blurFactorEditText;
    @Bind(R.id.fast_blur_btn)
    Button fastBlurBtn;
    @Bind(R.id.blur_image_view)
    BlurImageView blurImageView;
    @Bind(R.id.full_blur_image_view)
    BlurImageView fullBlurImageView;
    boolean alreadyCompelete = false;
    int\[\] mediumSmRes = {
            R.drawable.medium_sm_1,
            R.drawable.medium_sm_2,
            R.drawable.medium_sm_3,
            R.drawable.medium_sm_4
    };
    int\[\] mediumNmRes = {
            R.drawable.medium_nm_1,
            R.drawable.medium_nm_2,
            R.drawable.medium_nm_3,
            R.drawable.medium_nm_4
    };
    String\[\] mediumSmUrl = {
            "https://cdn-images-1.medium.com/freeze/max/60/1*cDmQ2XlMGowTZNIf4oOHjw.jpeg?q=20",
            "https://cdn-images-1.medium.com/freeze/max/60/1*hBp9i_LZHGwKfq7plvjWxQ.jpeg?q=20",
            "https://cdn-images-1.medium.com/freeze/max/30/1*yd_YDN3dVyrSp_o7YHOKPg.jpeg?q=20",
            "https://cdn-images-1.medium.com/freeze/max/60/1*hMQ9_nBW3LOHCk3rQSRSbw.jpeg?q=20"
    };
    String\[\] mediumNmUrl = {
            "https://cdn-images-1.medium.com/max/1600/1*cDmQ2XlMGowTZNIf4oOHjw.jpeg",
            "https://cdn-images-1.medium.com/max/2000/1*hBp9i_LZHGwKfq7plvjWxQ.jpeg",
            "https://cdn-images-1.medium.com/max/2000/1*yd_YDN3dVyrSp_o7YHOKPg.jpeg",
            "https://cdn-images-1.medium.com/max/2000/1*hMQ9_nBW3LOHCk3rQSRSbw.jpeg"
    };
    int currentIndex = 0;
    int getResIndex() {
        if (currentIndex > 3) {
            currentIndex = currentIndex - 4;
        }
        return currentIndex;
    }
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.bind(this);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
                        .setAction("Action", null).show();
            }
        });
    }
    @OnClick(R.id.fast_blur_btn)
    void doFastBlur() {
        if (!alreadyCompelete) {
            int blurFactor = getBlurFactor();
            fullBlurImageView.setBlurFactor(blurFactor);
            fullBlurImageView.setFullImageByUrl(mediumSmUrl\[getResIndex()\], mediumNmUrl\[getResIndex()\]);
            blurImageView.setBlurFactor(blurFactor);
            blurImageView.setBlurImageByUrl(mediumSmUrl\[getResIndex()\]);
            alreadyCompelete = true;
        } else {
            blurImageView.clear();
            fullBlurImageView.clear();
            currentIndex++;
            alreadyCompelete = false;
        }
    }
    int getBlurFactor() {
        if (TextUtils.isEmpty(blurFactorEditText.getText())) {
            return BlurImageView.DEFAULT_BLUR_FACTOR;
        }
        return Integer.parseInt(blurFactorEditText.getText().toString());
    }
    @Override
    protected void onDestroy() {
        blurImageView.cancelImageLoadForSafty();
        fullBlurImageView.cancelImageLoadForSafty();
        super.onDestroy();
    }
}

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="com.wingjay.blurimageview.MainActivity">
    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">
        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay" />
    </android.support.design.widget.AppBarLayout>
    <include layout="@layout/content_main" />
    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:visibility="gone"
        android:src="@android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>

content_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.wingjay.blurimageview.MainActivity"
    tools:showIn="@layout/activity_main">
    <ScrollView
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            >
            <EditText
                android:id="@+id/blur_factor"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Enter your blur factor"
                android:inputType="number"
                />
            <Button
                android:id="@+id/fast_blur_btn"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="Go BlurImageView!"
                android:textAllCaps="false"
                />
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                >
                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:gravity="center"
                    android:textColor="#000000"
                    android:text="Here is a blur imageView \\n which can load a image and blur it"
                    />
                <com.wingjay.blurimageviewlib.BlurImageView
                    android:id="@+id/blur_image_view"
                    android:layout_width="match_parent"
                    android:layout_height="190dp"
                    />
            </LinearLayout>
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                >
                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:gravity="center"
                    android:textColor="#000000"
                    android:text="Here is a Full blur imageView \\n which will load two images, small one and normal one
                the small one will be blurry and once the normal one is loaded, replace the small one automatically."
                    />
                <com.wingjay.blurimageviewlib.BlurImageView
                    android:id="@+id/full_blur_image_view"
                    android:layout_width="match_parent"
                    android:layout_height="190dp"
                    />
            </LinearLayout>
        </LinearLayout>
    </ScrollView>
</RelativeLayout>
已下载
0