0

拡張ライブラリアプリケーションコントロールを使用して、ページの左側のメニューを提供し、上部にバナーを表示しています。フッターなどのほとんどのものは、アプリケーションコントロールで無効になっています。それがoneuiに準拠しているかどうかは本当に気にせず、左のメニューが欲しいだけです。

中央の列にビューがあります。私の問題は、中央の柱の幅が十分でないことです。一部の列が切り捨てられています。とにかくその幅を制御することはありますか？または、右の列を無効にしますか？

または、メニューコントロールをドロップできる左側の列と、ビューをドロップできる右側の列を備えたアプリケーションコントロールのようなカスタムコントロールがありますか？

4

1 に答える 1

2

中央の列からの最小幅のみが設定されます。したがって、常に（ブラウザ内で）残っている最大幅に拡張されます。もちろん、これはユーザーのデバイスからの解像度に制限されます。

まず、特定の条件が満たされた場合にのみ右の列が表示される例を以下に貼り付けました。使用する予定がない場合は、完全に取り外してください。次に、.lotusColLeftクラスが左側の列の幅を制御します。これを小さくして、中央の列の幅をいくらか増やすことができます。最後に、中央の列のコンテンツラッパーに固定幅を指定する場合は、オーバーフロープロパティも追加して、中央の列をスクロール可能にする必要があります。ただし、この最後のオプションは、私の意見ではあまり望ましくありません...お役に立てば幸いです。

カスタムコントロール

<!-- CUSTOM CONTROL -->
<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xe="http://www.ibm.com/xsp/coreex">
    <xe:applicationLayout id="applicationLayout1">
        <xp:callback facetName="facetMiddle" id="facetMiddle"></xp:callback>
        <xe:this.facets>
            <!-- REMOVE THE ROW BELOW IF THE RIGHT COLUMN IS NEVER USED -->
            <xp:callback facetName="facetRight" id="facetRight" xp:key="RightColumn"></xp:callback>
            <xp:callback facetName="facetLeft" id="facetLeft" xp:key="LeftColumn"></xp:callback>
        </xe:this.facets>
        <xe:this.configuration>
            <xe:oneuiApplication titleBar="false" placeBar="false"
                footer="false" legal="false" productLogo="/logo.gif">
            </xe:oneuiApplication>
        </xe:this.configuration>
    </xe:applicationLayout>
</xp:view>

XPAGE 

<!-- XPAGE -->
<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xc="http://www.ibm.com/xsp/custom">
    <style>
        .lotusColLeft { width:100px }
        /* UNCOMMENT THESE LINES TO SEE THE LAST OPTION IN ACTION
        .hugeWidth { width:2000px }
        .lotusContent { overflow-x: scroll; }
        */
    </style>

    <xc:layout>
        <xp:this.facets>
            <xp:panel xp:key="facetMiddle" styleClass="hugeWidth">MiddlePanel</xp:panel>
            <!-- REMOVE THE ROW BELOW IF THE RIGHT COLUMN IS NEVER USED, OR DEFINE ITS CONDITION -->
            <xp:panel xp:key="facetRight" rendered="#{javascript:viewScope.hasView}">RightPanel</xp:panel>
            <xp:panel xp:key="facetLeft">LeftPanel</xp:panel>
        </xp:this.facets>
    </xc:layout>
</xp:view>
于 2012-08-09T08:51:09.283 に答える