Question

我的xe：applicationLayout在我的demoLayout.xsp CC中。默认情况下，左列宽度在.lotusColLeft类中设置为220px。我可以通过将以下CC添加到任何需要300px宽左列的XPage来手动覆盖此设置：

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
<style>
    .lotusColLeft { width:300px }
    .hugeWidth { width:2000px }
    .lotusContent { overflow-x: scroll; }
</style>
</xp:view>

这很好用，但实际上我需要一个400和500像素宽的左列用于某些xpages。是的，可以使用上面的3个CC来做到这一点，但希望有一个更好的方法，我可以在我将demoLayout.xsp CC控件添加到我的xpage时在自定义属性中设置所需的宽度。

有什么想法吗？

Answer 1

不是将样式标记直接放在自定义控件上，而是使用带有escape =“false”的计算字段控件（即输出为HTML）。然后，在value属性中，您可以计算左列的宽度。这样的事情对我有用：

<xp:text escape="false"><xp:this.value><![CDATA[
<style>
   .lotusColLeft {width:#{compositeData.passedWidth};}
</style>]]>
</xp:this.value></xp:text>

然后，您可以在自定义控件上添加一个passWidth属性并传入相关的宽度。您可以更复杂并设置Computed Field的加载属性，这样它只显示是否已设置passedWidth属性。

Answer 2

我喜欢Paul的建议，但另一种方法是在布局自定义控件上定义两个有条件渲染的样式表资源（或者只使用计算的href定义一个）。该控件可以具有leftColumnWidth属性，该属性接受“small”，“medium”或“large”的值。如果很小，则不会呈现其他样式表。否则它呈现两者中的一个。这样，如果您需要更改与其中任何一个相关的精确宽度（以及可能有意义调整以适应调整后的布局的其他元素），您只需在样式表中更改它，而无需触摸每个页面。

如何在xe：applicationLayout中有条件地改变左列的宽度？

2 个答案: