Create AlertDialog with complex custom layout programmatically

Home / Android / Create AlertDialog with complex custom layout programmatically

This tutorial is for the creating AlertDialog similar to the login screen. But, the views are added programmatically, instead of creating and inflating an XML layout inside it.


main_activity.xml



    

MyEditText.java

package com.pcsalt.customalertdialogdemo2;

import android.content.Context;
import android.view.ViewGroup.LayoutParams;
import android.view.inputmethod.EditorInfo;
import android.widget.EditText;
import android.widget.LinearLayout;

public class MyEditText extends EditText {

	public MyEditText(Context context) {
		super(context);
		this.setSingleLine();
		this.setImeOptions(EditorInfo.IME_ACTION_DONE);
		this.setImeActionLabel("Done", EditorInfo.IME_ACTION_DONE);
		this.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT));
	}
}




MainActivity.java

package com.pcsalt.customalertdialogdemo2;

import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.LinearLayout;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends Activity {

	Button btnDialog;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		
		btnDialog = (Button) findViewById(R.id.btn_ShowDialog);
		btnDialog.setOnClickListener(new View.OnClickListener() {
			
			@Override
			public void onClick(View v) {
				showCustomDialog();
			}
		});
	}
	
	public void showCustomDialog() {
		LinearLayout ll_Main = new LinearLayout(this);
		LinearLayout ll_Row1 = new LinearLayout(this);
		LinearLayout ll_Row2 = new LinearLayout(this);
		
		ll_Main.setOrientation(LinearLayout.VERTICAL);
		ll_Row1.setOrientation(LinearLayout.HORIZONTAL);
		ll_Row2.setOrientation(LinearLayout.HORIZONTAL);
		
		final EditText et_User = new MyEditText(this);
		final EditText et_Pass = new MyEditText(this);
		
		TextView tv_User = new TextView(this);
		TextView tv_Pass = new TextView(this);
		
		tv_User.setText("Username: ");
		tv_Pass.setText("Password: ");
		
		ll_Row1.addView(tv_User);
		ll_Row1.addView(et_User);
		ll_Row2.addView(tv_Pass);
		ll_Row2.addView(et_Pass);
		ll_Main.addView(ll_Row1);
		ll_Main.addView(ll_Row2);
		
		AlertDialog.Builder alert = new AlertDialog.Builder(this);
		alert.setTitle("Custom Login");
		alert.setView(ll_Main);
		alert.setCancelable(false);
		alert.setPositiveButton("Login", new DialogInterface.OnClickListener() {
			
			@Override
			public void onClick(DialogInterface dialog, int which) {
				String user = et_User.getText().toString();
				String pass = et_Pass.getText().toString();
				Toast.makeText(getBaseContext(), "User: " + user + " Password: " + pass, Toast.LENGTH_SHORT).show();
			}
		});
		alert.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
			
			@Override
			public void onClick(DialogInterface dialog, int which) {
				dialog.dismiss();
			}
		});
		
		AlertDialog dialog = alert.create();
		dialog.show();
	}
}

Screenshots

CustomAlertDialogDemo21 CustomAlertDialogDemo22

Download source: