Демонстрация Event Driven программирования

Давайте теперь откроем среду разработки, чтобы посмотреть как работает эта программа.

Мы откроем программу MyListenerDemo.

Это в основном то же, что мы видели ранее.

И если мы создадим экземпляр MyListenerDemo, мы можем увидеть, что на экране отображается холст.

И если вы будете просто нажимать мышью на холсте, то вы можете увидеть, что изображение happyface отображается с расположением в центре положения мыши.

Вы можете перемещать мышь в любое место, но без нажатия на кнопку мыши, ничего не будет отображаться на холсте.

Изображение happyface будет отображаться, только если щелкнуть мышью.

Я хотел бы показать вам еще один пример.

Я сначала покажу вам то, что, как предполагается, эта программа должна делать, прежде чем я покажу вам исходный код.

Мы снова создадим экземпляр программы, и эта программа называется TreeDemo.

При запуске программы, вы сможете увидеть, что отображается дерево.

Опять же, когда вы нажимаете на холсте, вы обнаружите, что отображаются кленовые листы, в том месте, где вы кликнули мышью.

Если вы кликаете на другом месте, вы видите, что там отображается другой лист, и в этом случае лист ориентирован по-другому, а также его размер отличается от того, который был показан ранее.

И вы можете повторить этот процесс, нажимая на различных местах на холсте.

Вы можете видеть, что на холсте отображаются различные размеры кленовых листьев, с различной ориентацией.

Теперь мы посмотрели, что эта программа должна делать. И давайте посмотрим, как это реализовано в программе.

Здесь мы должны включить класс, который вы уже использовали и который называется Random, потому что, как вы могли видеть, листья ориентируются с помощью генератора случайных чисел. Размер листьев также рандомизирован.

И вы можете видеть, что мы открываем файл tree.jpg, и мы также открываем другой файл изображения под названием leaf.png в рамках метода mouseClicked.

Таким образом, вы можете видеть, что мы также добавили MouseListener к холсту, потому что холст, опять же, считается источником события.

Как я уже говорил, мы используем генератор случайных чисел для случайного расположения, а также масштаба листа, который будет отображаться на холсте.

После того, как мы сформировали местоположение и масштаб, мы просто устанавливаем масштаб, и мы устанавливаем местоположение для изображения кленового листа.

Метод mouseClicked отображает изображение в соответствии с генерируемым расположением.

Вы можете видеть, что мы также осуществляем корректировки в расположении, так что кленовые листья отображаются в центре расположения клика мыши.

Мы также определили методы mousePressed, mouseReleased, mouseEntered, и mouseExited. Хотя мы на самом деле не должны использовать их в программе. В этом случае мы можем просто объявить пустое тело для этих методов.

Основная работа ведется в методе mouseClicked, который определяется в интерфейсе MouseListener.

Таким образом, эта программа позволяет расти деревьям в любое время в течение года.

Можно также легко модифицировать эту программу так, что различные объекты могут быть добавлены к фоновому изображению.

Хотя сейчас не Новый Год, все же, будет приятно создать свою собственную елку.

Давайте изменим эту программу, чтобы создать класс ChristmasTree.

Здесь нас есть набор елочных украшений.

И мы можем создать массив для хранения этих украшений, предполагая, что у нас есть десять елочных украшений.

А потом мы можем инициализировать этот массив для хранения этих украшений.

Мы также заменим наше предыдущее изображение дерева на изображение рождественской елки под названием xmastree.png.

В этой реализации mouseClicked, для каждого щелчка мышью, выбирается случайное украшение из массива, так что нам все еще нужен здесь Random класс.

И здесь нет необходимости изменять ориентацию.

Но мы не знаем, что делать с размером, поэтому просто установим пока масштабирование в 1, и увидим, что произойдет.

Давайте скомпилируем программу и запустим программу путем создания экземпляра, и вызовем метод demo.

Вы видите, что отображается Рождественская елка и давайте попробуем добавить украшения для елки.

Мы видим, что с масштабированием что-то не так.

Так что подумайте о том, что вы могли бы сделать с масштабированием, чтобы все украшения были уменьшены до некоторого соответствующего размера перед добавлением в холст.

Здесь я изменил программу, так, как это должно примерно выглядеть.

Графический интерфейс пользователя

Трудно понимать событийное программирование без некоторого понимания как работает графический интерфейс пользователя, или GUI.

Так что сейчас я дам вам краткое введение в GUI.

Мы все должны быть знакомы с графическим пользовательским интерфейсом, современный графический интерфейс управляется событиями в том смысле, что он реагирует на действия пользователя через графические компоненты.

Например, пользователь может нажать на кнопку, сказать да или нет, и программа будет затем выполнять некоторые соответствующие действия.

Мы можем позиционировать различные графические объекты, скажем изображения, перетаскивая их с помощью мыши.

Когда мы заполняем форму, текст вводится в текстовое поле, и программа будет сохранять информацию в соответствующем месте в документе.

Вы можете делать выбор в выпадающем меню, чтобы нам не нужно было запоминать все доступные опции.

Когда мы работаем с несколькими окнами, мы часто должны минимизировать их или изменять их размер так, чтобы мы могли сосредоточиться на окне, с которым мы работаем, и закрывать их, если они вам больше не нужны.

Кроме того, с мобильными устройствами, мы можем сделать еще больше, например, изменить размер окна с помощью жестов на мультисенсорном экране, и др.

Существует много чего, что можно сделать с помощью графического интерфейса.

Что я буду делать здесь, так это просто дам вам общее понимание GUI для того, чтобы вы лучше понимали событийное программирование.

Эта диаграмма дает обзор общей организации структуры GUI.

Контейнерами верхнего уровня графического интерфейса являются окна, например, JFrame.

Каждое окно имеет два промежуточных контейнера, которые обычно используются, это меню бар, содержащее меню, и панель содержания, которая содержит остальные компоненты.

Промежуточный контейнер, например, JPanel, может содержать компоненты графического интерфейса пользователя, такие как текстовое поле и кнопки, которые будут помещены в окне.

Эти компоненты являются компонентами управления пользовательского интерфейса, такими как кнопки, JButton, метки, JLabel, и текстовые поля, JTextField.

Их добавляют в контейнер методом аdd().

Макеты, иногда называемые менеджерами компоновки, определяют, как разместить и установить размер компонентов в JPanel или других промежуточных контейнеров.

Каждый контейнер JPanel начинается с менеджера компоновки по умолчанию, но лучше установить его явно.

FlowLayout является одним из наиболее часто используемых менеджеров компоновки.

Как вы можете видеть, эти графические компоненты организованы в иерархическую структуру.

В Java, классы, определяющие эти компоненты также организованы в некоторую иерархическую структуру, и они содержатся в двух пакетах, а именно java.awt и javax.swing.

Обратите внимание, что пакет swing идет под javax с «х» в конце, а не java, как в awt.

Библиотека AWT или abstract windowing toolkit является первоначальным набором классов и методов, который был разработан SUN microsystem для мультиплатформенного GUI.

Библиотека AWT была самой первой графической библиотекой платформы Java.

Далее библиотека AWT была дополнена библиотекой Java 2D двухмерной графики и изображений.

Библиотека AWT обеспечивает для разработчика приложений возможность использования таких основных компонентов GUI-интерфейса как кнопка, флажок, список выбора, прокручивающийся список, метка, диалоговое окно, окно выбора файла, меню, панель с прокруткой, текстовая область и текстовое поле, использования функции Drag-and-Drop, возможность обработки событий UI-компонентов, компоновки элементов GUI в рабочей области, работы с цветом, шрифтом, графикой, рисования и печати.

Библиотека AWT считается тяжеловесной, так как она содержит нативную библиотеку java.awt.peer, через которую взаимодействует с операционной системой компьютера таким образом, что AWT-компоненты имеют своих двойников, реализованных для конкретной операционной системы, с которыми они связаны интерфейсами пакета java.awt.peer.

Поэтому отображение AWT GUI-интерфейса зависит от операционной системы, в которой приложение развернуто.

Для расширения набора GUI-компонентов библиотеки AWT, устранения ее тяжеловесности и возможности выбора внешнего вида и поведения (Look and Feel) GUI-компонентов была создана графическая библиотека Swing.

Библиотека Swing основывается на библиотеке AWT и напрямую не связана, как библиотека AWT, с операционной системой, в которой она работает.

Поэтому библиотека Swing является уже легковесной.

Кроме того, библиотека Swing дополняет библиотеку AWT такими компонентами GUI-интерфейса как панель выбора цвета, индикатор состояния, переключатель radio button, слайдер и спиннер, панель с закладками, таблицы и деревья, расширенными возможностями компоновки GUI-компонентов, таймером, возможностью отображения HTML-контента.

С помощью библиотеки Swing стало возможным создать набор отображений Look and Feel, которые разработчик может выбирать, не оглядываясь на операционную систему, и изменять внешний вид GUI-интерфейса.

Также библиотека Swing реализует архитектуру MVC (Model-View-Controller) и потоковую модель Event Dispatch Thread (EDT).

Список здесь показывает, как эти классы организованы в иерархическую структуру, с помощью подклассов и отношений суперкласса.

Например, JFrame является подклассом класса Frame, и Frame это подкласс класса Window.

И JButton, JLabel, JPanel и JTextField все подклассы класса JPanel.

Если вы откроете Javadoc этих классов, вы сможете получить более подробную информацию об отношениях подкласс-суперкласс этих графических компонентов.

Например, вы можете увидеть, что JFrame это подкласс Frame, который является подклассом класса Window.

Класс JPanel это подкласс JComponent, который является подклассом Container и далее до корневого класса Оbject.

Подкласс – это класс, который является производным от другого класса, который называется суперкласс.

Ключевое слово "extends" используется при объявлении подкласса.

Мы использовали примеры BankAccount, SavingsAccount и CheckingAccount, чтобы проиллюстрировать идею отношений подкласс-суперкласс.

Здесь оба класса SavingsAccount и CheckingAccount являются подклассами класса BankAccount.

Наследование является важным понятием в объектно-ориентированном программировании, и это позволяет подклассам наследовать все поля и методы от своего суперкласса без необходимости переписывать их снова.