sábado, 5 de marzo de 2016

Ejemplos de AlertDialog.Builder en Android.


Estos códigos de AlertDialog.Builder Android  son algunos de los elementos de los widgets o interfaces de usuario más comunes que usamos con cualquier aplicación de Android. En general, un AlertDialog es una pequeña ventana que aparece en la cabecera de la solicitud. Se pone el foco pantalla y capaz de aceptar la interacción del usuario.

Los cuadros de diálogo se utilizan normalmente para las notificaciones al usuario y para realizar tareas cortas.

En este post, vamos a echar un vistazo a algunos tipos comunes de AlertDialog que uso durante el desarrollo de Android. Vamos a cubrir cómo mostrar un AlertDialog Android - desde la básica hasta un poco de tipo complejo.

1. Dialog Simple con un boton

package com.example.alertdialogoneexample;

import android.os.Bundle;
import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        alertOneButton();

    }

    /*
     * AlertDialog with one action button.
     */
    public void alertOneButton() {

        new AlertDialog.Builder(MainActivity.this)
                .setTitle("Dialog Simple")
                .setMessage("Gracias por visitar javaheros.blogspot.com")
                .setPositiveButton("OK", new DialogInterface.OnClickListener() {
                    public void onClick(DialogInterface dialog, int id) {

                        dialog.cancel();
                    }
                }).show();
    }

}

2. Dialog con 2 botones OK y CANCELAR

/*
 * AlertDialog with two button choices.
 * 
 * We also set the ninja icon here.
 */
public void alertTwoButtons() {
    new AlertDialog.Builder(MainActivity.this)
            .setTitle("2 botones")
            .setMessage("¿Usted cree que este exeplo es impresionante?")
            .setIcon(R.drawable.ninja)
            .setPositiveButton("YES",
                    new DialogInterface.OnClickListener() {
                        @TargetApi(11)
                        public void onClick(DialogInterface dialog, int id) {
                            showToast("¡Gracias! Usted es impresionante también!");
                            dialog.cancel();
                        }
                    })
            .setNegativeButton("NO", new DialogInterface.OnClickListener() {
                @TargetApi(11)
                public void onClick(DialogInterface dialog, int id) {
                    showToast("Este ejemplo no fue impresionante para usted. :(");
                    dialog.cancel();
                }
            }).show();
}
3. AlertDialog con 3 botones

/*
 * AlertDialog with three button choices.
 * 
 * We also set the ninja icon here.
 */
public void alertThreeButtons() {
    new AlertDialog.Builder(MainActivity.this)
            .setTitle("3 botones")
            .setMessage("¿A donde quieres ir?")
            .setIcon(R.drawable.ninja)
            .setPositiveButton("RIGHT",
                    new DialogInterface.OnClickListener() {
                        @TargetApi(11)
                        public void onClick(DialogInterface dialog, int id) {
                            showToast("Quieres ir a la DERECHA.");

                            dialog.cancel();
                        }
                    })
            .setNeutralButton("CENTER",
                    new DialogInterface.OnClickListener() {
                        @TargetApi(11)
                        public void onClick(DialogInterface dialog, int id) {
                            showToast("Quieres ir al CENTRO.");
                            dialog.cancel();
                        }
                    })
            .setNegativeButton("LEFT",
                    new DialogInterface.OnClickListener() {
                        @TargetApi(11)
                        public void onClick(DialogInterface dialog, int id) {
                            showToast("Quieres ir a la IZQUIERDA.");
                            dialog.cancel();
                        }
                    }).show();
}
4. AlertDialog con TimePicker

El TimePicker en nuestro ejemplo se llama desde un recurso de layout. También puede hacerlo mediante programación pero recomiendo el uso de un recurso del formato XML para que su TimePicker se puede reutilizar fácilmente.

/*
 * Show AlertDialog with time picker.
 */
public void alertTimePicker() {

    /*
     * Inflate the XML view. activity_main is in res/layout/time_picker.xml
     */
    LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    View view = inflater.inflate(R.layout.time_picker, null, false);

    // the time picker on the alert dialog, this is how to get the value
    final TimePicker myTimePicker = (TimePicker) view
            .findViewById(R.id.myTimePicker);

    /*
     * To remove option for AM/PM, add the following line:
     * 
     * operatingHoursTimePicker.setIs24HourView(true);
     */

    // the alert dialog
    new AlertDialog.Builder(MainActivity.this).setView(view)
            .setTitle("Set Time")
            .setPositiveButton("Go", new DialogInterface.OnClickListener() {
                @TargetApi(11)
                public void onClick(DialogInterface dialog, int id) {

                    String currentHourText = myTimePicker.getCurrentHour()
                            .toString();

                    String currentMinuteText = myTimePicker
                            .getCurrentMinute().toString();

                    // We cannot get AM/PM value since the returning value
                    // will always be in 24-hour format.

                    showToast(currentHourText + ":" + currentMinuteText);

                    dialog.cancel();

                }

            }).show();
}
res/layout/time_picker.xml



5. AlertDialog con DataPicker

Tenga en cuenta que estamos usando un recurso layout de DatePicker en XML aquí, lo llamamos date_picker.xml, el código también se proporciona a continuación.

/*
 * Show AlertDialog with date picker.
 */
public void alertDatePicker() {

    /*
     * Inflate the XML view. activity_main is in res/layout/date_picker.xml
     */
    LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    View view = inflater.inflate(R.layout.date_picker, null, false);

    // the time picker on the alert dialog, this is how to get the value
    final DatePicker myDatePicker = (DatePicker) view.findViewById(R.id.myDatePicker);
    
    // so that the calendar view won't appear
    myDatePicker.setCalendarViewShown(false);
    
    // the alert dialog
    new AlertDialog.Builder(MainActivity.this).setView(view)
            .setTitle("Set Date")
            .setPositiveButton("Go", new DialogInterface.OnClickListener() {
                @TargetApi(11)
                public void onClick(DialogInterface dialog, int id) {

                    /*
                     * In the docs of the calendar class, January = 0, so we
                     * have to add 1 for getting correct month.
                     * http://goo.gl/9ywsj
                     */
                    int month = myDatePicker.getMonth() + 1;
                    int day = myDatePicker.getDayOfMonth();
                    int year = myDatePicker.getYear();

                    showToast(month + "/" + day + "/" + year);

                    dialog.cancel();

                }

            }).show();
}
res/layout/date_picker.xml codigo

6. AlertDialog con simple ListView

/*
 * Show AlertDialog with a simple list view.
 * 
 * No XML needed.
 */
public void alertSimpleListView() {

    /*
     * WebView is created programatically here.
     * 
     * @Here are the list of items to be shown in the list
     */
    final CharSequence[] items = { "John", "Michael", "Vincent", "Dalisay" };

    AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
    builder.setTitle("Make your selection");
    builder.setItems(items, new DialogInterface.OnClickListener() {
        public void onClick(DialogInterface dialog, int item) {

            // will toast your selection
            showToast("Name: " + items[item]);
            dialog.dismiss();

        }
    }).show();
}
7. AlertDialog con ScrollView

Se puede lograr utilizando el código de abajo con un recurso diseño XML con un TextView envuelto dentro de un widget ScrollView. Ver scroll_text.xml el código también se proporciona a continuación.

/*
 * Show AlertDialog with ScrollView.
 * 
 * We use a TextView as ScrollView's child/host
 */
public void alertScrollView() {

    /*
     * Inflate the XML view.
     * 
     * @activity_main is in res/layout/scroll_text.xml
     */
    LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    View myScrollView = inflater.inflate(R.layout.scroll_text, null, false);

    // textViewWithScroll is the name of our TextView on scroll_text.xml
    TextView tv = (TextView) myScrollView
            .findViewById(R.id.textViewWithScroll);

    // Initializing a blank textview so that we can just append a text later
    tv.setText("");

    /*
     * Display the text 10 times so that it will exceed the device screen
     * height and be able to scroll
     */
    for (int x = 1; x < 50; x++) {
        tv.append("You've been HACKED!\n");
        tv.append("By NINJAZHAI.\n");
        tv.append("Just kidding.\n\n");
    }

    new AlertDialog.Builder(MainActivity.this).setView(myScrollView)
            .setTitle("Scroll View")
            .setPositiveButton("OK", new DialogInterface.OnClickListener() {
                @TargetApi(11)
                public void onClick(DialogInterface dialog, int id) {
                    dialog.cancel();
                }

            }).show();

}
res/layout/scroll_text.xml codigo



    

8. AlertDialog con EditText, etc.

/*
 * Show AlertDialog with some form elements.
 */
public void alertFormElements() {

    /*
     * Inflate the XML view. activity_main is in
     * res/layout/form_elements.xml
     */
    LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    final View formElementsView = inflater.inflate(R.layout.form_elements,
            null, false);

    // You have to list down your form elements
    final CheckBox myCheckBox = (CheckBox) formElementsView
            .findViewById(R.id.myCheckBox);

    final RadioGroup genderRadioGroup = (RadioGroup) formElementsView
            .findViewById(R.id.genderRadioGroup);

    final EditText nameEditText = (EditText) formElementsView
            .findViewById(R.id.nameEditText);

    // the alert dialog
    new AlertDialog.Builder(MainActivity.this).setView(formElementsView)
            .setTitle("Form Elements")
            .setPositiveButton("OK", new DialogInterface.OnClickListener() {
                @TargetApi(11)
                public void onClick(DialogInterface dialog, int id) {

                    String toastString = "";

                    /*
                     * Detecting whether the checkbox is checked or not.
                     */
                    if (myCheckBox.isChecked()) {
                        toastString += "Happy is checked!\n";
                    } else {
                        toastString += "Happy IS NOT checked.\n";
                    }

                    /*
                     * Getting the value of selected RadioButton.
                     */
                    // get selected radio button from radioGroup
                    int selectedId = genderRadioGroup
                            .getCheckedRadioButtonId();

                    // find the radiobutton by returned id
                    RadioButton selectedRadioButton = (RadioButton) formElementsView
                            .findViewById(selectedId);

                    toastString += "Selected radio button is: "
                            + selectedRadioButton.getText() + "!\n";

                    /*
                     * Getting the value of an EditText.
                     */
                    toastString += "Name is: " + nameEditText.getText()
                            + "!\n";

                    showToast(toastString);

                    dialog.cancel();
                }

            }).show();
}
res/layout/form_elements.xml



    

    


        


        

    

    

        
    

9 AlertDialog con WebView

/*
 * Show AlertDialog with web view.
 * 
 * Don't forget the Internet permission on your AndroidManifest.xml
 */
public void alertWebView() {

    // WebView is created programatically here.
    WebView myWebView = new WebView(MainActivity.this);
    myWebView.loadUrl("http://google.com/");

    /*
     * This part is needed so it won't ask the user to open another browser.
     */
    myWebView.setWebViewClient(new WebViewClient() {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            view.loadUrl(url);
            return true;
        }
    });

    new AlertDialog.Builder(MainActivity.this).setView(myWebView)
            .setTitle("My Web View")
            .setPositiveButton("OK", new DialogInterface.OnClickListener() {
                @TargetApi(11)
                public void onClick(DialogInterface dialog, int id) {

                    dialog.cancel();

                }

            }).show();
}
10. AlertDialog con diseño personalizado

public void alertCustomizedLayout(){
    
    AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);

    // get the layout inflater
    LayoutInflater inflater = MainActivity.this.getLayoutInflater();

    // inflate and set the layout for the dialog
    // pass null as the parent view because its going in the dialog layout
    builder.setView(inflater.inflate(R.layout.login, null))
    
    // action buttons
    .setPositiveButton("Login", new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int id) {
            // your sign in code here
        }
    })
    .setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
        public void onClick(DialogInterface dialog, int id) {
            // remove the dialog from the screen
        }
    })
    .show();  
    
}
res/layout/login.xml



    

    

    

11. AlertDialog con radio butons/Single Choice Item

public void alertSingleChoiceItems(){
    
    AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
    
    // Set the dialog title
    builder.setTitle("Choose One")
    
    // specify the list array, the items to be selected by default (null for none),
    // and the listener through which to receive call backs when items are selected
    // again, R.array.choices were set in the resources res/values/strings.xml
    .setSingleChoiceItems(R.array.choices, 0, new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface arg0, int arg1) {
            showToast("Some actions maybe? Selected index: " + arg1);
        }

    })
           
     // Set the action buttons
    .setPositiveButton("OK", new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int id) {
            // user clicked OK, so save the mSelectedItems results somewhere
            // or return them to the component that opened the dialog
            
            int selectedPosition = ((AlertDialog)dialog).getListView().getCheckedItemPosition();
            showToast("selectedPosition: " + selectedPosition);
            
        }
    })
    
    .setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int id) {
            // removes the dialog from the screen
            
        }
    })
    
    .show();
    
}
res/values/strings.xml



    TestApp
    Hello world!
    Settings
    TestApp
    showTimeDialogFrom

    
        Coke
        Pepsi
        Sprite
        Seven Up
    

12. AlertDialog con CheckButtons/Multiple Choice Item


public void alertMultipleChoiceItems(){
    
    // where we will store or remove selected items
    mSelectedItems = new ArrayList();  
    
    AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
    
    // set the dialog title
    builder.setTitle("Choose One or More")
    
    // specify the list array, the items to be selected by default (null for none),
    // and the listener through which to receive call backs when items are selected
    // R.array.choices were set in the resources res/values/strings.xml
    .setMultiChoiceItems(R.array.choices, null, new DialogInterface.OnMultiChoiceClickListener() {

        @Override
        public void onClick(DialogInterface dialog, int which, boolean isChecked) {
            
            if (isChecked) {
                // if the user checked the item, add it to the selected items
                mSelectedItems.add(which);
            } 
        
            else if (mSelectedItems.contains(which)) {
                // else if the item is already in the array, remove it 
                mSelectedItems.remove(Integer.valueOf(which));
            }
            
            // you can also add other codes here, 
            // for example a tool tip that gives user an idea of what he is selecting
            // showToast("Just an example description.");
        }

    })
           
     // Set the action buttons
    .setPositiveButton("OK", new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int id) {
            
            // user clicked OK, so save the mSelectedItems results somewhere
            // here we are trying to retrieve the selected items indices
            String selectedIndex = "";
            for(Integer i : mSelectedItems){
                selectedIndex += i + ", ";
            }
            
            showToast("Selected index: " + selectedIndex);
        
        }
    })
    
    .setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int id) {
            // removes the AlertDialog in the screen
        }
    })
    
    .show();
    
}
El strings.xml usado es el mismo de el ejemplo 11.

13. AlertDialog con EditText y Soft-Keyboard muestra automaticamente.

public void alertEditTextKeyboardShown(){
    
    // creating the EditText widget programatically
    EditText editText = new EditText(MainActivity.this);
    
    // create the AlertDialog as final
    final AlertDialog dialog = new AlertDialog.Builder(MainActivity.this)
        .setMessage("You are ready to type")
        .setTitle("The Code of a Ninja")
        .setView(editText)
        
         // Set the action buttons
        .setPositiveButton("OK", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int id) {
                
            }
        })
        
        .setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int id) {
            // removes the AlertDialog in the screen
            }
        })
        .create();
    
    // set the focus change listener of the EditText
    // this part will make the soft keyboard automaticall visible
    editText.setOnFocusChangeListener(new View.OnFocusChangeListener() {
        @Override
        public void onFocusChange(View v, boolean hasFocus) {
            if (hasFocus) {
                dialog.getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_VISIBLE);
            }
        }
    });
    
    dialog.show();

}
14. Previniendo AlertDialog de cerrar cuando un boton se clickeado

public void alertPersistentDialog(){
    
    final AlertDialog alertDialog = new AlertDialog.Builder(MainActivity.this)
        .setTitle("The Code of a Ninja")
        .setMessage("This is a persistent AlertDialog")
        .setPositiveButton("Show Toast", null) // null to override the onClick
        .setNegativeButton("Dismiss", null)
        .setCancelable(false)
        .create();

    alertDialog.setOnShowListener(new DialogInterface.OnShowListener() {

        @Override
        public void onShow(DialogInterface dialog) {

            Button btnPositive = alertDialog.getButton(AlertDialog.BUTTON_POSITIVE);
            btnPositive.setOnClickListener(new View.OnClickListener() {

                @Override
                public void onClick(View view) {

                    showToast("Dialog not dismissed!");
                    
                }
            });
            
            
            Button btnNegative = alertDialog.getButton(AlertDialog.BUTTON_NEGATIVE);
            btnNegative.setOnClickListener(new View.OnClickListener() {

                @Override
                public void onClick(View view) {

                    // dismiss once everything is ok
                    alertDialog.dismiss();
                }
            });
        }
    });
    
    // don't forget to show it
    alertDialog.show();
        
}

1 comentario: