Многие разработчики Flash используют либо класс Alert для отладки, либо операторы трассировки из-за ассоциаций с Flash. Во Flex есть настоящий отладчик, и это отличный инструмент. Я собираюсь продемонстрировать, как справиться с этим в этом уроке.
Вступление
Ошибки компилятора легко обнаружить и исправить. Вам дана красная точка с буквой X, указывающая, где и в чем проблема.
Ошибки во время выполнения сложнее отследить. Отладчик помогает разработчикам отслеживать ошибки во время выполнения, предоставляя окно для просмотра того, что происходит во время работы приложения, какие значения установлены, что происходит внутри цикла или почему не работает оператор if.
Хорошо, давайте начнем — но прежде чем мы начнем, вот несколько инструментов, которые вам понадобятся:
Отладочная версия Flash Player
Загрузите это здесь . В этом уроке я использую «Отладчик содержимого Macintosh Flash Player 10 Plugin (Mac на базе Intel) (ZIP, 6,03 МБ)». Чтобы проверить, какую версию флеш-плеера вы установили, взгляните на этот удобный инструмент от Питера де Хаана, у которого, кстати, есть отличный блог;)
Adobe Flex Builder 3
Конечно, вам это понадобится. Если у вас его нет, вы всегда можете получить бесплатную копию:
- Бесплатно для всех клиентов образования: https://freeriatools.adobe.com/Flex/
- Бесплатно для безработных разработчиков: https://freeriatools.adobe.com/learnFlex/
Другие полезные вкусности
Образцы с кодом
- http://examples.adobe.com/Flex3/componentexplorer/explorer.html
- http://examples.adobe.com/Flex3/consulting/styleexplorer/Flex3StyleExplorer.html
Справочник по языку Adobe® Flex ™ 3.3
Примечания
Снимки экрана в этом выпуске сделаны на Mac, но должны быть одинаковыми на ПК. Перспектива моего окна может отличаться от того, что вы видите, но вы можете найти все вкладки в меню окна.
Если вы готовы, давайте начнем!
Шаг 1: Настройка точек останова
Я создал новый проект Flex; очень просто, одна панель с двумя кнопками. Каждая кнопка вызывает свою функцию щелчка; b1_click () запустит цикл, вызовет функцию update_Label (). b2_click () создаст ошибку времени выполнения, поскольку не существует такого понятия, как значение n_error.
Что такое точка останова? Точка останова устанавливается в исполняемой строке программы. Если точка останова включена при отладке, выполнение приостанавливается до выполнения этой строки кода. Чтобы приостановить приложение во время его работы, необходимо установить точку останова. Это легко сделать; дважды щелкните по пустому месту рядом с номером строки. Дважды щелкните по нему еще раз, чтобы удалить.
Я установил две точки останова; линии 10 и 20 (две синие точки отображаются на полях). Если я нажму на кнопку 1, она остановится на строке 10, нажмите на кнопку 2, она остановится на строке 20.
Вы можете увидеть все свои точки останова на вкладке «Точки останова», и они могут быть добавлены или удалены в любое время. Кроме того, вы можете использовать флажки, чтобы временно включить / отключить их.
Если вы хотите посмотреть, как меняется число с течением времени, выделите значение, щелкните правой кнопкой мыши, выберите «Смотреть« num »».
«Num» теперь добавлено на вкладку «Выражения».
Шаг 2: Запустите режим отладки и проверьте некоторые значения
Теперь у нас все настроено, давайте начнем раздел отладки. Нажмите на значок, который выглядит как ошибка
или выберите его из меню:
Шаг 3: приложение запущено
Когда приложение начинает работать, вы можете увидеть его в браузере, но ничего не происходит, что делать дальше? Точка останова устанавливается внутри функции, поэтому нам нужно выполнить функцию.
Шаг 4: активировать точку останова
Чтобы активировать точку останова, нажмите «Кнопка 1», чтобы вызвать функцию b1_click (). Затем приложение останавливается на строке 10, а num по-прежнему равно 0, поскольку код «num + = 1;» еще не выполнено. Посмотрите на вкладку «Отладка»; некоторые иконки загораются, и некоторые значения теперь видны.
Шаг 5: Вкладка «Переменные»
Сначала давайте взглянем на вкладку Variables; несколько вещей, чтобы отметить:
- Это : включает в себя все значения в приложении
- Событие : текущее событие прошло
- i : значение, определенное в этой функции
Откройте «это», появится длинный список. Список будет становиться все длиннее и длиннее, чем вы заметите, что ваш компьютер замедляется;)
Шаг 6: Создайте выражение выражения
Поскольку я знаю, что хочу сосредоточиться на «button2.label», давайте найдем его и щелкните правой кнопкой мыши, чтобы выбрать «Создать выражение просмотра».
Шаг 7: Вкладка «Выражение»
Теперь взгляните на вкладку «Выражения», простую и понятную, так, как мне нравится. Две переменные, которые мы сейчас рассматриваем: «num», который мы создали ранее, и «this.button2.label».
Шаг 8. Использование элементов управления Step
Теперь давайте посмотрим на вкладку отладки. На этой вкладке вы увидите, что некоторые значки теперь включены, список имен функций и компонентов. На приведенном ниже снимке экрана показано, что мы в настоящее время находимся в функции myLoop и что компонент «button2» выполнил действие «click», чтобы вызвать эту функцию.
Шаг 9: Изучение Step Controller
Те значки, которые мы заметили (вы можете найти их в меню> запустить тоже), для чего они нужны?
Когда поток приостанавливается, пошаговые элементы управления могут использоваться для поэтапного выполнения программы.
Часто вы также можете использовать ярлыки — запомнить их!
- Возобновить — клавиша F8 (не для пользователя Mac) продолжить запуск приложения.
- Завершить — остановить режим отладки, приложение продолжит работу, но вы больше не сможете отслеживать.
- Шаг за шагом — клавиша F6, переход к следующей строке кода.
- Шаг в — клавиша F5, если текущая строка кода вызывает другую функцию, посмотрите на эту функцию.
- Шаг возврата — клавиша F7, выйти из этой функции.
F6 и F8 будут вашими лучшими друзьями, запомните их!
Шаг 10: Использование клавиши F6
Давайте нажмем F6 несколько раз. Следите за вкладкой Выражение, посмотрите, на что меняется значение.
Шаг 11: Изменение значения
Продолжайте нажимать F6! Значение num изменяется на вкладке «Выражения».
Шаг 12: Использование клавиши F5
Если ваш цикл никогда не заканчивается, не заканчивается рано или никогда не начинается, вы можете внимательно изучить действие, чтобы увидеть, что происходит. Как только мы закончили цикл, вызывается вторая функция update_Label (). Нажатие F6 перешагнет через него, но мы хотим посмотреть, что происходит внутри update_Label (). Нажмите F5 «шаг в».
Теперь мы в функции update_Label ().
Шаг 13: Использование клавиши F7
Вы можете нажать F7, чтобы вернуться к myLoop (). Значение this.button2.label было изменено.
Шаг 14 Использование клавиши F8
Давайте нажмем F8, чтобы возобновить приложение. Теперь ярлык button2 обновлен.
Шаг 15: Прочтите сообщения об ошибках в сеансе отладки.
Хорошо, теперь давайте проверим ошибку в приложении. Мы знаем, что в функции b2_click () есть ошибка, поэтому посмотрим на нее в действии. Нажмите «Button 2», это вызовет функцию b2_click (), и приложение остановится на ошибке.
Шаг 16: вкладка отладки
Внимательно посмотрите на вкладку «Отладка». Здесь он говорит вам, что это за ошибка, и кто звонит.
Шаг 17: вкладка консоли
Вот что отображается на вкладке Консоль. Это дает вам больше информации об ошибке и номер строки, где произошла ошибка.
Шаг 18: Измените значения переменных
Вы всегда можете изменить значение переменных, пока приложение приостановлено. Например, если я хочу изменить button2.label с «num = 10» на «new label», я делаю следующее: сначала найдите переменную «label», щелкните правой кнопкой мыши и выберите «Change Value».
Шаг 19: Установите значение всплывающего окна
Появится окно Set Value, в котором отображается текущее значение.
Шаг 20: введите новое значение
Я собираюсь изменить эту строку на «новый ярлык», а затем нажмите ОК.
Шаг 21: Обновить новое значение
Теперь на вкладке Variables устанавливается новое значение.
Шаг 22: Возобновить приложение
Возобновите приложение, вы увидите, что ярлык обновлен.
Вывод
Хорошо, теперь вы знаете, как использовать отладчик! Вот краткое резюме:
- Дважды щелкните Создать точку останова.
- Нажмите на значок ошибки, чтобы начать режим отладки.
- Запустите действие, чтобы приостановить приложение.
- Вкладка «Переменные» сообщает вам, каково значение.
- Вкладка Консоль подскажет, в чем и где ошибка (если есть).
- Вкладка «Отладка» показывает, кто звонил, кто, а кто сделал wha.t
- Затем ждет вас, чтобы сказать ему, какое действие предпринять.
Если вы думаете, что готовы проверить свои навыки отладки сейчас, попробуйте их в своем приложении!
Последний совет для новичков во Flex: не забывайте всегда экспортировать сборку выпуска, а не сборку отладки, которая намного больше. Я надеюсь, вам понравилось читать вместе!
