Android開發丶自定義Dialog並設置寬高適應子佈局XML

Dialog是我們做項目很常見的一項功能點了，一般的文字彈窗原生的dialog就可以幫我們實現，然而在實際開發過程中，因爲彈窗佈局較爲複雜，充斥着各種控件，這時候原生的Dialog顯然就不能滿足我們的需求了，所以我們要自定義修改一番，近期正好做了些這方面的東西，也遇到了一些坑，特此整理出來！

萬年不變的國際慣例——上效果圖

好像醜了點，哈哈。。問題不大。

簡單分析下界面，共有1個TextView文字，兩個ImageView圖片，兩個View橫豎線，畫起來沒啥難度

我們接下來詳述實現方法。

1.先畫自定義佈局。

custom_share_dialog.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:padding="10dp"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="分享到"
        />
    
    <View
        android:layout_width="wrap_content"
        android:layout_height="1px"
        android:background="#000"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp"
        />
    
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        
        <ImageView
            android:id="@+id/dialog_wechat"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:src="@drawable/wechat_pic" />

        <View
            android:layout_width="1px"
            android:layout_height="match_parent"
            android:background="#000"/>

        <ImageView
            android:id="@+id/dialog_wechatmoment"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:src="@drawable/wechatmoment_pic" />

    </LinearLayout>

</LinearLayout>

2.在彈窗的入口設置方法

A、先加載自定義佈局custom_share_dialog.xml

//加載自定義佈局並初始化控件
AlertDialog.Builder builder= new AlertDialog.Builder(MainActivity.this);
View view= LayoutInflater.from(MainActivity.this).inflate(R.layout.custom_share_dialog, null);
ImageView wechat= view.findViewById(R.id.dialog_wechat);
ImageView wechatmoment= view.findViewById(R.id.dialog_wechatmoment);
final Dialog dialog= builder.create();
dialog.show();
Window window= dialog.getWindow();
window.setContentView(view);
//彈窗時隱藏軟鍵盤
window.clearFlags(WindowManager.LayoutParams.FLAG_ALT_FOCUSABLE_IM);

最後一行意爲在彈窗時如果軟鍵盤處於彈出狀態，此時就會隱藏掉軟鍵盤，以防用戶多次誤點，特地在demo放了個EdiText以供測試。

B、此時就可以正常顯示彈窗了，接下來我們對其寬高進行設置

此時根據實際需求，可以設置dialog的彈窗自適應xml佈局，也可以自適應屏幕寬高比例。

//設置dialog彈窗寬高
WindowManager.LayoutParams params= window.getAttributes();
//dialog寬高適應子佈局xml
params.height= LinearLayout.LayoutParams.WRAP_CONTENT;
params.width= LinearLayout.LayoutParams.MATCH_PARENT;
//dialog寬高適應屏幕
//WindowManager manager= getWindowManager();
//Display display= manager.getDefaultDisplay();
//params.height= (int) (display.getHeight()* 0.8);
//params.width= (int) (display.getWidth()* 0.5);
window.setAttributes(params);

C、接下來設置子控件的點擊事件即可

wechat.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        dialog.dismiss();
    }
});
wechatmoment.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        dialog.dismiss();
    }
});

至此全部完成，沒有demo的博客不是好博客，源碼附上！

資源下載