分享一个页面加载状态布局
public class LyLoadingLayout extends FrameLayout {
public final static int Success = 0;
public final static int Empty = 1;
public final static int Error = 2;
public final static int No_Network = 3;
public final static int Loading = 4;
private int mState;
private Context mContext;
private View loadingPage;
private View errorPage;
private View emptyPage;
private View networkPage;
private View defineLoadingPage;
private ImageView errorImg;
private ImageView emptyImg;
private ImageView networkImg;
private TextView errorText;
private TextView emptyText;
private TextView networkText;
private TextView errorReloadBtn;
private TextView networkReloadBtn;
private View contentView;
private OnReloadListener listener;
//是否一开始显示contentview,默认不显示
private boolean isFirstVisible;
//配置
private static Config mConfig = new Config();
private static String emptyStr = "暂无数据";
private static String errorStr = "请求错误,请重试";
private static String netwrokStr = "找不到网络";
private static String reloadBtnStr = "点击刷新";
private static int emptyImgId = R.drawable.empty_com;
private static int errorImgId = R.drawable.empty_com;
private static int networkImgId = R.drawable.default_no_network;
private static int reloadBtnId = R.drawable.verify_shape_main;
private static int tipTextSize = 14;
private static int buttonTextSize = 14;
private static int tipTextColor = 0xff999999;
private static int buttonTextColor = 0xff999999;
private static int buttonWidth = -1;
private static int buttonHeight = -1;
private static int loadingLayoutId = R.layout.widget_loading_page;
public LyLoadingLayout(Context context, AttributeSet attrs) {
super(context, attrs);
this.mContext = context;
TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.LoadingLayout);
isFirstVisible = a.getBoolean(R.styleable.LoadingLayout_isFirstVisible, false);
a.recycle();
}
public LyLoadingLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
this.mContext = context;
}
public LyLoadingLayout(Context context) {
super(context);
this.mContext = context;
}
/**
* contentView 当加载完成xml后执行
*/
@Override
protected void onFinishInflate() {
super.onFinishInflate();
if (getChildCount() > 1) {
throw new IllegalStateException("LyLoadingLayout can host only one direct child");
}
contentView = this.getChildAt(0);
if (!isFirstVisible) {
contentView.setVisibility(View.GONE);
}
build();
}
private void build() {
loadingPage = LayoutInflater.from(mContext).inflate(loadingLayoutId, null);
errorPage = LayoutInflater.from(mContext).inflate(R.layout.widget_error_page, null);
emptyPage = LayoutInflater.from(mContext).inflate(R.layout.widget_empty_page, null);
networkPage = LayoutInflater.from(mContext).inflate(R.layout.widget_nonetwork_page, null);
defineLoadingPage = null;
networkPage.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
}
});
netwrokStr = "重新加载";
errorText = findViewById(errorPage, R.id.error_text);
emptyText = findViewById(emptyPage, R.id.empty_text);
networkText = findViewById(networkPage, R.id.no_network_text);
errorImg = findViewById(errorPage, R.id.error_img);
emptyImg = findViewById(emptyPage, R.id.empty_img);
networkImg = findViewById(networkPage, R.id.no_network_img);
errorReloadBtn = findViewById(errorPage, R.id.error_reload_btn);
networkReloadBtn = findViewById(networkPage, R.id.no_network_reload_btn);
errorReloadBtn.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
if (listener != null) {
listener.onReload(v);
}
}
});
networkReloadBtn.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
if (listener != null) {
listener.onReload(v);
}
}
});
errorText.setText(errorStr);
emptyText.setText(emptyStr);
networkText.setText(netwrokStr);
errorText.setTextSize(tipTextSize);
emptyText.setTextSize(tipTextSize);
networkText.setTextSize(tipTextSize);
errorText.setTextColor(ContextCompat.getColor(mContext, tipTextColor));
emptyText.setTextColor(ContextCompat.getColor(mContext, tipTextColor));
networkText.setTextColor(ContextCompat.getColor(mContext, tipTextColor));
errorImg.setImageResource(errorImgId);
emptyImg.setImageResource(emptyImgId);
networkImg.setImageResource(networkImgId);
errorReloadBtn.setBackgroundResource(reloadBtnId);
networkReloadBtn.setBackgroundResource(reloadBtnId);
errorReloadBtn.setText(reloadBtnStr);
networkReloadBtn.setText(reloadBtnStr);
errorReloadBtn.setTextSize(buttonTextSize);
networkReloadBtn.setTextSize(buttonTextSize);
errorReloadBtn.setTextColor(ContextCompat.getColor(mContext, buttonTextColor));
networkReloadBtn.setTextColor(ContextCompat.getColor(mContext, buttonTextColor));
if (buttonHeight != -1) {
errorReloadBtn.setHeight(dp2px(mContext, buttonHeight));
networkReloadBtn.setHeight(dp2px(mContext, buttonHeight));
}
if (buttonWidth != -1) {
errorReloadBtn.setWidth(dp2px(mContext, buttonWidth));
networkReloadBtn.setWidth(dp2px(mContext, buttonWidth));
}
this.addView(networkPage);
this.addView(emptyPage);
this.addView(errorPage);
this.addView(loadingPage);
}
/**
* 改变视图加载状态 需要手动触发
*
* @param state
* @param mLyLoadingLayout
*/
public void setLoadViewState(int state, LyLoadingLayout mLyLoadingLayout) {
if (mLyLoadingLayout == null) return;
if (state != mLyLoadingLayout.getStatus()) {
mLyLoadingLayout.setStatus(state);
}
}
/**
* 设置当天状态
*
* @param status Success:加载成功;Loading:加载中;
* Empty:数据为空;Error:加载失败
* No_Network:无网络
*/
public void setStatus(@Flavour int status) {
this.mState = status;
switch (status) {
case Success:
animateVisible(contentView);
emptyPage.setVisibility(View.GONE);
errorPage.setVisibility(View.GONE);
networkPage.setVisibility(View.GONE);
if (defineLoadingPage != null) {
animateGone(defineLoadingPage);
} else {
animateGone(loadingPage);
}
break;
case Loading:
contentView.setVisibility(View.GONE);
emptyPage.setVisibility(View.GONE);
errorPage.setVisibility(View.GONE);
networkPage.setVisibility(View.GONE);
if (defineLoadingPage != null) {
animateVisible(defineLoadingPage);
} else {
animateVisible(loadingPage);
}
break;
case Empty:
contentView.setVisibility(View.GONE);
animateVisible(emptyPage);
errorPage.setVisibility(View.GONE);
networkPage.setVisibility(View.GONE);
if (defineLoadingPage != null) {
animateGone(defineLoadingPage);
} else {
animateGone(loadingPage);
}
break;
case Error:
contentView.setVisibility(View.GONE);
emptyPage.setVisibility(View.GONE);
animateVisible(errorPage);
networkPage.setVisibility(View.GONE);
if (defineLoadingPage != null) {
animateGone(defineLoadingPage);
} else {
animateGone(loadingPage);
}
break;
case No_Network:
contentView.setVisibility(View.GONE);
emptyPage.setVisibility(View.GONE);
errorPage.setVisibility(View.GONE);
animateVisible(networkPage);
if (defineLoadingPage != null) {
animateGone(defineLoadingPage);
} else {
animateGone(loadingPage);
}
break;
default:
break;
}
}
/**
* View淡入
*/
public void animateVisible(View view) {
if (view == null) return;
view.setAlpha(0f);
view.setVisibility(View.VISIBLE);
view.animate().alpha(1f).setDuration(450).setListener(null);
}
/**
* View 淡出
*/
public void animateGone(final View view) {
if (view == null) return;
view.animate().alpha(0f).setDuration(400).setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
view.setVisibility(View.GONE);
}
});
}
/**
* 返回当前状态{Success, Empty, Error, No_Network, Loading}
*
* @return
*/
public int getStatus() {
return mState;
}
/**
* 设置Empty状态提示文本,仅对当前所在的地方有效
*
* @param text
* @return
*/
public LyLoadingLayout setEmptyText(String text) {
emptyText.setText(text);
return this;
}
/**
* 设置Error状态提示文本,仅对当前所在的地方有效
*
* @param text
* @return
*/
public LyLoadingLayout setErrorText(String text) {
errorText.setText(text);
return this;
}
/**
* 设置No_Network状态提示文本,仅对当前所在的地方有效
*
* @param text
* @return
*/
public LyLoadingLayout setNoNetworkText(String text) {
networkText.setText(text);
return this;
}
/**
* 设置Empty状态显示图片,仅对当前所在的地方有效
*
* @param id
* @return
*/
public LyLoadingLayout setEmptyImage(@DrawableRes int id) {
emptyImg.setImageResource(id);
return this;
}
/**
* 设置Error状态显示图片,仅对当前所在的地方有效
*
* @param id
* @return
*/
public LyLoadingLayout setErrorImage(@DrawableRes int id) {
errorImg.setImageResource(id);
return this;
}
/**
* 设置No_Network状态显示图片,仅对当前所在的地方有效
*
* @param id
* @return
*/
public LyLoadingLayout setNoNetworkImage(@DrawableRes int id) {
networkImg.setImageResource(id);
return this;
}
/**
* 设置Empty状态提示文本的字体大小,仅对当前所在的地方有效
*
* @param sp
* @return
*/
public LyLoadingLayout setEmptyTextSize(int sp) {
emptyText.setTextSize(sp);
return this;
}
/**
* 设置Error状态提示文本的字体大小,仅对当前所在的地方有效
*
* @param sp
* @return
*/
public LyLoadingLayout setErrorTextSize(int sp) {
errorText.setTextSize(sp);
return this;
}
/**
* 设置No_Network状态提示文本的字体大小,仅对当前所在的地方有效
*
* @param sp
* @return
*/
public LyLoadingLayout setNoNetworkTextSize(int sp) {
networkText.setTextSize(sp);
return this;
}
/**
* 设置Empty状态图片的显示与否,仅对当前所在的地方有效
*
* @param bool
* @return
*/
public LyLoadingLayout setEmptyImageVisible(boolean bool) {
if (bool) {
emptyImg.setVisibility(View.VISIBLE);
} else {
emptyImg.setVisibility(View.GONE);
}
return this;
}
/**
* 设置Error状态图片的显示与否,仅对当前所在的地方有效
*
* @param bool
* @return
*/
public LyLoadingLayout setErrorImageVisible(boolean bool) {
if (bool) {
errorImg.setVisibility(View.VISIBLE);
} else {
errorImg.setVisibility(View.GONE);
}
return this;
}
/**
* 设置No_Network状态图片的显示与否,仅对当前所在的地方有效
*
* @param bool
* @return
*/
public LyLoadingLayout setNoNetworkImageVisible(boolean bool) {
if (bool) {
networkImg.setVisibility(View.VISIBLE);
} else {
networkImg.setVisibility(View.GONE);
}
return this;
}
/**
* 设置ReloadButton的文本,仅对当前所在的地方有效
*
* @param text
* @return
*/
public LyLoadingLayout setReloadButtonText(@NonNull String text) {
errorReloadBtn.setText(text);
networkReloadBtn.setText(text);
return this;
}
/**
* 设置ReloadButton的文本字体大小,仅对当前所在的地方有效
*
* @param sp
* @return
*/
public LyLoadingLayout setReloadButtonTextSize(int sp) {
errorReloadBtn.setTextSize(sp);
networkReloadBtn.setTextSize(sp);
return this;
}
/**
* 设置ReloadButton的文本颜色,仅对当前所在的地方有效
*
* @param id
* @return
*/
public LyLoadingLayout setReloadButtonTextColor(@ColorRes int id) {
errorReloadBtn.setTextColor(ContextCompat.getColor(mContext, id));
networkReloadBtn.setTextSize(ContextCompat.getColor(mContext, id));
return this;
}
/**
* 设置ReloadButton的背景,仅对当前所在的地方有效
*
* @param id
* @return
*/
public LyLoadingLayout setReloadButtonBackgroundResource(@DrawableRes int id) {
errorReloadBtn.setBackgroundResource(id);
networkReloadBtn.setBackgroundResource(id);
return this;
}
/**
* 设置ReloadButton的监听器
*
* @param listener
* @return
*/
public LyLoadingLayout setOnReloadListener(OnReloadListener listener) {
this.listener = listener;
return this;
}
/**
* 自定义加载页面,仅对当前所在的Activity有效
*
* @param view
* @return
*/
public LyLoadingLayout setLoadingPage(View view) {
defineLoadingPage = view;
this.removeView(loadingPage);
defineLoadingPage.setVisibility(View.GONE);
this.addView(view);
return this;
}
/**
* 自定义加载页面,仅对当前所在的地方有效
*
* @param id
* @return
*/
public LyLoadingLayout setLoadingPage(@LayoutRes int id) {
this.removeView(loadingPage);
View view = LayoutInflater.from(mContext).inflate(id, null);
defineLoadingPage = view;
defineLoadingPage.setVisibility(View.GONE);
this.addView(view);
return this;
}
/**
* 获取当前自定义的loadingpage
*
* @return
*/
public View getLoadingPage() {
return defineLoadingPage;
}
/**
* 获取全局使用的loadingpage
*
* @return
*/
public View getGlobalLoadingPage() {
return loadingPage;
}
@IntDef({Success, Empty, Error, No_Network, Loading})
@Retention(RetentionPolicy.SOURCE)
public @interface Flavour {
}
public interface OnReloadListener {
void onReload(View v);
}
/**
* 获取全局配置的class
*
* @return
*/
public static Config getConfig() {
return mConfig;
}
/**
* 全局配置的Class,对所有使用到的地方有效
*/
public static class Config {
public Config setErrorText(@NonNull String text) {
errorStr = text;
return mConfig;
}
public Config setEmptyText(@NonNull String text) {
emptyStr = text;
return mConfig;
}
public Config setNoNetworkText(@NonNull String text) {
netwrokStr = text;
return mConfig;
}
public Config setReloadButtonText(@NonNull String text) {
reloadBtnStr = text;
return mConfig;
}
/**
* 设置所有提示文本的字体大小
*
* @param sp
* @return
*/
public Config setAllTipTextSize(int sp) {
tipTextSize = sp;
return mConfig;
}
/**
* 设置所有提示文本的字体颜色
*
* @param color
* @return
*/
public Config setAllTipTextColor(@ColorRes int color) {
tipTextColor = color;
return mConfig;
}
public Config setReloadButtonTextSize(int sp) {
buttonTextSize = sp;
return mConfig;
}
public Config setReloadButtonTextColor(@ColorRes int color) {
buttonTextColor = color;
return mConfig;
}
public Config setReloadButtonBackgroundResource(@DrawableRes int id) {
reloadBtnId = id;
return mConfig;
}
public Config setReloadButtonWidthAndHeight(int width_dp, int height_dp) {
buttonWidth = width_dp;
buttonHeight = height_dp;
return mConfig;
}
public Config setErrorImage(@DrawableRes int id) {
errorImgId = id;
return mConfig;
}
public Config setEmptyImage(@DrawableRes int id) {
emptyImgId = id;
return this;
}
public Config setNoNetworkImage(@DrawableRes int id) {
networkImgId = id;
return mConfig;
}
public Config setLoadingPageLayout(@LayoutRes int id) {
loadingLayoutId = id;
return mConfig;
}
}
public int dp2px(Context context, int dip) {
final float scale = context.getResources().getDisplayMetrics().density;
return (int) (dip * scale + 0.5f);
}
public <T extends View> T findViewById(View v, int id) {
return (T) v.findViewById(id);
}
}
布局文件
widget_error_page.xml
<?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:gravity="center"
android:orientation="vertical"
android:visibility="gone">
<ImageView
android:id="@+id/error_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/empty_com" />
<TextView
android:id="@+id/error_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="40dp"
android:layout_marginTop="10dp"
android:textColor="#999999" />
<TextView
android:id="@+id/error_reload_btn"
android:layout_width="140dp"
android:layout_height="36dp"
android:clickable="true"
android:gravity="center"
android:text="重新加载"
android:textSize="14sp"
android:textColor="#999999" />
</LinearLayout>
widget_loading_page.xml
<?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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:gravity="center"
android:orientation="horizontal"
android:visibility="gone">
<ProgressBar
style="@style/Widget.AppCompat.ProgressBar"
android:indeterminateDuration="1000"
android:indeterminateOnly="true"
android:layout_width="40dp"
android:layout_height="40dp"
android:indeterminateDrawable="@drawable/content_loading"
/>
</LinearLayout>
widget_nonetwork_page.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/mLlNoNetwork"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
android:visibility="gone">
<ImageView
android:id="@+id/no_network_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/default_no_network" />
<TextView
android:id="@+id/no_network_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="40dp"
android:textSize="14sp"
android:layout_marginTop="10dp"
android:textColor="#999999"
tools:text="网络错误" />
<TextView
android:id="@+id/no_network_reload_btn"
android:layout_width="140dp"
android:layout_height="36dp"
android:clickable="true"
android:gravity="center"
android:text="重新加载"
android:textSize="14sp"
android:textColor="#999999" />
</LinearLayout>
widget_empty_page.xml
<?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:gravity="center"
android:orientation="vertical"
android:visibility="gone"
>
<ImageView
android:id="@+id/empty_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/empty_com"
/>
<TextView
android:id="@+id/empty_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:gravity="center"
android:lineSpacingExtra="4dp"
android:textSize="14sp"
android:textColor="#999999"
/>
</LinearLayout>
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="LoadingLayout">
<attr name="isFirstVisible" format="boolean" />
</declare-styleable>
</resources>
下面介绍用法
LoadingLayout支持全局配置,对所有使用到的地方都起效,需要在Application中配置,如下:
public class App extends Application {
@Override
public void onCreate() {
super.onCreate();
LyLoadingLayout.getConfig()
.setErrorText("出错啦~请稍后重试!")
.setEmptyText("抱歉,暂无数据")
.setNoNetworkText("无网络连接,请检查您的网络···")
.setErrorImage(R.mipmap.define_error)
.setEmptyImage(R.mipmap.define_empty)
.setNoNetworkImage(R.mipmap.define_nonetwork)
.setAllTipTextColor(R.color.gray)
.setAllTipTextSize(14)
.setReloadButtonText("点我重试哦")
.setReloadButtonTextSize(14)
.setReloadButtonTextColor(R.color.gray)
.setReloadButtonWidthAndHeight(150,40);
}
}
由于“加载中”的页面,可能每个App都不一样,因此,LoadingLayout支持自定义LoadingPage,如下:
LyLoadingLayout.getConfig().setLoadingPageLayout(R.layout.define_loading_page);
同时,为了适应个别界面的“特殊需求”,LoadingLayout也支持局部设置各种属性,仅对当前对象生效,不影响全局。如下:
LyLoadingLayout loading = (LyLoadingLayout ) findViewById(R.id.loading_layout);
loading.setLoadingPage(R.layout.define_loading_page)
.setEmptyText("暂无报告数据")
.setErrorText("")
.setNoNetworkText("")
.setErrorImage(R.mipmap.ic_launcher)
.setErrorTextSize(16)
.setReloadButtonText("点我重新加载哦"); //等等
为ReloadButton设置监听:
loadingLayout.setOnReloadListener(new LyLoadingLayout.OnReloadListener() {
@Override
public void onReload(View v) {
}
});
设置显示的页面:
loadingLayout.setStatus(LyLoadingLayout.Loading);//加载中
loadingLayout.setStatus(LyLoadingLayout.Empty);//无数据
loadingLayout.setStatus(LyLoadingLayout.Error);//错误
loadingLayout.setStatus(LyLoadingLayout.No_Network);//无网络
loadingLayout.setStatus(LyLoadingLayout.Success);//加载成功
最后,在xml里面使用:
<LyLoadingLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent
app:isFirstVisible="true">
<TextView
android:background="@color/colorPrimary"
android:visibility="visible"
android:gravity="center"
android:textColor="@android:color/white"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="ContentView"/>
</LyLoadingLayout>
注意:
- isFirstVisible属性用来控制contentView一开始是否隐藏,由于LoadingLayout原理是在xml渲染完成后在contentView上铺上三层View,因此,一开始如果不隐藏,等contentView渲染完成后调用: loadingLayout.setStatus(LoadingLayout.Loading); 会造成界面闪烁的效果,影响体验,因此默认将contentView隐藏,所以数据加载完成后一定要调用loadingLayout.setStatus(LyLoadingLayout.Success);,将contentView显示出来。这样也能解决未获取到数据的情况下,被用户看到杂乱无章的布局,个人还是比较喜欢默认隐藏contentView;
- 为了方便管理,LyLoadingLayout只能有一个直属子View,类似ScrollView,添加两个直属子View会抛出异常throw new IllegalStateException("LyLoadingLayout can host only one direct child");;