WebSphere Portal调整portlet之间的间隙

WebSphere Portal调整portlet之间的间隙

2009-05-13 09:34

转载：http://www.webspherechina.net/?viewnews-3034.html 间距的原因： portlet之间存在的间距过大的原因是 portal v6.0提供了托拽的功能，这些间距是为了这个功能而存在的，所以如果一点间距都不想要的话，portal就没有了托拽的功能。 首先是portlet之间的间距 它是由皮肤下边的两个UnlayeredContainer-V.jsp（控制垂直间距）,UnlayeredContainer-Hjsp jsp(控制水平间距)文件导致的。只要在里边修改它内置的一些空隙就可以了 修改后的UnlayeredContainer-H,jsp <table class="layoutRow" cellpadding="0" cellspacing="0" border="0"><tr> <%    boolean hasChildren=false; %> <portal-skin:layoutNodeLoop var="currentLayoutNode"> <% hasChildren=true; String columnWidth=(String)currentLayoutNode.getMetrics().getValue(CompositionMetrics.WID; %> <td valign="top" <% if (columnWidth != null) { out.print ("width=/""); out.print (columnWidth); out.print ("/""); } %>> <portal-skin:layoutNodeRender/> </td> <td style="width:1px;" valign="top"> <dnd:drop namespace="wp" type="portlet_windowID" action="#" name="<%=com.ibm.wps.dnd.util.Constants.PORTLET_INSTANCE_ID%>" validator="com.ibm.wps.dnd.impl.DNDPortletActionValidator" optionalActionJavascript="DND_MOVE_PORTLET_JS"><dnd:additionalAction namespace="wp" type="portlet_ID" action="#" name="<%=com.ibm.wps.dnd.util.Constants.PORTLET_ID%>" validator="com.ibm.wps.dnd.impl.DNDPortletActionValidator" supportsMultiselect="true" multiselectDelimiter="__DND_DELIM__" optionalActionJavascript="DND_ADD_PORTLET_JS"/> </dnd:drop></td> </portal-skin:layoutNodeLoop> <% if (!hasChildren) {%><td width="100%">&nbsp;</td> <%}%></tr> </table> UnlayeredContainer-V.jsp： <table class="layoutColumn" cellpadding="0" cellspacing="0" border="0"> <portal-skin:layoutNodeLoop var="currentLayoutNode"> <tr> <td style="width:100%;" valign="top"><portal-skin:layoutNodeRender/></td> </tr> </portal-skin:layoutNodeLoop> <tr> <td> <dnd:drop namespace="wp" type="portlet_windowID" action="#" name="<%=com.ibm.wps.dnd.util.Constants.PORTLET_INSTANCE_ID%>" validator="com.ibm.wps.dnd.impl.DNDPortletActionValidator" optionalActionJavascript="DND_MOVE_PORTLET_JS">&nbsp; <dnd:additionalAction namespace="wp" type="portlet_ID" action="#" name="<%=com.ibm.wps.dnd.util.Constants.PORTLET_ID%>" validator="com.ibm.wps.dnd.impl.DNDPortletActionValidator" supportsMultiselect="true" multiselectDelimiter="__DND_DELIM__" optionalActionJavascript="DND_ADD_PORTLET_JS"/> </dnd:drop> </td> </tr> </table> 等你把这些文件替换后发布到 服务器上后还是发现有一点间距： 这些间距大概有5px左右吧 ！ 你可以看看style－theme。Jspf 文件 有个wpsPortlet 样式文件定义了每个portlet 的间距 .wpsPortlet{    margin:5px;    border-left: 1px solid;    border-right: 1px solid;    border-bottom: 1px solid;    border-color: ${colors.skinBorder};    background-image:none; } 这下 portlet与portlet之间就没有间距了，可是portlet与最左边的屏幕还是有间距 可以看一下 defaultjsp文件     <td width="100%" height="100%" valign="top"> <a name="wpsMainContent"> </a> <%-- Call the portal engine command to render the portlets for this page --%> <div id="mainContent"> <portal-core:screenRender/> </div></td> </tr> </table> 这些代码导入了屏幕 你可以看到有一个 id＝“mainContent”属性。 再来看 style-theme.jspf 文件 #mainContent {    padding: 5px; } 整个portlet与屏幕之间 还是有间距 再把它给改一下就可以了 现在没有间距了 可是当你把皮肤替换为noskins 时发现又出现间隙了 在style-theme.jspf文件里你可以看到这个样式文件它定义了单个portlet与皮肤之间的间距，不用我说你也知道杂办了吧！ .wpsPortletBody{    margin: 5px;    background-image:none; } 现在终于在页面上找不到一点间距了 。