Обработка изображений в приложении с графическим интерфейсом

Содержание

Содержимое на этой странице применимо к IDE NetBeans 6.9 или более поздней версии

Для работы с этим учебным курсом требуются программное обеспечение и ресурсы, перечисленные ниже.

Программное обеспечение или материал Требуемая версия
IDE NetBeans Версия 6.9 или более поздняя
Комплект для разработчика на языке Java (JDK) Версия 6 или 7

Введение

Для многих начинающих программистов на Java проблемой является обработка изображений в приложении. Обычный способ доступа к изображениям в приложении на Java состоит в применении метода getResource(). В данном учебном курсе описывается использование конструктора графических интерфейсов среды IDE для создания кода с добавлением изображений (и других ресурсов) в приложение. Кроме того, пользователь научится настраивать способы создания средой IDE кода для обработки изображений.

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

Создание приложения

  1. Выберите команду "Файл" > "Новый проект".
  2. В мастере создания проекта выберите "Java" > "Приложение Java", затем нажмите кнопку "Дальше".
  3. В качестве имени проекта введите ImageDisplayApp.
  4. Снимите флажок "Создать главный класс".
  5. Проверьте, что установлен флажок "Установить как главный проект".
    Мастер создания проектов
  6. Нажмите кнопку "Завершить".

Создание формы приложения

В примере в этом разделе будет создана форма JFrame, и в нее добавлена метка JLabel.

Создание формы JFrame:

  1. В окне 'Проекты' разверните узел ImageDisplayApp.
  2. Щелкните правой кнопкой узел "Исходные файлы" и выберите форму "Создать" > "JFrame".
  3. В качестве имени класса введите ImageDisplay.
  4. В качестве имени пакета введите org.me.myimageapp.
  5. Нажмите кнопку "Завершить".

Добавление надписи:

  • В разделе "Палитра" выберите компонент "Метка" и перетащите его в форму.

Форма должна принять следующий вид:

Созданная форма с добавленной меткой

Добавление пакета для изображения

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

Создание пакета для изображения:

  1. В окне 'Проекты' щелкните правой кнопкой мыши узел org.me.myimageapp и выберите 'Создать' > 'Пакет Java'.
     Добавление нового пакета Java
  2. В мастере создания проекта к имени org.me.myimageapp добавьте .resources; новый пакет получит имя org.me.myimageapp.resources.
  3. Нажмите кнопку "Завершить".

В окне 'Проекты' изображение отображается в пакете org.me.myimageapp.resources.

Окно проектов

Вывод изображения в качестве метки

В этом приложении изображение будет встроено в компонент JLabel.

Добавление изображения к метке:

  1. В редакторе GUI Designer выберите метку, добавленную ранее в форму.
  2. В окне "Свойства" щелкните категорию "Свойства" и выполните прокрутку до свойства "Значок".
  3. Нажмите кнопку со многоточием (...).
  4. В диалоговом окне свойств значка щелкните Import to Project ("Импорт в проект").
    значок редактора свойств
  5. В окне выбора файлов выберите любое сохраненное в компьютере изображение. Затем нажмите кнопку "Дальше".
  6. На странице "Выбор целевой папки" в мастере выберите папку resources и нажмите кнопку "Дальше".
    Выберите страницу 'Целевая папка' мастера импорта изображений в проекты

При нажатии кнопки "Дальше" в среде IDE будут выполнены следующие операции:

  • Копирование изображения в проект. В результате при выполнении сборки и распространения приложения это изображение добавляется в распространяемый архив JAR.
  • Создание кода, реализующего доступ к изображению, в классе "ImageDisplay".
  • Отображение изображения в качестве метки в режиме разработки формы.

Теперь можно выполнить несколько действий по оптимизации вида формы, например:

  • В окне "Свойства" выберите свойство text и удалите метку jLabel1. Это значение было создано конструктором графического интерфейса в качестве отображаемого текста метки. В данном же случае в качестве метки отображается изображение, а не текст, поэтому вводить текст не требуется.
  • Перетащите кнопку в центр формы.
Снимок представления конструирования класса ImageDisplay с отцентрированным изображением.

Просмотр созданного кода:

  1. В GUI Designer перейдите на вкладку "Исходный код".
  2. Прокрутите вниз до строки "Созданный код".
  3. Щелкните значок (+) слева от строки "Созданный код" для просмотра кода, созданного GUI Designer.

Основная строка выглядит следующим образом:

jLabel1.setIcon(new javax.swing.ImageIcon(getClass().getResource("/org/me/myimageapp/resources/park-sculpture.jpg"))); // NOI18N

Свойство Icon элемента jLabel1 было изменено в редакторе свойств, поэтому средой IDE был создан метод setIcon. В параметре этого метода содержится вызов метода getResource() анонимного внутреннего класса в ImageIcon. Обратите внимание на то, что созданный путь к изображению связан с его местоположением в структуре пакетов приложения.

Примечания

  • Если в редакторе свойств значка установить параметр "Внешнее изображение", то средой IDE будет создан абсолютный путь к изображению, т.е. само изображение не будет скопировано в проект. Как следствие, при запуске приложения на этом же компьютере изображение появится, а при запуске на другом компьютере -- скорее всего, нет.
  • Метод getResource также используется для доступа к другим ресурсам, таким как текстовые файлы с какими-либо данными, используемыми в приложении.

Чтобы зарегистрировать обработчики для событий мыши на Jlabel:

Щелкните JLabel правой кнопкой мыши и выберите Events ("События") > Mouse ("Мышь") > mouseClicked/mousePressed/mouseReleased из всплывающего меню.
Будет создан обработчик для соответствующего события.

Примечание. Можно получить координаты мыши (например, местоположение щелчка мыши) в обработчике событий с помощью методов event.getPoint(), event.getX() и event.getY(). Подробности приведены в разделе Класс MouseEvent.

Показ изображения как фона в кадре

Конструктор графического интерфейса не поддерживает напрямую использование JFrame как фонового изображения, поскольку такой поддержки нет в Swing.
Тем не менее, этой цели можно достигнуть различными непрямыми путями. В этом приложении JLabel с изображением будет внедрен в компонент JFrame, тогда как JPanel будет размещен над JLabel и использован как родительский элемент для всех компонентов.

Добавление прозрачного компонента JPanel к JFrame внутри изображения:

  1. Выберите команду "Файл" > "Новый проект".
  2. В мастере создания проекта выберите "Java" > "Приложение Java", затем нажмите кнопку "Дальше".
  3. В качестве имени проекта введите BackgroundImageApp.
  4. Снимите флажок "Создать главный класс".
  5. Проверьте, что установлен флажок "Установить как главный проект".
  6. В окне 'Проекты' разверните узел BackgroundImageApp.
  7. Щелкните правой кнопкой узел "Исходные файлы" и выберите форму "Создать" > "JFrame".
  8. В качестве имени класса введите ImageDisplay.
  9. В качестве имени пакета введите org.me.mybackgroundapp.
  10. Нажмите кнопку "Завершить".
  11. В представление 'Конструирование' щелкните правой кнопкой мыши JFrame и выберите 'Настроить макет' > 'Макет GridBag' во всплывающем меню.
  12. Щелкните правой кнопкой мыши JFrame и выберите Add From Pallette ("Добавить из палитры") > Swing Containers ("Контейнеры Swing") > Panel ("Панель") из всплывающего меню.
  13. В окне свойств отмените выбор свойства jPanel opaque.
  14. Щелкните правой кнопкой мыши JFrame и выберите Add From Pallette ("Добавить из палитры") > Swing Controls ("Элементы управления Swing") > Label ("Метка") из всплывающего меню.
  15. В окне 'Проекты' щелкните правой кнопкой мыши узел org.me.mybackgroundapp и выберите 'Создать' > 'Пакет Java'.
  16. В мастере создания пакетов к имени org.me.mybackgroundapp добавьте .resources; новый пакет получит имя org.me.mybackgroundapp.resources.
  17. Нажмите кнопку "Завершить".
  18. В редакторе GUI Designer выберите метку, добавленную ранее в форму.
  19. В окне "Свойства" щелкните категорию "Свойства" и выполните прокрутку до свойства "Значок".
  20. Нажмите кнопку со многоточием (...).
  21. В диалоговом окне свойств значка щелкните Import to Project ("Импорт в проект").
  22. В окне выбора файлов выберите любое сохраненное в компьютере изображение. Затем нажмите кнопку "Дальше".
  23. На странице Select Target Folder ("Выбор целевой папки") в мастере выберите папку resources и нажмите кнопку Finish ("Готово").
  24. В навигаторе щелкните правой кнопкой мыши jPanel и выберите 'Свойства' во всплывающем меню.
  25. В диалоговом окне Properties ("Свойства") установите свойства Grid X, Grid Y, Weight X и Weight Y на 1, а свойство Fill на Both. Выберите "Close" (Закрыть).
  26. Повторите действия 24 и 25 для jLabel.
    Теперь фон готов. Теперь можно, например, перетащить jLabel и jTextField в jPanel из Palette. Оба они будут отображены поверх фонового изображения.
    Снимок представления конструирования класса Background.

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

Сборка и запуск приложения

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

Сначала необходимо указать главный класс проекта. При назначении главного класса среда IDE получает информацию о том, какой класс следует запускать при запуске проекта. Кроме того, таким образом обеспечивается создание элемента Main-Class в архиве JAR приложения при его сборке.

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

  1. Правой кнопкой щелкните узел "ImageDisplayApp" проекта и выберите "Свойства".
  2. В диалоговом окне "Свойства проекта" выберите категорию "Выполнение".
  3. Нажмите кнопку "Обзор" рядом с полем "Главный класс". Выберите класс org.me.myimageapp.ImageDisplay и нажмите кнопку "Выбрать главный класс".

Для сборки проекта:

  • Выберите Run ("Запустить") > Clean & Build Main Project ("Очистка и сборка главного проекта").

В окне "Файлы" отображаются объекты, созданные при сборке приложения. Скомпилированный класс находится в папке build. В папке dist находится исполняемый архив JAR, содержащий скомпилированный класс и изображение.

Снимок окна 'Файлы' с развернутой папкой dist и отображением скомпилированного класса и файла изображения.

Для запуска проекта выполните следующие действия:

  • Выберите "Выполнение" > "Выполнить главный проект" (F6).

Создание пользовательского кода

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

Если требуется предоставить возможность выбора изображения в исходном коде, то можно написать пользовательский код для вызова и отображения необходимых ресурсов. В среде IDE не предусмотрена возможность добавления кода в "защищенные блоки", содержащие созданный GUI Builder код, в режиме просмотра исходного кода. Однако существует возможность вставки кода в защищенные блоки с помощью редакторов свойств, которые можно вызвать в окне "Свойства". Если использовать в этих целях редакторы свойств, то пользовательский код не будет потерян при внесении изменений в GUI Builder.

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

  1. Выберите "JLabel" в режиме разработки или в окне "Инспектор".
  2. В окне "Свойства" нажмите кнопку в виде эллипса (...) рядом со свойством "Значок".
  3. В раскрывающемся списке в верхней области диалогового окна выберите параметр "Пользовательский код".
Редактор свойств значков с выбранным параметром 'Пользовательский код' в раскрывающемся списке, но при этом представления средства выбора изображения все еще отображается.

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

Редактор свойств значков с выбранным параметром 'Пользовательский код' в раскрывающемся списке и текстовой областью, в которой можно ввести параметр setIcon.

Заключение

В этом руководстве описывается получение доступа к изображениям из приложения, созданного в IDE NetBeans. Более подробно работа с изображениями рассматривается в учебном курсе по Java.

Примечание. Пример в этом учебном курсе очень схож с первым примером в разделе учебного курса по Java Использование раздела значков. Отличие заключается в том, что в коде, создаваемом при работе по этому учебному курсу, для вставки изображения в надпись используется метод setIcon элемента JLabel. В примере, приведенном в учебном курсе по Java, в значок добавляется в метку путем его передачи через конструктор.


Дополнительные сведения

get support for the NetBeans

Support


By use of this website, you agree to the NetBeans Policies and Terms of Use. © 2018, Oracle Corporation and/or its affiliates. Sponsored by Oracle logo