Столбцы сетки ZK меняют ширину при нажатии кнопки

Question

Я поместил сетку ZK с определенными пропорциями столбцов следующим образом:

    <grid model="@load(vm.rowList)">
        <template name="model">
            <row>
                <cell width="7px">
                    <label value="@load(each.number)"/>
                </cell>

                <cell width="55px">
                    <vbox>
                        <button label="Up" width="100%"
                            onClick="@command('up',row=each)" />
                        <button label="Down" width="100%"
                            onClick="@command('down',row=each)" />
                    </vbox>
                </cell>
                <cell width="100%">
                    <label value="@load(each.text)"/>
                </cell>
            </row>
        </template>
    </grid>

Он отображается нормально, пока я не нажму любую кнопку, ширина каждого столбца становится 1/3 сетки.

Я не понимаю причину. Подскажите пожалуйста, как сохранить ширину постоянной.

Answer 1

Ты можешь попробовать!!! Используйте de colums для определения размера каждой ячейки.

<grid model="@load(vm.rowList)">
    <columns sizable="true">
        <column width="20%"/>
        <column width="20%"/>
        <column width="20%"/>
    </columns>
    <template name="model">
        <row>
            <cell>
                <label value="@load(each.number)"/>
            </cell>

            <cell>
                <vbox>
                    <button label="Up" width="100%"
                        onClick="@command('up',row=each)" />
                    <button label="Down" width="100%"
                        onClick="@command('down',row=each)" />
                </vbox>
            </cell>
            <cell>
                <label value="@load(each.text)"/>
            </cell>
        </row>
    </template>
</grid>