官术网_书友最值得收藏!

首頁 >

Oracle APEX Cookbook（Second Edition）

Creating a navigation bar>

The navigation bar is the area of an APEX application that is normally placed into the header of each page (unless the template is changed of course). As a standard, the Logout link is provided here, so users can quickly log out of the application from any page.

This recipe will show how a navigation bar can be customized. This will allow users to quickly reach certain pages in the application.

Getting ready

In this recipe we are going to see how you can create a quick link to a contact page. Before we can do that, we first need to have this page ready.

  1. Create a new blank page. Name it Contact and assign page ID 999 to it.
  2. Create a new HTML region on this page and enter the following text into it: 
    For more information send an e-mail to info@packtpublishing.com

    For the second part of the recipe, we need an icon available. This can be any available icon as long as it measures 32 x 32 pixels. The Images directory of APEX offers some examples such as fndtip11.gif.

  3. Go to Shared Components.
  4. Click on Images.
  5. Click on Create.
  6. Select your application.
  7. Select the image fndtip11.gif on your filesystem by using the Browse button.
  8. Click on Upload.

    Furthermore, check your page template. In the Navigation Bar Entry section you should see at least the tags for image, alt, width, and height. For example:

    <a href="#LINK#"><img src="#IMAGE#" alt="#ALT#" height="#HEIGHT#" width="#WIDTH#" />#TEXT#</a>
[9672_01_06A.txt]
  9. To check the page template, go to a page and click on the Page Template link on the right-hand side of the page (in the Templates section). Scroll down to the Subtemplate section and check the Navigation Bar Entry textarea.

How to do it...

The navigation bar can be found in Shared Components. To reach it, navigate to Shared Components | Navigation Bar Entries.

As a default, there is already a logout entry available. Our new entry will be added here:

  1. Click on the button Create.
  2. Select From Scratch and click on Next.
  3. Select Navigation to URL and click on Next.
  4. In the Entry Label, enter Contact and leave the rest on default. Click on Next.
  5. Enter 999 into Page and default the other fields. Click on Next.
  6. Click on Create.

    As you can see, a new entry is created next to the Logout entry. This means we are done and can now test it by running the application:

    Instead of a link text it is also possible to use images. This can be helpful when developing, for example, a multi language application with a short list of languages. Instead of writing the full language name, we can use small icons depicting the available language.

    In this example, we will only show you how to create a navigation bar icon and reuse our Contact page for this. Later on in the book, we will show you the details of how to create a language switch.

  7. Go to Shared Components | Navigation Bar Entries and click on the button Create.
  8. Select From Scratch and click on Next.
  9. Select Navigation to URL and click on Next.

    This time we need to enter some more information on this screen.

  10. Alter the Sequence to 15.
  11. In the Entry Label enter nothing.
  12. In Icon Image Name, click on the button to the right of the field and select the icon fndtip11.gif.
    • Alternatively, you can enter #APP_IMAGES#fndtip11.gif into the field.
  13. Enter Contact into Image ALT.
  14. Enter 32 for both Image Height and Width:
  15. Click on Next.
  16. Enter 999 into Page and default the other fields. Click on Next.
  17. Click on Create.

You will notice a new entry in the list of the navigation bar. When running the application, this will be shown with the selected icon.

There's more...

New in Application Express is the possibility to add a feedback link to the navigation bar. This will allow visitors of the application to quickly send feedback to the application developers or administrators.

  1. Create a new navigation bar entry From Scratch.
  2. Select Feedback and click on Next.
  3. In the next screen, find the Tasks section to the far right and click on Create Feedback Page:
  4. Set the page number to 102, leave everything else at default, and click on Create.
  5. The focus will be returned to the navigation bar overview, so we have to repeat the first two steps.
  6. Now select page 102 from the Feedback Page pull down list, enter 20 into the Display Sequence, and click on Create.

If you were to run the application now, no feedback link would be visible, because we have to allow the feedback option first.

So click on Edit Application Properties and find the option Allow Feedback. Set the pull down to Yes and click on Apply Changes. Now the application is ready to receive some feedback from its visitors:

See also

  • Chapter 6, Creating Multilingual APEX Applications, will cover translating your application and offering quick language switching to the visitors.
  • Chapter 12, Team Development, will show how feedback can be used to the advantage of the development team.
主站蜘蛛池模板： 永清县| 九江县| 偃师市| 合山市| 易门县| 绥中县| 咸阳市| 阳春市| 吴江市| 皮山县| 鹤峰县| 崇左市| 志丹县| 克东县| 剑河县| 宣城市| 山丹县| 上犹县| 灌南县| 平顶山市| 兴海县| 玉环县| 嘉祥县| 巩义市| 贵州省| 隆德县| 和政县| 东乌珠穆沁旗| 巩留县| 司法| 普陀区| 绍兴县| 唐河县| 平凉市| 三亚市| 连平县| 慈溪市| 滨海县| 涿鹿县| 行唐县| 炉霍县|