Кодирование простого Java графического интерфейса пользователя

Графический интерфейс пользователя (GUI), построенный с использованием Платформа Java NetBeans состоит из нескольких слоев контейнеров. Первый слой - это окно, используемое для перемещения приложения по экрану вашего компьютера. Это называется контейнером верхнего уровня, и его задача - предоставить всем другим контейнерам и графическим компонентам место для работы. Обычно для настольного приложения этот контейнер верхнего уровня будет создаваться с использованием

учебный класс.

Вы можете добавить любое количество слоев в свой дизайн GUI, в зависимости от его сложности. Вы можете поместить графические компоненты (например, текстовые поля, метки, кнопки) непосредственно в

Или вы можете сгруппировать их в другие контейнеры.

Слои GUI известны как иерархия содержания и могут рассматриваться как семейное древо. Если

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

Для этого примера мы создадим графический интерфейс с

содержащий два

и

. Первый

будет держать

instagram viewer

и

. Секунда

будет держать

и

. Единственный

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

.

Существует два способа создания этого графического интерфейса с использованием NetBeans. Первый - вручную ввести код Java, представляющий графический интерфейс, который обсуждается в этой статье. Второе - использовать инструмент NetBeans GUI Builder для создания Swing GUI.

Информацию об использовании JavaFX вместо Swing для создания графического интерфейса см. В разделе Что такое JavaFX?

Заметка: Полный код этого проекта находится по адресу Пример кода Java для создания простого приложения с графическим интерфейсом.

Настройка проекта NetBeans

Создать новый Джава Проект приложения в NetBeans с основным классом Мы назовем проект

Пропускной пункт: В окне «Проекты» NetBeans должна быть папка GuiApp1 верхнего уровня (если имя не выделено жирным шрифтом, щелкните правой кнопкой мыши папку и выберите

). Под

папка должна быть папкой Source Packages с

называется GuiApp1. Эта папка содержит основной класс

.Джава.

Прежде чем мы добавим какой-либо код Java, добавьте следующий импорт в начало

класс, между

линия и

:

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

В методе main добавьте эту строку кода:

Это означает, что первое, что нужно сделать, это создать новый

объект. Это хороший ярлык для примера программ, поскольку нам нужен только один класс. Чтобы это работало, нам нужен конструктор для

класс, поэтому добавьте новый метод:

В этом методе мы поместим весь Java-код, необходимый для создания графического интерфейса, а это означает, что каждая строка теперь будет внутри

метод.

Дизайн Примечание: Возможно, вы видели опубликованный Java-код, который показывает класс (т.е.

) продлен от

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

класс, если вам нужно сделать более конкретный тип

(Взгляни на

для получения дополнительной информации о создании подкласса).

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

. Чтобы создать

объект, вызовите

конструктор:

Далее мы установим поведение нашего окна приложения с графическим интерфейсом, используя следующие четыре шага:

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

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

3. Установите размер окна так, чтобы размер окна соответствовал графическим компонентам, которые вы помещаете в него.

Дизайн Примечание: Альтернативный вариант для установки размера окна - вызвать

метод

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

метод.

4. Отцентрируйте окно, чтобы оно появилось в центре экрана компьютера, чтобы оно не отображалось в верхнем левом углу экрана:

Добавление двух JPanels

Две линии здесь создают ценности для

и

объекты, которые мы будем создавать в ближайшее время, используя два

массивы. Это облегчает заполнение некоторых примеров записей для этих компонентов:

Создайте первый объект JPanel

Теперь давайте создадим первый

объект. Он будет содержать

и

. Все три создаются с помощью методов конструктора:

Примечания к вышеупомянутым трем строкам:

  • JPanel
    переменная объявлена окончательный. Это означает, что переменная может содержать только
    JPanel
    что создано в этой строке. В результате мы можем использовать переменную во внутреннем классе. Становится понятным, почему мы хотим позже в коде.
  • JLabel
    и
    JComboBox
    имеют значения, переданные им, чтобы установить их графические свойства. Ярлык будет отображаться как «Фрукты:», а в поле со списком теперь будут значения, содержащиеся в
    fruitOptions
    массив объявлен ранее.
  • добавлять()
    метод
    JPanel
    помещает графические компоненты в него.
    JPanel
    использует FlowLayout в качестве значения по умолчанию менеджер по расположению. Это хорошо для этого приложения, так как мы хотим, чтобы этикетка располагалась рядом с выпадающим списком. Пока мы добавляем
    JLabel
    во-первых, это будет хорошо выглядеть

Создайте второй объект JPanel

Секунда

следует той же схеме. Мы добавим

и

и установите значения этих компонентов, чтобы быть «Овощи:» и второй

массив

. Единственным другим отличием является использование

способ скрыть

. Не забывайте, что будет

контролируя видимость двух

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

:

В приведенном выше коде стоит отметить одну строку:

метод

.

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

Добавление завершающих штрихов

Последний необходимый компонент - это

контролировать видимость

s. Значение, переданное в

Конструктор устанавливает метку кнопки:

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

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

использует класс ActionListener для «прослушивания» нажатия кнопки пользователем.

Создайте прослушиватель событий

Поскольку это приложение выполняет простую задачу при нажатии кнопки, мы можем использовать анонимный внутренний класс для определения прослушивателя событий:

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

  • Во-первых, мы называем
    addActionListener
    метод
    JButton
    . Этот метод ожидает экземпляр
    ActionListener
    класс, который является классом, который слушает событие.
  • Далее мы создаем экземпляр
    ActionListener
    класс, объявив новый объект с помощью
    новый ActionListener ()
    и затем предоставление анонимного внутреннего класса, который представляет собой весь код в фигурных скобках.
  • Внутри анонимного внутреннего класса добавьте метод с именем
    actionPerformed ()
    . Это метод, который вызывается при нажатии кнопки. Все, что нужно в этом методе, это использовать
    SetVisible ()
    изменить видимость
    JPanel
    s.

Добавьте JPanels в JFrame

Наконец, нам нужно добавить два

с и

к

. По умолчанию

использует менеджер компоновки BorderLayout. Это означает, что есть пять областей (через три ряда)

который может содержать графический компонент (NORTH, {WEST, CENTER, EAST}, SOUTH). Укажите эту область, используя

метод:

Установите видимость JFrame

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

быть видимым:

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

instagram story viewer