struts之Tiles技术——Tabs layout开发应用

Tabs layout开发应用

1.首页(portaltabs.jsp代码:

<%@ page language="java" %>

<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>

<tiles:insert definition="examples.tabs.page" flush="true" />

2.组建配置文件:tiles-examples-defs.xml

  <!-- =======================================================  -->

  <!-- Tabs test page and definitions                                                                -->

  <!-- =======================================================  -->

    <!-- tabs page -->

  <definition name="examples.tabs.page" extends="examples.masterPage">

         <put name="title"    value="Tiles 1.1 Tabs layout example" />

         <put name="body"   value="examples.tabs.body" />

  </definition>

         <!-- body using tabs  下面是我们这个例子的主要代码-->

  <definition name="examples.tabs.body" path="/layouts/tabsLayout.jsp" >

       <put name="selectedIndex"     value="0" />

       <put name="parameterName"   value="selected" />

    <putList name="tabList" >

      <item value="Doc Home"              link="/index.jsp" />

      <item value="Quick overview"      link="/test/quickOverview.do" />

      <!-- <item value="Tutorial"            link="/doc/tutorial.jsp" /> -->

      <item value="Examples Home"     link="/examples/index.jsp" />

      <item value="Tutorial Home"     link="/tutorial/index.do" />

      <item value="Login"                         link="/examples/tiles/portal/login.jsp" />

      <item value="Messages"                  link="/examples/tiles/portal/messages.jsp" />

      <item value="NewsFeed"              link="/examples/tiles/portal/newsFeed.jsp" />

      <item value="Stocks"                    link="/examples/tiles/portal/stocks.jsp" />

      <item value="WhatsNew"              link="/examples/tiles/portal/whatsNew.jsp" />

</putList>

</definition>

 

  <!-- =======================================================  -->

  <!-- Master layout                                                                 -->

  <!-- =======================================================  -->

  <!-- Master layout and default tiles used by all pages -->

  <definition name="examples.masterPage" path="/layouts/classicLayout.jsp">

         <put name="title"  value="Tiles 1.1 Examples" />

         <put name="header" value="/examples/tiles/header.jsp" />

         <put name="menu"   value="examples.menu.bar" />

         <put name="footer" value="/examples/tiles/footer.jsp" />

         <put name="body"   value="/examples/tiles/body.jsp" />

  </definition>

<put name="menu"   value="examples.menu.bar" />插入了examples.menu.bar 菜单组建,详细请参考我的构建菜单的文章。

3.首页全局布局代码:classicLayout.jsp

<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>

<%-- Layout Tiles This layout create a html page with <header> and <body> tags. It rendera header, left menu, body and footer tile.

  @param title String use in page title

  @param header Header tile (jsp url or definition name)

  @param menu Menu

  @param body Body

  @param footer Footer

--%>

<HTML>

  <HEAD>

<link rel=stylesheet href="<%=request.getContextPath()%>/layouts/stylesheet.css" type="text/css">

    <title><tiles:getAsString name="title"/></title>

  </HEAD>

<body bgcolor="#ffffff" text="#000000" link="#023264" alink="#023264" vlink="#023264">

<table border="0" width="100%" cellspacing="5">

<tr><td colspan="2"><tiles:insert attribute="header" /></td></tr>

<tr>

<td width="140" valign="top"><tiles:insert attribute='menu'/></td>

<td valign="top"  align="left"><tiles:insert attribute='body' /></td>

</tr>

<tr><td colspan="2"><tiles:insert attribute="footer" /></td></tr>

</table>

</body>

</html>

4 Tabs layout布局代码:/layouts/tabsLayout.jsp

该布局需要一下参数:

l         tabList

l         selectedIndex:我们选择的tab参数

l         parameterName:实现此功能全在此参数

<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>

<%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean" %>

<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>

<%-- Tabs Layout .This layout allows to render several tiles in a tabs fashion.

  @param tabList    A list of available tabs. We use MenuItem to carry data (name, body, icon, ...)

  @param selectedIndex     Index of default selected tab

  @param parameterName   Name of parameter carrying selected info in http request.

--%>

<%-- 引入组件中的参数--%>

<tiles:useAttribute name="parameterName" classname="java.lang.String" />

<tiles:useAttribute id="selectedIndexStr" name="selectedIndex" ignore="true"

classname="java.lang.String" />

<tiles:useAttribute name="tabList" classname="java.util.List" />

<%

  String selectedColor="#98ABC7";

  String notSelectedColor="#C 0C 0C 0";

  int index = 0;                       // Loop index

  int selectedIndex = 0;       //选择的tab参数,默认为第一个

// 获得用户点击的tab参数,若是第一次打开该页,parameterName=” selected”,所以忽略该段代码。

  try {

    selectedIndex = Integer.parseInt(selectedIndexStr);

    selectedIndex = Integer.parseInt(request.getParameter( parameterName ));

    }

   catch( java.lang.NumberFormatException ex )

    { // do nothing}

 

  // Check selectedIndex bounds

  if( selectedIndex < 0 || selectedIndex >= tabList.size() ) selectedIndex = 0;

  String selectedBody

 = ((org.apache.struts.tiles.beans.MenuItem)tabList.get(selectedIndex)).getLink(); // Selected body

%>

<table border="0"  cellspacing="0" cellpadding="0">

  <%-- Draw tabs ,也就是菜单,使动态形成的--%>

<tr><td width="10">&nbsp;</td>

  <td><table border="0"  cellspacing="0" cellpadding="5">

      <tr>

<logic:iterate id="tab" name="tabList" type="org.apache.struts.tiles.beans.MenuItem" >

<% // compute href

  String href = request.getRequestURI() + "?"+parameterName + "=" + index;

// Don't add request URI prefix , but let the client compute the original URL, This allows to use a Struts action as page URL, and perform a forward.Bug reported by Don Peterkofsky

  //String href = "" + "?"+parameterName + "=" + index;

  String color = notSelectedColor;

  if( index == selectedIndex )

    {

    selectedBody = tab.getLink();

    color = selectedColor;

    } // enf if

  index++;

%>

  <td bgcolor="<%=color%>"><a href="<%=href%>" ><%=tab.getValue()%></a></td>

  <td width="1" ></td>

</logic:iterate>

      </tr>

    </table>

  </td>

  <td width="10" >&nbsp;</td>

</tr>

<tr><td height="5" bgcolor="<%=selectedColor%>" colspan="3" >&nbsp;</td></tr> 

  <%-- Draw body --%>

<tr>

  <td width="10" bgcolor="<%=selectedColor%>">&nbsp;</td>

  <td><tiles:insert name="<%=selectedBody%>" flush="true" /></td>

  <td width="10" bgcolor="<%=selectedColor%>">&nbsp;</td>

</tr>

 

<tr><td height="5" bgcolor="<%=selectedColor%>" colspan="3" >&nbsp;</td></tr> 

</table>

问题1 <a href="<%=href%>" ><%=tab.getValue()%></a>为什么用tab.Value不行。

5.效果图:

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值