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