Question

如何在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一起转换为其下方网格的一行。带有标签的复选框位于第一列，第二列中的菜单（其他行具有相同的菜单），标签跨越其余列。

Answer 1

你必须通过制作一个三列网格并将hbox放在第三列第二行来伪造它。你是不对的，你不能跨越多列。

XUL网格，包含跨越多列的元素

1 个答案: