自定義Dialog彈框和其背景陰影顯示
阿新 • • 發佈：2018-12-12
昨天研究了一下自定義Dialog的彈框，其實要點都是把自定義好的view用setContentView(view)的方法設定進dialog裡，首先我們先看一個簡單的自定義Dialog。
一、寫佈局檔案：custom_dialog_layout.xml(這個佈局就是一個簡單的提示內容，下面有一個確定的按鈕，請參看評論中的效果圖)
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/content_layout" android:layout_gravity="center" android:gravity="center"> <LinearLayout android:background="@drawable/dialog_content_white_with_radius" android:layout_marginLeft="40dp" android:layout_marginRight="40dp" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" android:gravity="center"> <TextView android:id="@+id/dialog_content_text" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="info" android:textSize="@dimen/size40" android:textColor="@color/word_color_444444" android:padding="10dp" android:gravity="center"/> <View android:layout_width="match_parent" android:layout_height="0.5dp" android:background="@color/divide_line"/> <TextView android:paddingTop="10dp" android:paddingBottom="10dp" android:id="@+id/tv_sure" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:textColor="@color/main_color" android:text = "確定" android:textSize="@dimen/two_level_word" /> </LinearLayout> </LinearLayout>
寫好佈局檔案後，由於佈局直角不好看，我們可以設定邊框為圓角的shape,寫入，程式碼如下：dialog_content_white_with_radius
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"> <solid android:color="@color/wirte_ffffff" /> <corners android:bottomLeftRadius="8dp" android:bottomRightRadius="8dp" android:topLeftRadius="8dp" android:topRightRadius="8dp" /> </shape>
二、寫自定義Dialog類繼承自Dialog:
/** [Description] * 只有確認button * [How to use] * * [Tips] * * Created by lan.zheng on 2017/7/25 18:26. */ public class SureClickDialog extends Dialog { private Listener mListener; public SureClickDialog(Context context) { super(context); } public SureClickDialog(Context context, String content, Listener listener){ super(context, R.style.custom_dialog_style); mListener = listener; View contentView = LayoutInflater.from(context).inflate(R.layout.dialog_have_been_sign_section_show, null); TextView contentTextView = (TextView) contentView.findViewById(R.id.dialog_content_text); contentTextView.setText(content); TextView sureButton = (TextView) contentView.findViewById(R.id.tv_sure); //消失監聽 this.setOnDismissListener(new OnDismissListener() { @Override public void onDismiss(DialogInterface dialog) { mListener.onDialogDismissListener(); } }); //確認 sureButton.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { dismiss(); mListener.onSureListerner(); } }); setContentView(contentView); } public interface Listener { void onDialogDismissListener(); void onSureListerner(); } }
這裡我們只監聽彈框消失和點選確定的按鈕，好了基本工作到這裡完成了，最後就是設定樣式style，一般彈框背景都是半透明的遮罩：
<style name="custom_dialog_style" parent="android:Theme.Dialog">
<item name="android:windowFrame">@null</item>
<item name="android:windowIsFloating">true</item>
<item name="android:windowIsTranslucent">false</item>
<item name="android:windowNoTitle">true</item><!--除去title-->
<item name="android:backgroundDimEnabled">true</item><!--半透明-->
<item name="android:windowBackground">@color/transparent</item><!--除去背景色-->
<item name="android:radius">10dp</item>
</style>這樣就完成了一個背景半透明的彈框了。
設定<itemname="android:backgroundDimEnabled">true</item><!--半透明-->能實現半透明，但是如果有特殊的背景要求那就不能滿足了，此時通過查詢發現，可以重寫下面這個函式進行把整個你自定義的佈局全屏顯示。
@Override
public void show() {
super.show();
/**
* 設定寬度全屏，要設定在show的後面
*/
WindowManager.LayoutParams layoutParams = getWindow().getAttributes();
layoutParams.width= ViewGroup.LayoutParams.MATCH_PARENT;
layoutParams.height= ViewGroup.LayoutParams.MATCH_PARENT;
getWindow().getDecorView().setPadding(0, 0, 0, 0);
getWindow().setAttributes(layoutParams);
}發現是生效的，我佈局中的背景是成功的應用上了，但是發現點選外圍卻不能讓彈框消失，這是因為你的彈框已經是全屏了，所以在螢幕上就沒有所謂的彈框外圍了，這時候我們可以自己去監聽點選事件，我們來重寫一下自定義Dialog類：
/**
* [Description]
* 只有確認button
* [How to use]
* new SureClickDialog()
* [Tips]
* isClickOutsideCanDismiss必須給值，true表示可點選外圍消失，false表示不能
* Created by lan.zheng on 2017/7/25 18:26.
*/
public class SureClickDialog extends Dialog {
private Listener mListener;
public SureClickDialog(Context context) {
super(context);
}
public SureClickDialog(Context context, String content, boolean isClickOutsideCanDismiss,Listener listener){
super(context, R.style.custom_dialog_style);
mListener = listener;
View contentView = LayoutInflater.from(context).inflate(R.layout.dialog_have_been_sign_section_show, null);
LinearLayout linearLayout = (LinearLayout)contentView.findViewById(R.id.content_layout) ; //自定義佈局的最外層
linearLayout.setBackgroundColor(context.getResources().getColor(R.color.half_transparent));
linearLayout.setOnClickListener(new View.OnClickListener() { //為其設定自定義點選監聽
@Override
public void onClick(View v) {
if(isClickOutsideCanDismiss){
dismiss();
}
}
});
TextView contentTextView = (TextView) contentView.findViewById(R.id.dialog_content_text);
contentTextView.setText(content);
TextView sureButton = (TextView) contentView.findViewById(R.id.tv_sure);
//消失監聽
this.setOnDismissListener(new OnDismissListener() {
@Override
public void onDismiss(DialogInterface dialog) {
mListener.onDialogDismissListener();
}
});
//確認
sureButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
dismiss();
mListener.onSureListerner();
}
});
setContentView(contentView);
}
@Override
public void show() {
super.show();
WindowManager.LayoutParams layoutParams = getWindow().getAttributes();
layoutParams.width= ViewGroup.LayoutParams.MATCH_PARENT;
layoutParams.height= ViewGroup.LayoutParams.MATCH_PARENT;
getWindow().getDecorView().setPadding(0, 0, 0, 0);
getWindow().setAttributes(layoutParams);
}
public interface Listener {
void onDialogDismissListener();
void onSureListerner();
}
}
OK，關於彈框的就寫到這裡啦，自定義的功能十分豐富和具有可塑性，有興趣的可以研究一下。