Sep 5, 2012

Android ActionBarSherlock: DialogFragment

Hace poco hablamos de la librería ActionBarSherlock y como nos ayudaba a implementar funcionalidad de la versión 4 de Android en versiones anteriores.

Hoy hablaremos del DialogFragment y como implementarlo en nuestro proyecto.

Los DialogFragment son la evolución en ICS de los antiguos diálogos, con un diseño más cuidado y que Google define como un Fragment que muestra una pantalla de diálogo. Este sabe gestionar su ciclo de vida para poder mostrarlo, ocultarlo o reciclarlo. Aquí tenéis más información sobre la implementación en ICS que es prácticamente lo mismo por basarse en esto.

Lo primero de todo es haber seguido los pasos que en su día explicamos para incluir la librería ActionBarSherlock en nuestro proyecto.

Vamos a hacer un layout llamado dialog.xml, en este layout mostraremos nuestro mensaje. Si lo queréis podéis personalizarlo según vuestras necesidades. Nosotros pondremos un TextView y un Button.

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:padding="4dip"
    android:gravity="center_horizontal"
    android:layout_width="match_parent" android:layout_height="match_parent">

    <TextView
            android:id="@+id/message"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_gravity="center_vertical|center_horizontal"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:gravity="top|center_horizontal"
            android:layout_margin="10dip"
            />

    <Button android:id="@+id/continuar"
        android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:layout_weight="0"
        style="@style/Button"
        android:text="Aceptar">
        <requestFocus />
    </Button>

</LinearLayout>

Lo siguiente que vamos a hacer es crearnos una clase que manejará la forma de presentar los dialogos. Para ello dentro de la Activity donde vayais a mostrar el dialog ponéis la siguiente clase. Como ya he ido diciendo en más entradas, yo lo que suelo hacer es crear una clase que hereda de Activity donde pongo este tipo de códigos tan repetitivos y el resto de Activitys heredan de esta. De esta forma se simplifica mucho nuestro código.

public static class DialogFragmentManager extends SherlockDialogFragment{
   String mMessage = "";
   boolean mShowButton = true;
   
   static DialogFragmentManager newInstance(String Message, boolean showButton){
    DialogFragmentManager f = new DialogFragmentManager();
    
    Bundle args = new Bundle();
    args.putString("message", Message);
    args.putBoolean("showbutton", showButton);
    f.setArguments(args);
    return f;
   }
   
   @Override
   public void onCreate(Bundle savedIntanceState){
    super.onCreate(savedIntanceState);
    mMessage = getArguments().getString("message");
    mShowButton = getArguments().getBoolean("showbutton");    
   }
   
   @Override 
   public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedIntanceState){
    View v = inflater.inflate(R.layout.dialog, container, false);
    View tv = v.findViewById(R.id.message);
    ((TextView) tv).setText(mMessage);    
    
     Button button = (Button) v.findViewById(R.id.continuar);
     if(!mShowButton){
      button.setVisibility(View.GONE);
     }
             button.setOnClickListener(new OnClickListener() {
                 public void onClick(View v) {
                  ((NombreDeMiActivity) getActivity()).closeMessage();
                  DialogFragmentManager.this.dismiss();
                  DialogFragmentManager.this.onDestroy();
                  DialogFragmentManager.this.onDestroyView();
                }
             });    
    return v;
   }
  }

Esta clase hereda de la clase incluida en la ActionBarSherlock, SherlockDialogFragment. A nuestro Dialog le pasaremos un mensaje y le diremos si queremos mostrar o no el botón de aceptar. Fijaros como le pasamos y recogemos parámetros en los dos primeros métodos. Si necesitais más parámetros podeis ir incluyendolos aquí según lo que querais hacer.

En el onCreateView pintamos nuestro layout dialog y instanciamos nuestro TextBox y Button. Aquí es desde donde debeis inicializar el resto de controles si decidis añadir más al Dialog. Aquí en concreto se setea el texto del mensaje y hacemos visible el Button si así se le indica. Además seteamos el click para que cierre el Dialog.

protected void showMessage(String message, boolean showButton){
   FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
        Fragment prev = getSupportFragmentManager().findFragmentByTag("dialog");
        if (prev != null) {
            ft.remove(prev);
        }
        ft.addToBackStack(null);


        DialogFragment newFragment = DialogFragmentManager.newInstance(message, showButton);
        newFragment.show(ft, "dialog");
  }
  
  protected void closeMessage(){
   FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
        Fragment prev = getSupportFragmentManager().findFragmentByTag("dialog");
        if (prev != null) {
            ft.remove(prev);
        }
        ft.addToBackStack(null);        
  }

Por último, en nuestra Activity creamos estos dos métodos. El primero de ellos mostrará un Dialog con el texto que le indiquemos y el segundo simplemente lo cerrara.

Bio
Latest Posts

Daniel Ferrer Delgado

Técnico en Administración de Sistemas y Desarrollo de Aplicaciones. Amigo de sus amigos, y una mente inquieta que no puede dejar un ordenador de lado porque necesita programar aplicaciones Android o aplicaciones en general, además de páginas web. Nuestro programador de cabecera y espero que también el vuestro.