滑动选择对话框WheelDialogFragment
2016-10-08 本文已影响1633人
AJoyce_
此对话框是在https://github.com/Carbs0126/NumberPickerView的基础上进行开发的，特此感谢Carbs0126！！WheelDialogFragment继承了DialogFragment。在android 3.0时DialogFragment被引入，是一种特殊的Fragment。使用DialogFragment来管理对话框，当旋转屏幕和按下后退键时可以更好的管理其声明周期，它和Fragment有着基本一致的声明周期。
效果图：
wheelDialog.gif
一：创建布局
使用DialogFragment至少需要实现onCreateView或者onCreateDIalog方法。onCreateView即使用定义的xml布局文件展示Dialog。onCreateDialog即利用AlertDialog或者Dialog创建出Dialog。
- 重写onCreateView实现Dialog
<?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:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="48dp"
android:paddingRight="16dp"
android:paddingLeft="16dp"
android:background="@color/white">
<TextView
android:id="@+id/tv_wheel_dialog_left"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@android:color/transparent"
android:gravity="center"
android:minWidth="48dp"
android:layout_alignParentLeft="true"
android:textSize="16sp"
android:text="取消"
android:textColor="@color/default_text_color_normal" />
<TextView
android:id="@+id/tv_wheel_dialog_right"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@android:color/transparent"
android:minWidth="48dp"
android:gravity="center"
android:layout_alignParentRight="true"
android:textSize="16sp"
android:text="确定"
android:textColor="@color/colorPrimary" />
</RelativeLayout>
<com.github.phoenix.widget.WheelView
android:id="@+id/WheelView_dialog"
android:layout_width="match_parent"
android:layout_height="240dp"
android:layout_centerHorizontal="true"
android:background="@color/default_window_bg"
android:contentDescription="test_number_picker_view"
app:npv_ItemPaddingHorizental="5dp"
app:npv_ItemPaddingVertical="5dp"
app:npv_ShowCount="5"
app:npv_TextSizeNormal="16sp"
app:npv_TextSizeSelected="20sp"
app:npv_WrapSelectorWheel="true"/>
</LinearLayout>
二：初始化对话框
- 默认的对话框有黑黑的虚框包围，所以我们要把它去掉
//设置对话框背景色，否则有虚框
getDialog().getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
- 设置窗口以对话框的样式显示，并且去除标题
//设置窗口以对话框样式显示
setStyle(DialogFragment.STYLE_NO_TITLE, R.style.Dialog);
也可以在
inflater.inflate(R.layout.view_dialog_wheel, null);
前面添加
getDialog().requestWindowFeature(Window.FEATURE_NO_TITLE);
来去除标题
- 设置对话框显示在窗口底部，且宽度充满屏幕
//设置对话框显示在底部
getDialog().getWindow().setGravity(Gravity.BOTTOM);
//设置让对话框宽度充满屏幕
getDialog().getWindow().setLayout(ScreenUtil.getScreenWidth(activity), getDialog().getWindow().getAttributes().height);
- 最重要的一步设置对话框从窗口底部滑出
//设置对话框弹出动画，从底部滑入，从底部滑出
getDialog().getWindow().getAttributes().windowAnimations = R.style.Dialog_Animation;
- 下面两个Style分别是R.style.dialog，R.style.dialog_animation
<!--对话框弹出，window背景变暗-->
<style name="Dialog" parent="Base.Animation.AppCompat.Dialog">
<item name="android:backgroundDimEnabled">true</item>
</style>
<!--对话框从下向上滑出动画-->
<style name="Dialog.Animation">
<item name="android:windowEnterAnimation">@anim/slide_in_from_bottom</item>
<item name="android:windowExitAnimation">@anim/slide_out_to_bottom</item>
</style>
三：滑动监听
- 当上下滑动停止时回调获取选中的数据
public interface OnWheelDialogListener {
/**
* 左边按钮单击事件回调
*
* @param dialog
* @param value
*/
void onClickLeft(DialogFragment dialog, String value);
/**
* 右边按钮单击事件回调
*
* @param dialog
* @param value
*/
void onClickRight(DialogFragment dialog, String value);
/**
* 滑动停止时的回调
*
* @param dialog
* @param value
*/
void onValueChanged(DialogFragment dialog, String value);
}
/**
* 对外开放的方法
*
* @param onWheelDialogListener
*/
public void setWheelDialogListener(OnWheelDialogListener onWheelDialogListener) {
this.onWheelDialogListener = onWheelDialogListener;
}
- 监听WheelView的onValueChange方法取得数据
@Override
public void onValueChange(WheelView picker, int oldVal, int newVal) {
String[] content = wheelView.getDisplayedValues();
if (content != null && onWheelDialogListener != null) {
onWheelDialogListener.onValueChanged(content[newVal - wheelView.getMinValue()]);
}
}
四：监听对话框的返回键
//监听返回键
getDialog().setOnKeyListener(new DialogInterface.OnKeyListener() {
@Override
public boolean onKey(DialogInterface dialog, int keyCode, KeyEvent event) {
if (keyCode == KeyEvent.KEYCODE_BACK && event.getAction() == KeyEvent.ACTION_DOWN)
return !isBack;
return false;
}
});
//触摸对话框外部是否销毁
getDialog().setCancelable(isCancelable);
getDialog().setCanceledOnTouchOutside(isCancelableTouchOutSide);
五：实际应用
Bundle bundle = new Bundle();
bundle.putBoolean(WheelDialogFragment.DIALOG_BACK, false);
bundle.putBoolean(WheelDialogFragment.DIALOG_CANCELABLE, false);
bundle.putBoolean(WheelDialogFragment.DIALOG_CANCELABLE_TOUCH_OUT_SIDE, false);
bundle.putString(WheelDialogFragment.DIALOG_LEFT, "取消");
bundle.putString(WheelDialogFragment.DIALOG_RIGHT, "确定");
bundle.putStringArray(WheelDialogFragment.DIALOG_WHEEL, ResUtil.getStringArray(R.array.main_home_menu));
WheelDialogFragment dialogFragment = WheelDialogFragment.newInstance(WheelDialogFragment.class, bundle);
dialogFragment.setWheelDialogListener(new WheelDialogFragment.OnWheelDialogListener() {
@Override
public void onClickLeft(DialogFragment dialog, String value) {
dialog.dismiss();
}
@Override
public void onClickRight(DialogFragment dialog, String value) {
dialog.dismiss();
Toast.makeText(getApplicationContext(), value, Toast.LENGTH_SHORT).show();
}
@Override
public void onValueChanged(DialogFragment dialog, String value) {
Log.i("", "current value: " + value);
}
});
dialogFragment.show(getSupportFragmentManager(), "");
