Analysis of Android Custom Dialog Principle Example

During the development of Android, we often encounter one requirement scenario-a pop-up box pops up on the interface to remind users and let them perform some selective operations.

For example, when exiting the pop-up window when logging in, let the user choose "exit" or "cancel" and other operations.

The Android system provides the Dialog class, as well as subclasses of Dialog, such as AlertDialog, to implement such functionality.

In general, Dialog and its subclasses provided by Android can meet most of these requirements, however, its shortcomings are as follows:

1. Based on Dialog and its subclass style sheet 1 provided by Android, the style may not be in harmony with App itself;

2. Dialog pop-up window is limited in layout and function, and sometimes it can meet the actual business requirements.

This article will build a custom Dialog pop-up window based on Dialog, taking the most common confirmation pop-up box as an example.

This style is relatively simple: There is a bullet box title (prompt) on the top, and "Confirm" and "Cancel" buttons on the left and right below. When the user clicks the "Confirm" button, the bullet box executes

Corresponding confirmation logic, when the "Cancel" button is clicked, the corresponding cancellation logic is executed.

First, customize the pop-up box style:

<?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:background="@drawable/dialog_bg"
  android:orientation="vertical" >

  <TextView
    android:id="@+id/title"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:paddingTop="14dp"
    android:textColor="@color/login_hint"
    android:textSize="@dimen/text_size_18" />

  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="14dp"
    android:layout_marginLeft="20dp"
    android:layout_marginRight="20dp"
    android:layout_marginTop="30dp" >

    <TextView
      android:id="@+id/confirm"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginRight="10dp"
      android:layout_weight="1"
      android:background="@drawable/btn_confirm_selector"
      android:gravity="center"
      android:textColor="@color/white"
      android:textSize="@dimen/text_size_16" />

    <TextView
      android:id="@+id/cancel"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginLeft="10dp"
      android:layout_weight="1"
      android:background="@drawable/btn_cancel_selector"
      android:gravity="center"
      android:textColor="@color/login_hint"
      android:textSize="@dimen/text_size_16" />
  </LinearLayout>

</LinearLayout>

Then, build the validation bullet control ConfirmDialog by inheriting the Dialog class:

package com.corn.widget;

import android.app.Dialog;
import android.content.Context;
import android.os.Bundle;
import android.util.DisplayMetrics;
import android.view.LayoutInflater;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
import android.widget.TextView;

import com.corn.R;

public class ConfirmDialog extends Dialog {

  private Context context;
  private String title;
  private String confirmButtonText;
  private String cacelButtonText;
  private ClickListenerInterface clickListenerInterface;

  public interface ClickListenerInterface {

    public void doConfirm();

    public void doCancel();
  }

  public ConfirmDialog(Context context, String title, String confirmButtonText, String cacelButtonText) {
    super(context, R.style.MyDialog);
    this.context = context;
    this.title = title;
    this.confirmButtonText = confirmButtonText;
    this.cacelButtonText = cacelButtonText;
  }

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    super.onCreate(savedInstanceState);

    init();
  }

  public void init() {
    LayoutInflater inflater = LayoutInflater.from(context);
    View view = inflater.inflate(R.layout.confirm_dialog, null);
    setContentView(view);

    TextView tvTitle = (TextView) view.findViewById(R.id.title);
    TextView tvConfirm = (TextView) view.findViewById(R.id.confirm);
    TextView tvCancel = (TextView) view.findViewById(R.id.cancel);

    tvTitle.setText(title);
    tvConfirm.setText(confirmButtonText);
    tvCancel.setText(cacelButtonText);

    tvConfirm.setOnClickListener(new clickListener());
    tvCancel.setOnClickListener(new clickListener());

    Window dialogWindow = getWindow();
    WindowManager.LayoutParams lp = dialogWindow.getAttributes();
    DisplayMetrics d = context.getResources().getDisplayMetrics(); //  Get screen width and height 
    lp.width = (int) (d.widthPixels * 0.8); //  The height is set to the 0.6
    dialogWindow.setAttributes(lp);
  }

  public void setClicklistener(ClickListenerInterface clickListenerInterface) {
    this.clickListenerInterface = clickListenerInterface;
  }

  private class clickListener implements View.OnClickListener {
    @Override
    public void onClick(View v) {
      // TODO Auto-generated method stub
      int id = v.getId();
      switch (id) {
      case R.id.confirm:
        clickListenerInterface.doConfirm();
        break;
      case R.id.cancel:
        clickListenerInterface.doCancel();
        break;
      }
    }

  };

}

In the space construction code above, because the control's "confirm" and "cancel" logic is related to the actual application scenario, the control is implemented by defining internal interfaces.

Where you need to use this control, make the following call:

public static void Exit(final Context context) {
    final ConfirmDialog confirmDialog = new ConfirmDialog(context, " Are you sure you want to quit ?", " Quit ", " Cancel ");
    confirmDialog.show();
    confirmDialog.setClicklistener(new ConfirmDialog.ClickListenerInterface() {
      @Override
      public void doConfirm() {
        // TODO Auto-generated method stub
        confirmDialog.dismiss();
        //toUserHome(context);
        AppManager.getAppManager().AppExit(context);
      }

      @Override
      public void doCancel() {
        // TODO Auto-generated method stub
        confirmDialog.dismiss();
      }
    });
  }

The internal interface of this control is implemented in the call and assigned to the control itself, so that the function callback based on external specific business logic can be realized when the button is clicked.