Muchos desarrolladores de Flash utilizan la clase Alert para la depuración o las declaraciones de seguimiento debido a las asociaciones con Flash. Flex tiene un verdadero depurador y es una gran herramienta. Voy a demostrar cómo enfrentarlo en este tutorial..
Los errores del compilador son fáciles de detectar y corregir. Se le da un punto rojo con una X, que le indica dónde y cuál es el problema.
Los errores de tiempo de ejecución son más difíciles de rastrear. El depurador ayuda a los desarrolladores al rastrear los errores de tiempo de ejecución, dando una ventana para ver qué sucede mientras la aplicación se está ejecutando, qué valores están configurados, qué sucede dentro de un bucle o por qué la instrucción if no funciona.
Bien, empecemos, pero antes de comenzar, aquí hay algunas herramientas que necesitará:
Descarga esto aquí. Durante este tutorial, estoy usando "el depurador de contenido del complemento Macintosh Flash Player 10 (Macs con base Intel) (ZIP, 6.03 MB)". Para probar qué versión de Flash Player has instalado, echa un vistazo a esta útil herramienta de Peter DeHaan, quien por cierto tiene un gran blog;)
Ver tamaño completoPor supuesto, necesitarás esto. Si no lo tienes, siempre puedes obtener una copia gratis:
Muestras con código
Referencia del lenguaje Adobe® Flex ™ 3.3
Las capturas de pantalla en este tut están hechas en Mac, pero deberían ser las mismas en la PC. La perspectiva de mi ventana puede ser diferente de la que ves, pero puedes encontrar todas las pestañas debajo del menú de la ventana.
Si estás listo, empecemos!
He creado un nuevo proyecto Flex; Muy simple, un panel con dos botones. Cada botón llamará a su función de clic; b1_click () ejecutará un bucle, llame a la función update_Label (). b2_click () creará un error de tiempo de ejecución, ya que no existe el valor n_error.
/> Ver tamaño completo¿Qué es un punto de quiebre?? Un punto de interrupción se establece en una línea ejecutable de un programa. Si el punto de interrupción está habilitado cuando depura, la ejecución se suspende antes de que se ejecute esa línea de código. Para suspender la aplicación mientras se está ejecutando, necesita establecer un punto de interrupción. Es facil de hacer; Haga doble clic en el espacio vacío al lado del número de línea. Haga doble clic en él de nuevo para eliminar.
Puse dos puntos de ruptura; líneas 10 y 20 (dos puntos azules aparecen en el margen). Si hago clic en el botón 1, se detendrá en la línea 10, haga clic en el botón 2 y se detendrá en la línea 20.
Puede ver todos sus puntos de ruptura en la pestaña "Puntos de ruptura" y se pueden agregar o eliminar en cualquier momento que desee. Además, puede usar las casillas de verificación para habilitarlas / deshabilitarlas temporalmente.
Si desea ver cómo cambia el número a lo largo del tiempo, resalte el valor, haga clic con el botón derecho, seleccione "Watch 'num'".
"Num" ahora se agrega a la pestaña Expresiones.
/> Ver tamaño completoAhora que tenemos todo configurado, comencemos la sección de depuración. Haz clic en el icono que parece un error.
/> Ver tamaño completoo selecciónelo del menú:
/> Ver tamaño completoA medida que la aplicación comienza a ejecutarse, puede verla en el navegador pero no pasa nada, ¿qué hacer a continuación? El punto de interrupción se establece dentro de la función, por lo que necesitamos ejecutar la función.
/> Ver tamaño completoPara activar el punto de interrupción, haga clic en "Botón 1" para llamar a la función b1_click (). La aplicación se detiene en la línea 10 y el número sigue siendo 0 ya que el código "num + = 1;" no ha ejecutado todavia Mira la pestaña de depuración; Algunos iconos se iluminan y algunos valores ahora son visibles..
/> Ver tamaño completoPrimero echemos un vistazo a la pestaña Variables; algunas cosas a tener en cuenta:
Abre "esto", una larga lista se mostrará. La lista seguirá haciéndose más y más larga, entonces notará que su computadora se ralentiza;)
Como sé que quiero centrarme en "button2.label", vamos a encontrarlo y hacer clic derecho para seleccionar "Crear expresión de observación".
Ahora eche un vistazo a la pestaña Expresiones, simple y limpia, tal como me gusta. Dos variables que estamos viendo ahora, "num" que creamos anteriormente, y "this.button2.label".
Ahora echemos un vistazo a la pestaña de depuración. En esta pestaña, verá que algunos iconos ahora están habilitados, una lista de nombres de funciones y nombres de componentes. La captura de pantalla a continuación muestra que actualmente estamos en la función myLoop y que el componente "button2" realizó una acción "clic" para llamar a esta función.
/> Ver tamaño completoEsos íconos que notamos (puedes encontrarlos en el menú> ejecutar también), ¿para qué sirven??
/> Ver tamaño completoCuando se suspende un hilo, los controles de pasos se pueden usar para avanzar en la ejecución del programa línea por línea.
A menudo, también puedes usar atajos - memorízalos!
F6 y F8 serán tus mejores amigos, recuérdalos.!
Presionemos F6 unas cuantas veces. Mantenga su ojo en la pestaña Expresión, vea a qué está cambiando el valor.
/> Ver tamaño completo¡Sigue presionando F6! El valor de num está cambiando en la pestaña Expresiones.
/> Ver tamaño completoSi su ciclo nunca termina, termina temprano o nunca comienza, puede observar la acción de cerca para ver qué está sucediendo. Una vez que hemos terminado el bucle, se llama a la segunda función update_Label (). Presionando F6 lo pisará, pero queremos ver que pasa dentro la update_Label (). Presione F5 "entrar".
/> Ver tamaño completoAhora estamos en la función update_Label ().
/> Ver tamaño completoPuede presionar F7 para volver a myLoop (). El valor de "this.button2.label" ha sido cambiado.
/> Ver tamaño completoVamos a presionar F8 para reanudar la aplicación. Ahora la etiqueta de button2 ha sido actualizada.
/> Ver tamaño completoOK, ahora vamos a probar el error en la aplicación. Sabemos que hay un error en la función b2_click (), así que vamos a verlo en acción. Haga clic en "Botón 2", esto llamará a la función b2_click (), y la aplicación se detendrá en el error.
/> Ver tamaño completoEche un vistazo de cerca a la pestaña Depuración. Aquí te dice cuál es el error y quién llama..
/> Ver tamaño completoEsto es lo que se muestra en la pestaña Consola. Le proporciona más información sobre el error y el número de línea donde ocurrió el error..
/> Ver tamaño completoSiempre puede cambiar el valor de las variables mientras la aplicación está suspendida. Por ejemplo, si quiero cambiar button2.label de "num = 10" a "nueva etiqueta", hago lo siguiente: primero encuentro la variable "etiqueta", haga clic con el botón derecho y seleccione Cambiar valor.
Aparece la ventana Establecer valor y muestra el valor actual..
Voy a cambiar esa cadena a "nueva etiqueta", luego presione OK.
Ahora en la pestaña Variables, se establece el nuevo valor..
Reanudar la aplicación, verás que la etiqueta ha sido actualizada..
/> Ver tamaño completoBien, ahora sabes cómo usar el depurador! Aquí hay un breve resumen:
Si cree que está listo para probar sus habilidades de depuración ahora, inténtelo en su propia aplicación!
Un último consejo para aquellos que son nuevos en Flex: recuerde siempre exportar una versión de lanzamiento, no la versión de depuración que es mucho más grande. Espero que hayas disfrutado leyendo!