29/08/2013
En el tip #15 vimos cómo diseñar nuestros propios Dialog para superar las limitaciones y restricciones que nos imponen los AlertDialog de Android. En este tip vamos a hacer lo mismo pero para los ProgressDialog con el mismo objetivo: controlar completamente tanto el formato del Dialog como sus estilos, haciendo que estos sean los mismos en cualquier dispositivo independientemente de la versión de Android que ejecuten y que, por lo tanto,siempre «encajen» con el estilo de nuestra app.
El ejemplo que se mostrará consistirá en un pequeño Dialog que se mostrará en el centro de la pantalla con la imagen animada circular de progreso de Android y un texto en la parte inferior (el ProgressDialog por defecto obliga a que haya un texto a la derecha de la imagen y su estilo es díficil de modificar).
custom_progressdialog.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@drawable/progressdialog"
android:orientation="vertical" >
<ProgressBar
android:id="@+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"/>
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/loading"
android:textStyle="bold"
android:textColor="@color/progress_text"
android:layout_marginTop="8dp"/>
</LinearLayout>
El formato de la «caja contenedora» del Dialog es el siguiente drawable:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="@color/progress_bg" />
<corners android:radius="10dp" />
<padding android:left="15dp" android:top="15dp" android:right="15dp" android:bottom="15dp"/>
</shape>
Para probar este Dialog simplemente vamos a crear una Activity con un LinearLayout vacio, la aplicación de ejemplo no tiene otro objetivo que mostrar el Dialog. El código de la Activity no puede ser más sencillo:
package com.danielme.tipsandroid.progressdialog;
import android.app.Activity;
import android.app.ProgressDialog;
import android.os.Bundle;
import com.danieme.tipsandroid.progressdialog.R;
/**
*
* @author danielme.com
*
*/
public class MainActivity extends Activity
{
ProgressDialog progressDialog = null;
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
progressDialog = new ProgressDialog(this);
progressDialog.show();
progressDialog.setContentView(R.layout.custom_progressdialog);
//se ppdrá cerrar simplemente pulsando back
progressDialog.setCancelable(true);
//no olvidar invocar dismiss para cerrarlo
}
}
El resultado final dependerá del dispositivo y versión de Android en lo que a la «rueda» se refiere, sobre el resto de elementos tendremos el control absoluto y siempre debería verse igual. Como referencia, dejo a continuación las capturas tomdas del emulador oficial de Android SDK.
- Android 2.1/2.2
- Android 2.3.3
- Android 4/4.1
El proyecto completo se encuentra en Github. Para más información sobre cómo utilizar GitHub, consultar este artículo.
danielme.com 
Gracias, esto es lo que necesitaba 🙂
como se invocaria el dismisis para que cierre despues de un intervalo de tiempo?
Lo más sencillo es usar un postDelayed
new Handler().postDelayed(new Runnable() {
public void run() {
progressDialog.dismiss();
}
}, 5000);
gracias excelente aporte