8.  Выполните запрос, нажав на кнопку Run. Если запрос написан корректно, во вкладке Results отобразятся записи, организованные в 2 столбца:

9.  Сохраните скорректированный запрос под именем, например, lab5_locations. Теперь Вы готовы создать список значений для расположений (LOCATIONS).

10.  Скопируйте текст запроса в буфер обмена.

11.  Создайте список значений с именем LOCATIONS, причем в поле с текстом запроса вставьте подготовленный запрос из буфера обмена:

а.  Откройте свое приложение в Application Builder для редактирования.

б.  Щелкните по иконке Shared Components.

в.  На странице Shared Components в секции Other Components щелкните по ссылке Lists of Values.

г.  На странице Lists of Values щелкните по кнопке Create>.

д.  На шаге Source выберите From Scratch. Нажмите Next>.

е.  На шаге Name and Type в поле Name введите LOCATIONS, а в Type выберите Dinamic. Нажмите Next>.

ж. На шаге Query or Static Values замените текст запроса на тот, который был скопирован в буфер обмена:

select COUNTRIES. COUNTRY_NAME ||', '||

LOCATIONS. CITY ||', '||

LOCATIONS. STREET_ADDRESS location,

LOCATIONS. LOCATION_ID as LOCATION_ID

from LOCATIONS LOCATIONS,

COUNTRIES COUNTRIES

where COUNTRIES. COUNTRY_ID=LOCATIONS. COUNTRY_ID

з.  Щелкните по кнопке Create List of Values. Созданный список значений отобразится на странице Lists of Values.

12.  Доделайте выпадающий список выбора для поля Расположение (самостоятельно, по аналогии с рассмотренной выше задачей).

НЕ нашли? Не то? Что вы ищете?

13.  Запустите страницу Создать/Редактировать Подразделение и проверьте ее работу.

2.3. Соединение страниц Подразделения и Создать/Редактировать Подразделение

1.  Добавьте в столбец с идентификатором подразделения на странице Подразделения ссылку на страницу Создать/Редактировать Подразделение аналогично тому, как это делалось для страницы Работники в лабораторной работе 2. При этом вместо идентификатора подразделения должна отображаться иконка; в названии столбца должно отображаться Изменить; при переходе по ссылке на странице Создать/Редактировать Подразделение должно отображаться редактируемое подразделение. Для этого:

а.  На странице определения страницы Подразделения в секции Regions щелкните по ссылке Подразделения. Откроется новое окно, в котором выберите опцию Report Attributes.

б.  В секции Column Attributes у атрибута Department_Id щелкните по иконке слева. Откроется страница редактирования атрибута-столбца.

в.  В секции Column Link:

· В поле Link Text установите текст, представляющий собой html-тэг для отображения необходимой иконки (щелкните по ссылке [Icon 5]);

· В поле Page из выпадающего списка выберите страницу Создать/Редактировать Подразделение. Соответствующий номер страницы автоматически установится в поле;

· В списке параметров ссылки для параметра Item 1 установите следующие значения: в поле Name – P?_DEPARTMENT_ID (напомним, что? – конкретный номер страницы в приложении), в поле Value 1 - #DEPARTMENT ID#.

г.  Щелкните по кнопке Apply Changes в верхней части страницы. Вы вернетесь на страницу Report Attributes.

д.  Запустите приложение Подразделения и проверьте результаты:

Безымянный.bmp

2.  Добавьте на странице Подразделения кнопку Создать для создания нового подразделения. Для этого:

а.  Зайдите в режим редактирования страницы Подразделения.

б.  В секции Page Rendering в опции Buttons щелкните по кнопке Create. Откроется страница создания кнопки Create Button.

в.  На шаге Button Region выберите значение Подразделения. Нажмите Next>.

г.  На шаге Button Position в окне Position выберите опцию Create a button in a region position. Нажмите Next>.

д.  На шаге Button Attributes в поле Button Name введите – Create, а в поле Label – Создать. Нажмите Next>.

е.  На шаге Display Properties в поле Position выберете значение Region Template Position #Create#. Нажмите Next>.

ж. На шаге Action When Clicked в поле Action выберите значение Redirect to Page in this Application.

Затем в поле Page установите нужную страницу для перехода – Создать/Редактировать Подразделение, а в поле Clear Cache установите номер страницы Создать/Редактировать Подразделение в Вашем приложении. Этот позволит при переходе по ссылке на страницу Создать/Редактировать Подразделение отображать незаполненные поля и кнопки Отменить и Создать (при переходе все элементы этой страницы примут значения Null). Нажмите Next>.

и. В следующем окне ничего не меняйте и нажмите Create Button.

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

Задание к работе:

1.  В своем приложении на странице, соответствующей подчиненной сущности (в примере - Работники), добавьте отчет (область), отображающую детали описания родительской сущности (в примере - Подразделения).

2.  Создать страницу для создания/редактирования страницы с условно-постоянной информацией.

3.  Добавить в страницу с условно-постоянной информацией ссылку для перехода в режим редактирования, а также кнопку Создать для создания нового экземпляра сущности.

4.  Покажите результат преподавателю.

Лабораторная работа № 6. Доработка пользовательского интерфейса

Цель работы – изучение технологии доработки интерфейса пользователя.

Задачи:

1)  Доработать пользовательский интерфейс: добавить название приложения на отображаемые страницы, изменить тему, дооформить главную страницу.

2)  Изучить основные этапы развертывания приложения. Экспортировать приложение в виде текстового файла. Создать учетную запись для конечного пользователя приложения. Научиться определять URL приложения.

1.  Доработка пользовательского интерфейса

1.1. Добавление названия приложения

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

1.  Добавьте название приложения на каждую страницу. Для этого:

а.  В Shared Components щелкните по User Interface Attributes в секции User Interface.

б.  В секции Logo выберите в Logo Type – Text, в поле Logo впишите название приложения (например, «Учебная задача»), в Logo Attributes выберите Black Text.

Обратите внимание, что после выбора в Logo Attributes появилась строка, представляющая собой фрагмент HTML кода, задающего стиль отображаемого текста:

Вы можете редактировать эту строку, устанавливая собственные значения атрибутов (фонт, цвет текста, размер шрифта, начертание и т. д.).

в.  Примените изменения.

2.  Запустите приложение. Обратите внимание на левый верхний угол, в котором теперь отображается текст, введенный на предыдущем шаге. Этот текст отображается на каждой странице приложения:

1.2. Изменение темы пользовательского интерфейса

Тема (theme) – это коллекция шаблонов, которые определяют визуальное представление пользовательского интерфейса. Каждая тема содержит шаблоны для каждого компонента и элемента управления, включая страницы (pages), области (regions), отчеты (reports), списки (lists), ярлыки (labels), меню (menus), кнопки (buttons) и списки значений (list of values).

В Oracle APEX прикладная логика (application logic) отделена от представления (presentation). Вы можете разрабатывать приложение в одной теме, затем заменить ее другой предустановленной темой либо создать и использовать свою собственную тему. Такое отделение прикладной логики (запросов, процессов, переходов и т. д.) от HTML-визуализации (rendering) позволяет изменять внешний вид приложения, не изменяя его код.

1.  Измените тему своего приложения. Для этого:

а.  В Shared Components щелкните по Themes в секции User Interface. Откроется страница с темами приложения.

б.  На странице с темами запустите мастера создания темы (щелкнув по кнопке Create>).

в.  На шаге Method выберите From the Repository (т. к. мы хотим выбрать уже готовую тему из репозитория APEX).

г.  На шаге User Interface оставьте значение по умолчанию – Desktop.

д.  На шаге Identify Theme выберите понравившуюся Вам тему (например, Cloudy (Theme24)).

е.  На шаге Confirm подтвердите свой выбор, щелкнув по кнопке Create. Новая тема отобразится на странице с темами Вашего приложения:

ж. Щелкните по кнопке Switch Theme (справа вверху).

з.  На шаге Identify Theme выберите добавленную ранее тему. Для этого в опции Currently Active Theme выберите активную тему, а в опции Switch to Theme – выберите созданную тему.

и.  На шаге Verify Compatibility просмотрите информацию, оставьте все как есть.

Из за большого объема этот материал размещен на нескольких страницах:
1 2 3 4 5 6 7 8 9 10 11