SECTION 01 struts-menu 簡介
目前版本 1.3, 由此下載 binary/source 文件
在網(wǎng)頁開發(fā)的時(shí)候,我們常常需要用到一些選單(選 擇菜單), 可能是下拉選單, 可能是標(biāo)簽式選單, 可能是樹狀選單, struts-menu, 幫我們實(shí)現(xiàn)了一些常用的選單, 可以 節(jié)省我們開發(fā)的的時(shí)間, 目前提供的有以下幾種.
SimpleMenuDisplayer
DropDownMenuDisplayer
CoolMenuDisplayer
CoolMenuDisplayer4
ListMenuDisplayer
TabbedMenuDisplayer
讓我們先來安裝 struts-menu 的范例, 你可以在解壓縮的目錄中找到一個(gè) struts-menu.war 的文件, 將他放到 %TOMCAT_HOME%/webapps/ 之下, 接著使用 http://localhost:8080/struts-menu/ 就可以看到了.
SECTION 02 struts-menu 的安裝
將 /lib/struts-menu.jar 放到 WEB-INF/lib/ 之下
將 /lib/struts-menu.tld 放到 WEB-INF/lib/ 之下
修改 web.xml 加入 taglib 的調(diào)用
你的 jsp 程序需要加入.
修改你的 WEB-INF/struts-config.xml, 在最后加入 plugin
建立 /WEB-INF/menu-config.xml 作為 Menu 的配置文件, 以下 是范例文件
<?xml version="1.0" encoding="UTF-8" ?><MenuConfig>
<Displayers>
<Displayer name="DropDown"
type="com.fgm.web.menu.displayer.DropDownMenuDisplayer"/>
<Displayer name="Simple"
type="com.fgm.web.menu.displayer.SimpleMenuDisplayer"/>
<Displayer name="CoolMenu"
type="com.fgm.web.menu.displayer.CoolMenuDisplayer"/>
<Displayer name="CoolMenu4"
type="com.fgm.web.menu.displayer.CoolMenuDisplayer4"/>
<Displayer name="MenuForm"
type="com.fgm.web.menu.example.PermissionsFormMenuDisplayer
"/>
<Displayer name="ListMenu"
type="com.fgm.web.menu.displayer.ListMenuDisplayer"/>
<Displayer name="TabbedMenu"
type="com.fgm.web.menu.displayer.TabbedMenuDisplayer"/>
</Displayers>
<Menus>
<Menu name="indexMenu" title="Examples">
<Item name="indexMenu1" title="Basic Example"
toolTip="Shows usage of the menu displayers using defaults."
page="/menutest1.jsp"/>
<Item name="indexMenu2" title="Advanced Example"
toolTip="Shows customized menu displays."
page="/menutest2.jsp"/>
<Item name="indexMenu3" title="CoolMenu Example"
toolTip="Shows menu using CoolMenu3"
page="/coolmenu1.jsp"/>
<Item name="indexMenu4" title="CoolMenu Example - With Form"
toolTip="Shows menu using CoolMenu3 with forms."
page="/coolmenu2.jsp"/>
<Item name="indexMenu5" title="Permissions Example"
toolTip="Example use of menu disable and permission checking with CoolMenus."
page="/permissionsForm.jsp"/>
<Item name="indexMenu6" title="CoolMenu4 Example"
toolTip="Shows menu using CoolMenu4"
page="/coolmenu4.jsp"/>
<Item name="indexMenu7" title="Expandable DHTML List Example"
toolTip="Shows Expandable DHTML list"
page="/dhtmlExpandable.jsp"/>
<Item name="indexMenu7" title="Dropdown DHTML List Example"
toolTip="Shows Dropdown DHTML list"
page="/dhtmlDropdown.jsp"/>
<Item name="indexMenu8" title="Roles Menu Example"
toolTip="Shows Menus based on user's role"
page="/rolesMenu.jsp"/>
<Item name="indexMenu9" title="Tabbed Menu Example [New!]"
toolTip="Shows Tabbed-based Menu"
forward="tabbedMenu"/>
</Menu>
</MenuConfig>
SECTION 03 基本型選單 - SimpleMenuDisplayer 的 taglib 使用方法
我們可以簡單的使用 menu:useMenuDisplayer name="Simple" 去調(diào)用 SimpleMenuDisplayer, 接著指定 menu:displayMenu 指定 indexMenu, 將可以將 menu-config.xml 的配置的選單組件顯示出來. 如果是多層的狀況,也會(huì)內(nèi)縮樣式呈現(xiàn).
SECTION 04 下拉型選單 - DropDownMenuDisplayer 的 taglib 使用方法
下拉型選單, 就是可以展開及關(guān)閉,使用的方法與 SimpleMenuDisplayer 雷同,只需要改成 menu:useMenuDisplayer name="DropDown" 就 可以了.
SECTION 05 浮動(dòng)式選單 - CoolMenuDisplayer 的 taglib 使用方法
浮動(dòng)式選單除了需要改成 menu:useMenuDisplayer name="CoolMenu" 或 "CoolMenu4" 可以了. CoolMenu 還需要取得 javascript coolmenu3.js, CoolMenu4 則是需要取得 javascript coolmenu4.js 及 cm_addins.js, 并且要配置相關(guān)的 coolmenu-config.js, 你可以配置他顯示的圖形及 顏色等等.
SECTION 06 樹狀選單 - ListMenuDisplayer 的 taglib 使用方法
樹狀選單則是把 menu:useMenuDisplayer name 設(shè)為 "ListMenu". 可以加入 menuExpandable.js, 調(diào)用 expandMenus() 將所有子節(jié)點(diǎn)顯 示出來.
SECTION 07 標(biāo)簽選單 - TabbedMenuDisplayer 的 taglib 使用方法
標(biāo)簽選單將 menu:useMenuDisplayer name 設(shè)為 "TabbedMenu",并且 加入 tabs.js 即可,
SECTION 08 結(jié)論
struts-menu 還可以和 permission , role 結(jié)合, 讓具有該權(quán)限的使用者才能夠看到及使用那些選項(xiàng), 有興趣的可以參 考范例, 我想, 臺(tái)灣孫三才先生的 jspwidget 的 taglib 組件設(shè)計(jì)風(fēng)格 更吸引人, 如果能夠結(jié)合這兩項(xiàng), 并且修改為各種瀏覽器都可以正常瀏覽, 那么 web ui-component 開發(fā)的夢(mèng)想, 將會(huì)到來...
作者:sentom
聯(lián)系客服