在招商银行android手机app中,有如下图所示的loading加载效果:
实现这个效果还是比较简单,就是自定义dialog,设置自己想要的布局,然后设置旋转动画。
主要步骤:
1,写布局文件
2,设置dialog的主题
3,自定义dialog继承 自Dialog
4,设置旋转动画
5,使用
第一步:编写dialog_merchantbank.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:layout_centerInParent="true">
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal">
<ImageView
android:id="@+id/iv_loading_bg"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_centerInParent="true"
android:src="@drawable/loading_bg" />
<ImageView
android:id="@+id/iv_loading_roll"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_centerInParent="true"
android:src="@drawable/loading_roll" />
</RelativeLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:text="登录中,请稍后..."/>
</LinearLayout>
</RelativeLayout>
第二步:编写主题样式
<style name="common_dialog">
<item name="android:windowFrame">@null</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowBackground">@color/white</item>
<item name="android:windowIsFloating">true</item>
<item name="android:windowContentOverlay">@null</item>
</style>
第三步:自定义MerchantBankDialog继承自Dialog
/**
* 仿招商银行loading dialog
*/
public class MerchantBankDialog extends Dialog{
private Context mContext;
private static MerchantBankDialog dialog;
public MerchantBankDialog(Context context) {
super(context);
mContext = context;
}
public MerchantBankDialog(Context context, int themeResId) {
super(context, themeResId);
mContext = context;
}
public static MerchantBankDialog createDialog(Context context){
//1设置样式
dialog = new MerchantBankDialog(context,R.style.common_dialog);
//2设置布局
dialog.setContentView(R.layout.dialog_merchantbank);
dialog.getWindow().getAttributes().gravity = Gravity.CENTER;
dialog.setCanceledOnTouchOutside(false);
//dialog.setCancelable(false);// 不可以用“返回键”取消
return dialog;
}
@Override
public void onWindowFocusChanged(boolean hasFocus) {
super.onWindowFocusChanged(hasFocus);
if(hasFocus && dialog !=null){
//3加载旋转动画
ImageView iv_loading_roll = (ImageView) dialog.findViewById(R.id.iv_loading_roll);
Animation loadingAnim = AnimationUtils.loadAnimation(
mContext, R.anim.rotate_loading);
iv_loading_roll.startAnimation(loadingAnim);
}
}
}
第四步:编写旋转动画xml文件,rotate_loading.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false" >
<rotate
android:duration="1500"
android:fromDegrees="0"
android:interpolator="@android:anim/linear_interpolator"
android:pivotX="50%"
android:pivotY="50%"
android:repeatCount="-1"
android:repeatMode="restart"
android:startOffset="-1"
android:toDegrees="+360" />
</set>
第五步:点击显示loading提示框
<span style="white-space:pre"> </span>btn_openzhaohangloading.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
MerchantBankDialog dialog = MerchantBankDialog.createDialog(MainActivity.this);
dialog.show();
}
});
至此,基本功能已实现,如有疑问欢迎留言或加群讨论: 196615382 ,如需源码,点击下载 。。。