Пользовательский интерфейс. GUI с применением AWT Создание элементов пользовательского интерфейса библиотека AWT (Аbstract Window Toolkit) поручала встроенным. - презентация

1 Пользовательский интерфейс

2 GUI с применением AWT Создание элементов пользовательского интерфейса библиотека AWT (Аbstract Window Toolkit) поручала встроенным инструментальным средствам. Если нужно вывести окно с текстом, то фактически оно отображалось с помощью платформенно- ориентированных средств. Теоретически такие программы должны работать на любых платформах, имея внешний вид характерный для платформы. Однако с помощью AWT трудно создавать переносимые графические библиотеки, зависящие от родных интерфейсных элементов платформы (например, меню и скроллинг на разных платформах могут вести себя по-разному).

3 GUI с применением AWT Абстрактный Оконный Инструментарий Java 1.0 вводил GUI, который выглядел достаточно заурядно на всех платформах. Кроме того, он был ограничен: можно было использовать только четыре шрифта и было невозможно получить доступ к любому более сложному и тонкому GUI элементу, имеющемуся в ОС. Модель программирования Java 1.0 AWT также была слабая и не объектно- ориентированная.

4 GUI с применением Swing В 1996 году Netscape создала библиотеку программ для создания GUI и назвала ее IFC. Элементы пользовательского интерфейса рисовались в пустом окне. Единственно, что требовалось от оконной системы платформы, - отображение окна и рисование в нем. Таким образом, элементы GUI выглядели и вели себя одинаково, но не зависели от платформы, на которой запускались. Компании Sun и Netscape объединили свои усилия и создали библиотеку Swing.

5 GUI с применением Swing Преимущества Swing: Содержит более богатый и удобный набор элементов пользовательского интерфейса Библиотека намного меньше зависит от платформы (меньше ошибок) Обеспечивает пользователям однотипные средства для работы на разных платформах

6 Фрейм Фрейм (frame) – окно верхнего уровня, не содержащееся внутри другого окна. Фрейм – подкласс контейнера, а значит он может содержать другие компоненты пользовательского интерфейса. В библиотеке AWT для такого окна предусмотрен класс Frame, а для Swing – JFrame. Object Component Container Window Frame JFrame JComponent JPanel

7 Пример создания фрейма import javax.swing.*; public class t1 { public static void main(String[] args){ simple frame=new simple(); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); // frame.show();//делает фрейм видимым и поверх всех окон frame.setVisible(true); //делает фрейм видимым } } class simple extends JFrame{ public simple(){ setSize(200,300);} } Так как фрейм унаследован от Component, то в нем наследуются следующие методы: setLocation(x, y) – задание положения фрейма; setBounds(x, y, width, height) – задание положения и размера.

8 Свойства фрейма в зависимости от настроек экрана import javax.swing.*; import java.awt.*; public class t2 { public static void main(String[] args){ simple1 frame=new simple1(); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frame.show();} } class simple1 extends JFrame{ public simple1(){ //класс взаимодействия с оконной системой ОС Toolkit kit = Toolkit.getDefaultToolkit(); Dimension screens = kit.getScreenSize(); int w,h; w = screens.width; h = screens.height; setSize(w/2,h/2); setLocation(w/4, h/4); setTitle("My Frame");}}

9 Состав фрейма Фрейм является многослойным и состоит из: Корневой области Области слоя Строки меню Области содержимого Прозрачной области Container cp; cp = frame.getContentPane(); Component c=new … cp.add(c);

10 Многооконные приложения Приложение как правило не может ограничиться одним окном и нужно решить вопрос управления окнами. Есть две различные модели приложений: с интерфейсом одного документа (SDI) и с интерфейсом множества документов (MDI). В большинстве случаев нужно выбирать интерфейс SDI. Этот интерфейс предполагает, что в нужные моменты создаются и вызываются вторичные окна для решения возникающих по ходу выполнения приложения задач. В приложениях MDI имеется родительское (первичное) окно и ряд дочерних окон (пример: Wоrd,Photoshop). Когда выгодно отображать информацию в нескольких окнах, которые совместно используют элементы интерфейса (например, меню). Окна документов управляются и ограничиваются родительским окном. Если размер родительского окна уменьшается, то дочерние окна могут исчезать из поля зрения.

11 Многооконные приложения Использовать модель MDI нужно только тогда, когда все дочерние окна будут содержать идентичные объекты. Не нужно использовать модель MDI, если: дочерние окна разного типа (текстовые документы и таблицы); для дочернего документа используется свойство «Всегда наверху»; нужно управлять размерами дочерних окон; делать дочерние окна невидимыми и т.п.

12 Многооконные приложения MDI import javax.swing.*; public class SimpleMDI extends JFrame { public SimpleMDI() { super("SimpleMDI"); setSize(400, 300); setDefaultCloseOperation(EXIT_ON_CLOSE); JDesktopPane desktopPane = new JDesktopPane(); // создаем рабочий стол Swing add(desktopPane); // добавляем его в центр окна // создаем несколько внутренних окон, применяя доступные конструкторы JInternalFrame frame1 = new JInternalFrame("Frame1", true); JInternalFrame frame2 = new JInternalFrame("Frame2", true, true, true, true); desktopPane.add(frame1); // добавляем внутренние окна на рабочий стол desktopPane.add(frame2); // задаем размеры и расположения, делаем окна видимыми frame1.setSize(200, 100); frame1.setLocation(80, 100); frame1.setVisible(true); frame2.setSize(200, 60); frame2.setVisible(true); // выводим окно на экран setVisible(true); } public static void main(String[] args) { new SimpleMDI(); }} Многооконные приложения MDI

13 MDI

14 Многооконные приложения SDI

15 Управление компоновкой В языке Java реализована концепция динамической компоновки - все компоненты контейнера управляются менеджером компоновки (layout manager). Существуют следующие виды менеджеров компоновки – потоковая компоновка (flow layout maanger), компоновка рамок (border layout), сеточная компоновка (grid layout) и др. Для установки компоненту менеджера компоновки используется метод setLayout(LayoutManager m).

16 Потоковая компоновка FlowLayout Размещает компоненты горизонтально, пока хватает места в окне, а затем начинает новую строку. Если пользователь изменил размеры контейнера, менеджер компоновки автоматически изменяет положение компонентов. По умолчанию, компоненты размещаются симметрично (CENTER), но их можно выровнять по левому (LEFT) или правому (RIGHT) краям. Конструкторы: FlowLayout(); FlowLayout(int align); FlowLayout(int align, int hgap, int vgap);

17 Потоковая компоновка FlowLayout Компоновка по умолчаниюДобавление 3 кнопок Изменение размера окна Выравнивание по правому краю setLayout(new FlowLayout(FlowLayout.LEFT));

18 Компоновка рамок BorderLayout Позволяет выбрать место для каждого компонента. Компонент можно разместить внутри панели, в центре, наверху, внизу, слева и справа (CENTER, NORTH, SOUTH, EATH, WEST). При изменении размеров контейнера толщина контуров компонентов остается постоянной, однако размер внутренней части меняется. setLayout(new BorderLayout()); add(yellowButton, BorderLayout.SOUTH);

19 Компоновка рамок BorderLayout Видна последняя добавленная кнопка, т.к. не было указано расположение кнопок Было указано SOUTH, NORTH, WEST. Кнопка Grey заняла все оставшееся место и накрыла кнопки. Изменение размеров окна

20 Сеточная компоновка GridLayout Расставляет все компоненты по строкам и столбцам. Но размер всех ячеек одинаков. setLayout(new GridLayout(5,4)) – указывает желаемое количество строк (5) и столбцов (4). setLayout(new GridLayout(5,4,3,3)) – указывает желаемое количество строк (5) и столбцов (4) и расстояние между компонентами по горизонтали (3) и вертикали (3). На данном примере приведена смешанная компоновка – кнопки и поле ввода располагаются на разных панелях, для которых применяется BorderLayout. Для кнопок внутри панели – GridLayout.

21 Ввод текста – поля и области Классы JTextField и JTextArea позволяют вводить в них значения. Метод setText(…) – устанавливает текст в поле, getText() – считывает. JTextField text=new JTextField("Message length 20 symbol",20); add(text);

22 События JTextField Для обработки событий, возникающих в компоненте, служит интерфейс DocumentListener, содержащий три метода: public void insertUpdate(DocumentEvent e) – вставка символа. public void removeUpdate(DocumentEvent e) – удаление символа. public void changedUpdate(DocumentEvent e) – вызывается при форматировании сложных документов. Для регистрации слушателя используется следующая команда: Также существуют поля для ввода пароля – JPasswordField, для форматированного ввода – JFormattedTextField. textField.getDocument().addDocumentListener(listener)

23 Текстовые области JTextArea Для ввода в программу нескольких строк используются текстовые области.Интерфейс событий совпадает с интерфейсом класса JTextField. Для отображения большого количества информации добавляется панель прокрутки JTextArea text=new JTextArea(8,20); JScrollPane scrollPane = new JScrollPane(text); add(scrollPane,BorderLayout.CENTER);

24 Выбор вариантов. JCheckBox Флажок опции, когда нужно ввести просто вариант да/нет. Для установки флажка используется мышь либо клавиша пробела, когда флажок в фокусе. Для установки и снятия флажка используется метод setSelected(true). Метод isSelected() определяет текущее состояние каждого флажка. JCheckBox c1=new JCheckBox("Bold"); JCheckBox c2=new JCheckBox("Italyc"); add(c1); add(c2);

25 События JCheckBox Щелкая на флажке, пользователь выбирает события, связанные с действиями. Для обработки событий используется интерфейс ActionListener с методом actionPerformed(). ActionListener list = …; c1.addActionListener(list); public void actionPerformed(ActionEvent e){ int mode=0; if (c1.isSelected()) mode+=Font.BOLD; if (c2.isSelected()) mode+=Font.ITALIC; }

26 Группа переключателей Во многих ситуациях пользователь должен принять единственное решение, выбрав только один из предложенных флажков (radio button group). ButtonGroup group = new ButtonGroup(); JRadioButton small=new JRadioButton("Small",false); group.add(small); add(small); JRadioButton medium=new JRadioButton("Medium",false); group.add(medium); add(medium); JRadioButton large=new JRadioButton("Large",true); group.add(large); add(large);

27 Описание пакета Пакет предоставляет набор классов и интерфейсов для работы с javax.swing.JTable. JTable – сетка или таблица для отображения (не хранения!) данных внутри приложения в виде двумерного массива. Пакет содержит 4 интерфейса и 7 классов для работы с JTable. Рассмотрим интерфейс TableModel и абстрактный класс AbstractTableModel.

28 Интерфейс TableModel Определяет набор методов, которые опрашивают табличную модель данных при построении таблиц. Табличная модель данных используется как каркас для построения таблиц с заданными свойствами. Пример создания таблицы: TableModel myData = new MyTableModel(); JTable table = new JTable(myData);

29 Некоторые методы TableModel public int getRowCount() – возвращает количество строк в табличной модели. public int getColumnCount() – возвращает количество столбцов в табличной модели. public String getColumnName(int columnIndex) – возвращает название столбца в модели.String public Object getValueAt(int rowIndex, int columnIndex) – возвращает значение в ячейке с номером ( rowIndex, columnIndex)Object public void setValueAt(Object aValue, int rowIndex, int columnIndex) – устанавливает значение aValue в ячейку с номером ( rowIndex, columnIndex)Object

30 Класс AbstractTableModel Описание: public abstract class AbstractTableModel extends Object implements TableModel, SerializableObject TableModelSerializable Обеспечивает встроенную (по умолчанию) реализацию большинства методов интерфейса TableModel TableModel Для создания табличной модели данных необходимо наследовать подкласс от этого класса и обязательно реализовать методы: getRowCount(), getColumnCount() и getValueAt(int rowIndex, int columnIndex)

31 Пример создания таблицы размером 10 на 10 TableModel dataModel = new AbstractTableModel() { public int getColumnCount() { return 10; } public int getRowCount() { return 10;} public Object getValueAt(int row, int col) { return new Integer(row*col); } }; JTable table = new JTable(dataModel); JScrollPane scrollpane = new JScrollPane(table);

32 Конструкторы класса JTable public JTable() – создание таблицы по умолчанию, со столбцами и строками по умолчанию.JTable public JTable(TableModel dm) – столбцы и строки таблицы инициализируются моделью данных dmTableModel public JTable(int numRows, int numColumns) – создание пустой таблицы размером (numRows,numColumns), используя DefaultTableModel. Название столбцов – A, B, C… public JTable(Vector rowData, Vector columnNames) – создает таблицу и показывает в ней данные из rowdata, которые есть Vector of Vectors. Название столбцов – вектор columnNames. ((Vector)rowData.elementAt(1)).elementAt(5); - доступ к элементу (1,5)Vector

33 Благодарю за внимание! Вопросы?