1. 程式人生 > >FlycoDialog 簡單實用的自定義Android彈窗對話方塊之Dialog篇

FlycoDialog 簡單實用的自定義Android彈窗對話方塊之Dialog篇

效果圖鎮樓
版本更新頁 廣告頁

FlycoDialog是一款非常棒的彈窗對話方塊處理框架,今天在這裡主要講一下他的自定義彈出對話方塊的功能,這裡以第二幅效果圖為例,圖片已經放在部落格最下方,X號自己隨便找一個東西代替吧。
首先我們還是先新增依賴。

 compile 'com.flyco.dialog:FlycoDialog_Lib:1.3.2@aar'

然後我們先寫一個彈窗的佈局,非常簡單一個大的ImageView展示圖片,上面放一個小的ImageView用於點選使彈框消失。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:id="@+id/iv_ad" android:layout_width="278dp" android:layout_height="392dp" android:layout_centerHorizontal
="true" android:layout_centerVertical="true" />
<ImageView android:id="@+id/ad_back" android:layout_width="278dp" android:layout_height="45dp" android:layout_alignRight="@id/iv_ad" android:layout_alignTop="@id/iv_ad" android:background
="#01ffffff" />
</RelativeLayout>

然後我們來寫彈框的邏輯程式碼,我會用註釋的方式來解釋程式碼的功能。

public class AdDialog extends BaseDialog<AdDialog> {
    private Context context;
    private ImageView iv_ad;
    private ImageView back;

    public AdDialog(Context context) {
        super(context);
        this.context = context;
    }

    //該方法用來出來資料初始化程式碼
    @Override
    public View onCreateView() {
        widthScale(0.85f);
        //填充彈窗佈局
        View inflate = View.inflate(context, R.layout.addialog, null);
        //用來放整個圖片的控制元件
        iv_ad = (ImageView) inflate.findViewById(R.id.iv_ad);
        //放在透明部分和錯號上的隱形控制元件,用來點選使彈窗消失
        back = (ImageView) inflate.findViewById(R.id.ad_back);
        //用來載入網路圖片,填充iv_ad控制元件,注意要新增網路許可權,和Picasso的依賴和混淆
        Picasso.with(context)
                .load("https://img-blog.csdn.net/20170906094014301?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcXFfMzY2MjE5OTA=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast")
                .into(iv_ad);

        return inflate;
    }
    //該方法用來處理邏輯程式碼
    @Override
    public void setUiBeforShow() {
        //點選彈窗相應位置,處理相關邏輯。
        iv_ad.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(context,"哈哈",Toast.LENGTH_SHORT).show();
                //處理完邏輯關閉彈框的程式碼
                dismiss();
            }
        });
        //點×關閉彈框的程式碼
        back.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //關閉彈框的程式碼
                dismiss();
            }
        });
    }
}

最後來寫啟動彈框的程式碼

   AdDialog adDialog = new AdDialog(this);
        adDialog.onCreateView();
        adDialog.setUiBeforShow();
        //點選空白區域能不能退出
        adDialog.setCanceledOnTouchOutside(true);
        //按返回鍵能不能退出
        adDialog.setCancelable(true);
        adDialog.show();

如果需要處理比較複雜的邏輯可通過AdDialog的構造方法像彈窗內傳值,例如

彈框邏輯程式碼的構造方法

   public AdDialog(Context context,String ivurl,String title,String adurl) {
        super(context);
        this.context = context;
        this.ivurl = ivurl;
        this.title = title;
        this.adurl = adurl;
    }

啟動程式碼時傳入資料

 AdDialog adDialog = new AdDialog(getActivity(),"圖片網址","標題","廣告網址");
        adDialog.onCreateView();
        adDialog.setUiBeforShow();
        //點選空白區域能不能退出
        adDialog.setCanceledOnTouchOutside(true);
        //按返回鍵能不能退出
        adDialog.setCancelable(true);
        adDialog.show();

如果還有什麼不明白的地方可在部落格下留言。