代码之家  ›  专栏  ›  技术社区  ›  Alexey Romanov

一个元素跨越多个列的XUL网格

xul
  •  0
  • Alexey Romanov  · 技术社区  · 14 年前

    我怎样才能在XUL中做出这样的布局?

    --------------------------------------------
    elem11 | elem12 | elem13                   |
    --------------------------------------------
    elem21 | elem22 | elem23 | elem24 | elem25 |
    --------------------------------------------
    

    <grid>

    编辑:XUL

    <groupbox flex="1">
        <caption label="&options.general.keyBindings;" />
        <vbox flex="1">
            <hbox flex="1" align="center">
                <checkbox id="nextpleaseAllowNumberShortcuts" oncommand="nextplease.enableDisableNumberShortcutModifierMenu();"/>
                <menulist id="nextpleaseNumberShortcutModifier" prefstring="nextplease.numbermodifier" style="margin-right: 0">
                    <menupopup onpopuphiding="nextplease.keyBindingsChanged = true;"/>
                </menulist>
                <label id="nextpleaseAllowNumberShortcuts1"/>
            </hbox>
            <separator class="thin"/>
            <grid>
                <columns>
                    <column/>
                    <column/>
                    <column/>
                    <column/>
                    <column/>
                    <column/>
                </columns>
    
                <rows>
                    <row align="center">
                        <label value="&options.general.nextKey;" />
                        <menulist id="nextpleaseNextModifier" prefstring="nextplease.modifier">
                            <menupopup onpopuphiding="nextplease.onModifierMenuChange('nextkey', 'nextkeymenu', 'nextpleaseModifier');"/>
                        </menulist>
                        <label value="&options.general.enterKey;" />
                        <textbox id="nextkey" type="text" size="1" maxlength="1"
                            onchange="return nextplease.onKeyChange('nextkey', 'nextkeymenu', 'nextpleaseModifier');" />
                        <label value="&options.general.or;" />
                        <menulist id="nextkeymenu">
                            <menupopup onpopuphiding="return nextplease.onKeyMenuChange('nextkey', 'nextkeymenu', 'nextpleaseModifier');"/>
                        </menulist>
                    </row>
                    <row align="center">
                        <label value="&options.general.prevKey;" />
                        <menulist id="nextpleasePrevModifier" prefstring="nextplease.modifier">
                            <menupopup onpopuphiding="nextplease.onModifierMenuChange('prevkey', 'prevkeymenu', 'nextpleasePrevModifier');"/>
                        </menulist>
                        <label value="&options.general.enterKey;" />
                        <textbox id="prevkey" type="text" size="1" maxlength="1"
                            onchange="return nextplease.onKeyChange('prevkey', 'prevkeymenu', 'nextpleasePrevModifier');" />
                        <label value="&options.general.or;" />
                        <menulist id="prevkeymenu">
                            <menupopup onpopuphiding="return nextplease.onKeyMenuChange('prevkey', 'prevkeymenu', 'nextpleasePrevModifier');"/>
                        </menulist>
                    </row>
                    <row align="center">
                        <label value="&options.general.firstKey;" />
                        <menulist id="nextpleaseFirstModifier" prefstring="nextplease.modifier">
                            <menupopup onpopuphiding="nextplease.onModifierMenuChange('firstkey', 'firstkeymenu', 'nextpleaseFirstModifier');"/>
                        </menulist>
                        <label value="&options.general.enterKey;" />
                        <textbox id="firstkey" type="text" size="1" maxlength="1"
                            onchange="return nextplease.onKeyChange('firstkey', 'firstkeymenu', 'nextpleaseFirstModifier');" />
                        <label value="&options.general.or;" />
                        <menulist id="firstkeymenu">
                            <menupopup onpopuphiding="return nextplease.onKeyMenuChange('firstkey', 'firstkeymenu', 'nextpleaseFirstModifier');"/>
                        </menulist>
                    </row>
                    <row align="center">
                        <label value="&options.general.lastKey;" />
                        <menulist id="nextpleaseLastModifier" prefstring="nextplease.modifier">
                            <menupopup onpopuphiding="nextplease.onModifierMenuChange('lastkey', 'lastkeymenu', 'nextpleaseLastModifier');"/>
                        </menulist>
                        <label value="&options.general.enterKey;" />
                        <textbox id="lastkey" type="text" size="1" maxlength="1"
                            onchange="return nextplease.onKeyChange('lastkey', 'lastkeymenu', 'nextpleaseLastModifier');" />
                        <label value="&options.general.or;" />
                        <menulist id="lastkeymenu">
                            <menupopup onpopuphiding="return nextplease.onKeyMenuChange('lastkey', 'lastkeymenu', 'nextpleaseLastModifier');"/>
                        </menulist>
                    </row>
                </rows>
            </grid>
        </vbox>
    </groupbox>
    

    <hbox> 具有 nextpleaseAllowNumberShortcuts 在它下面的一行网格中。带有标签的复选框将位于第一列,菜单位于第二列(其他行具有相同的菜单),标签将跨越其他列。

    1 回复  |  直到 14 年前
        1
  •  2
  •   pc1oad1etter    14 年前

    你必须做一个三列的网格,把一个hbox放在第三列第二行。您不能跨越多个列,这是正确的。