您的位置:首页 > Web前端 > CSS

自定义样式dialog及使用

2016-04-05 12:02 453 查看
最近要做的项目都涉及到了服务器请求和蓝牙连接等耗时操作,在处理这些耗时操作时需要考虑到用户体验就必须弄个等待对话框。于是便打算自定义一下等待框的样式,使其达到其需求,同时也将其封装起来,到时要用的时候就可以方便直接用了。

效果图:



1. 先定义一个会旋转的shape,用做无进度的圆形progressBar。

shape_rotate_progressbar.xml:

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:pivotX="50%"
android:pivotY="50%"
android:fromDegrees="0"
android:toDegrees="360">
<shape
android:innerRadiusRatio="3"
android:thicknessRatio="9"
android:useLevel="false"
android:shape="ring">
<gradient
android:centerColor="#ffffff"
android:centerY="0.50"
android:startColor="#666666"
android:endColor="#ffdd11"
android:type="sweep"
android:useLevel="false"/>
</shape>
</rotate>


2. 定义dialog布局里根容器的背景色和圆角效果。

shape_loading_dialog_bg.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<corners android:radius="8dp"/>
<solid android:color="#88ffffff"/>
</shape>


3. 定义dialog布局。

dialog_loading.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="160dp"
android:layout_height="160dp"
android:background="@drawable/<span style="color:#ff0000;">shape_loading_dialog_bg</span>"
android:orientation="vertical" >

<ProgressBar
android:id="@+id/dialog_progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingLeft="30dp"
android:paddingRight="30dp"
android:paddingBottom="15dp"
android:layout_centerInParent="true"
android:indeterminateDrawable="@drawable/<span style="color:#ff0000;">shape_rotate_progressbar</span>"/>

<TextView
android:id="@+id/loading_dialog_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/dialog_progressBar"
android:layout_centerHorizontal="true"
android:gravity="center"
android:textSize="15sp"
android:textColor="#FFDD11"/>

</RelativeLayout>


在此布局文件里用上1. 2 步创建的shape

4. 在styles.xml里声明自定义样式dialog风格。
styles.xml:

<style name="loading_dialog_style" parent="android:Theme.Dialog">
<item name="android:windowBackground">@android:color/transparent</item>
<item name="android:windowFrame">@null</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowIsFloating">true</item>
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowAnimationStyle">@android:style/Animation.Dialog</item>
<item name="android:backgroundDimEnabled">true</item>
</style>


5. 创建dialog的子类,并加载dialog布局。

LoadingDialog.java:

public class LoadingDialog extends Dialog {

private String message;

public LoadingDialog(Context context, String message) {
// TODO Auto-generated constructor stub
super(context, R.style.loading_dialog_style);
this.message=message;
}

public LoadingDialog(Context context) {
this(context, "");
// TODO Auto-generated constructor stub
}

@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.dialog_loading);

//可以选择性添加等待对话框的内容文本
if(message!=null && !message.equals("")){
((TextView)findViewById(R.id.loading_dialog_tv)).setText(message);
}else{
((TextView)findViewById(R.id.loading_dialog_tv)).setVisibility(View.GONE);
}
}

}


6. 直接在代码里使用。

public class MainActivity extends Activity {

private Button btnShowDialog;
private LoadingDialog dialog;
private Handler handler;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

handler=new Handler();

btnShowDialog=(Button)findViewById(R.id.btn_show_dialog);
btnShowDialog.setOnClickListener(new OnClickListener() {

@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub

//显示自定义样式的dialog
dialog.show();

//dialog显示后就可以进行一些耗时操作,比如网络请求,数据库处理等

//如果10秒后加载等待还没结束(即耗时操作还没完成),则主动取消耗时操作并使dialog消失
handler.postDelayed(new Runnable() {

@Override
public void run() {
// TODO Auto-generated method stub
if(dialog.isShowing()){
dialog.cancel();
}
}
}, 10000);
}
});

//使用带文字的构造体创建dialog
dialog=new LoadingDialog(this, null);
//设置不能按屏幕或物理返回键退出
dialog.setCancelable(false);
//设置
dialog.setOnCancelListener(new OnCancelListener() {

@Override
public void onCancel(DialogInterface arg0) {
// TODO Auto-generated method stub

//执行取消操作,可以中断耗时操作
}
});
}

@Override
protected void onDestroy() {
// TODO Auto-generated method stub
super.onDestroy();
//handler依赖于activity,结束后要习惯把handler的任务取消掉,避免activity回收不了而内存泄露
if(handler!=null){
handler.removeCallbacksAndMessages(null);
}
}
}


代码除了MainActivity的layout外,其他都在上面了。

代码下载:github
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息