Подробный, пошаговый пример создания простого плагина в Apex 4.0.
- Создать новое Database-приложение:
- Выбрать тип создаваемого приложения From Scratch:
- Вводим имя приложения (например: SimpleGoogleMapPlugin):
- Добавляем страницу в приложение:
- Создаём приложение:
- Перейти в Shared Components\User Interface\Plug-ins и нажать Create:
- Ввести имя плагина (например: Simple Google Map), внутреннее имя (например: com.yourcompany.apex.simple_google_map) и тип плагина (в нашем случае - Region). После этого нажать Create:
- Создать аттрибут:
- Ввести следующие значения:
Scope: Application
Attribute: 1
Label: API Key
Type: Text
Required: Yes
Translatable: No
Display Length: 90
Max Length: 120
Default Value: Get key at http://code.google.com/apis/maps
- Нажать Create and Create Another.
- Аналогичным образом создать ещё 4 аттрибута:
- Scope: Component
Attribute: 1
Label: Width
Type: Integer
Required: Yes
Display Width: 4
Maximum Width: 4
Default Value: 600 - Scope: Component
Attribute: 2
Label: Height
Type: Integer
Required: Yes
Display Length: 4
Max Length: 4
Default Value: 400 - Scope: Component
Attribute: 3
Prompt: Page Item containing Location
Type: Page Item
Required: Yes
Default Value: P1_LOCATION - Scope: Component
Attribute: 4
Prompt: Page Item containing Tooltip
Type: Page Item
Required: No
- Scope: Component
- Перейти на вкладку Source и ввести в поле PL/SQL Code следующее:
procedure render_simple_google_map ( p_region in apex_plugin.t_region, p_plugin in apex_plugin.t_plugin, p_is_printer_friendly in boolean ) is -- It's better to have named variables instead of using the generic ones, -- makes the code more readable l_api_key apex_appl_plugins.attribute_01%type := p_plugin.attribute_01; l_width apex_application_page_regions.attribute_01%type := p_region.attribute_01; l_height apex_application_page_regions.attribute_02%type := p_region.attribute_02; l_location apex_application_page_regions.attribute_03%type := v(p_region.attribute_03); l_tooltip apex_application_page_regions.attribute_04%type := v(p_region.attribute_04); begin -- During plug-in development it's very helpful to have some debug information if wwv_flow.g_debug then apex_plugin.debug_region ( p_plugin => p_plugin, p_region => p_region, p_is_printer_friendly => p_is_printer_friendly ); end if; -- *********************************** -- Here starts the actual plug-in code -- *********************************** apex_javascript.add_library ( p_name => 'maps?file=api&v=2&key='||l_api_key, p_directory => 'http://maps.google.com/', p_version => null, p_skip_extension => true ); -- Output the placeholder for the Google Map which is used by the Javascript code sys.htp.p('<div id="'||p_region.static_id||'_map" style="width:'||l_width||'px; height:'||l_height||'px"></div>'); -- Initialize the Google map with location stored in the specified location page item. -- The Javascript code is executed when the page has been rendered in the browser. -- apex_javascript.escape are used to make sure that the values are properly escaped, -- otherwise a " in the concatenated strings would break our Javascript code. apex_javascript.add_onload_code ( p_code => ' if (GBrowserIsCompatible()) { var lBounds = new GLatLngBounds(); var lMap = new GMap2($x("'||p_region.static_id||'_map")); lMap.addControl(new GSmallMapControl()); lMap.addControl(new GMapTypeControl()); var lPoint = new GLatLng('||apex_javascript.escape(l_location)||'); lBounds.extend(lPoint); lMap.setCenter(lPoint); lMap.setZoom(lMap.getBoundsZoomLevel(lBounds)-4);'|| case when l_tooltip is not null then ' var lTitle = "'||apex_javascript.escape(l_tooltip)||'"; var lMarker = new GMarker(lPoint); lMap.addOverlay(lMarker); lMarker.openInfoWindowHtml("<div class=\"tiny\">" + lTitle.replace(/~/g,"<br />") + "</div>");' end|| '}' ); end render_simple_google_map;
- Переходим в закладку "Callbacks" и в поле "Render Function Name" вводим "render_simple_google_map":
- Переходим в закладку "Settings". Заходим на http://code.google.com/apis/maps/signup.htm и запрашиваем API Key. Его значение вводим в поле API Key:
- Создаём новый регион:
- Выбирает тип региона - Plug-Ins:
- Выбираем доступный плагин:
- Вводим наименование региона (в нашем случае - Maps):
- Вводим значения аттрибутов (Width=600,Height=400,P1_LOCATION,P1_TOOLTIP):
- Создаём регион:
- Создаём новый элемент:
- Выбираем тип элемента - Text:
- Оставляем по-умолчанию:
- Вводим наименование элемента - P1_LOCATION:
- Вводим наименование поля на странице:
- Завершаем создание элемента. Аналогично создаем элемент P1_TOOLTIP.
- Создаем кнопку:
- Завершаем создание кнопки:
- Запускаем страницу:
