一、概述
需求的效果如下
二、实现过程:
自定义dialog:
public class PayDialogFragment extends DialogFragment implements View.OnClickListener {
private NoticeDialogListener listener;
public PayDialogFragment(double amount, NoticeDialogListener listener) {
this.amount = amount;
this.listener = listener;
}
//定义点击回调接口
public interface NoticeDialogListener {
void onDialogBtnClick(int payType);
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//设置自定义样式
setStyle(DialogFragment.STYLE_NORMAL,R.style.PayDialog);
}
@Nullable
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
// getDialog().requestWindowFeature(Window.FEATURE_NO_TITLE);
// getDialog().getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
//设置动画
getDialog().getWindow().setWindowAnimations(R.style.PayDialog);
View view = inflater.inflate(R.layout.dialog_pay, container);
ImageButton btn_cash = view.findViewById(R.id.btn_pay_cash);
ImageButton btn_bank_card = view.findViewById(R.id.btn_pay_bank_card);
ImageButton btn_scan_code = view.findViewById(R.id.btn_pay_scan_code);
textView.setText(String.valueOf(amount));
btn_cash.setOnClickListener(this);
btn_bank_card.setOnClickListener(this);
btn_scan_code.setOnClickListener(this);
return view;
}
@Override
public void onClick(View view) {
switch (view.getId()){
case R.id.btn_pay_cash:
listener.onDialogBtnClick(KTVType.PayType.CASH);
break;
case R.id.btn_pay_bank_card:
listener.onDialogBtnClick(KTVType.PayType.CARD);
break;
case R.id.btn_pay_scan_code:
listener.onDialogBtnClick(KTVType.PayType.QRCODE);
break;
}
}
}
Activity接收消息:
......
private void openPayDialog(int poistion){
payDialog = new PayDialogFragment(ktvOrderInfoList.get(position).getPay_amount(),this);
payDialog.show(getSupportFragmentManager(),"payDialog");
}
@Override
public void onDialogBtnClick(int payType) {
switch (payType){
case KTVType.PayType.CASH:
showShortText(this,payType);
break;
case KTVType.PayType.CARD:
showShortText(this,payType);
break;
case KTVType.PayType.QRCODE:
showShortText(this,payType);
break;
}
payDialog.dismiss();
}
style定义:
<!--TODO:自定义dialog背景全透明无边框theme -->
<style name="PayDialog" parent="android:style/Theme.Dialog">
<!--背景颜色及和透明程度-->
<item name="android:windowBackground">@android:color/transparent</item>
<!--是否去除标题 -->
<item name="android:windowNoTitle">true</item>
</style>
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="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:background="@drawable/shape_circle_white"
>
<TextView
android:id="@+id/txt_pay_amount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="@string/dollar"
android:textSize="30dp"
android:textColor="@android:color/black"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:orientation="horizontal"
>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center">
<ImageButton
android:id="@+id/btn_pay_cash"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/icon_pay_cash"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/pay_cash" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center">
<ImageButton
android:id="@+id/btn_pay_bank_card"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/icon_pay_bank_card" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/pay_bank_card" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center"
>
<ImageButton
android:id="@+id/btn_pay_scan_code"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/icon_pay_scan_code" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/pay_scan_code" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
shape_circle_white文件:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="20dp"/>
<padding android:right="10dp" android:bottom="10dp" android:left="10dp" android:top="10dp"/>
<solid android:color="@android:color/white"/>
</shape>
上面文件实现效果:
三、解决问题
一开始以为是下面这两种错误,参考文章:自定义DialogFragment,DialogFragment 实现圆角效果,通过文章添加如下代码实现了需求的效果:
public void onStart() {
super.onStart();
Dialog dialog =getDialog();
if(dialog != null){
DisplayMetrics displayMetrics = new DisplayMetrics();
getActivity().getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
dialog.getWindow().setLayout((int) (displayMetrics.widthPixels *0.8),
ViewGroup.LayoutParams.WRAP_CONTENT);
}
}
但是为什么上面会出现挤在一起的效果呢,主要分析是布局的宽度填充问题,发现txt_pay_amount的layout_width="wrap_content"是问题的关键,因为下面的都是000进行适配,所以设置layout_width="match_parent"就没得问题:
<TextView
android:id="@+id/txt_pay_amount"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="@string/dollar"
android:textSize="30dp"
android:textColor="@android:color/black"
/>
这样就不需要上面两篇文章的方式了,就可以实现了。
四、动画失效
修改主题添加动画
<style name="PayDialog" parent="android:style/Theme.Dialog">
....
<item name="android:windowEnterAnimation">@anim/scale_center_in</item>
<item name="android:windowExitAnimation">@anim/scale_center_out</item>
</style>
按理说再onCreate设置了自定义样式会出现动画,但是并没有,所以网上找了手动设置的,在onCreateView里面获取dialog赋值动画,即可暂时解决动画不出现问题。
getDialog().getWindow().setWindowAnimations(R.style.PayDialog);