在网格中弯曲。调整浏览器大小后无法正确显示

Question

我有这个网格和这些数据。列设置为 hflex="min"。这是我的 .zul

<?page title="" contentType="text/html;charset=UTF-8"?>
<div sclass="container-resume-procedure">
    <grid sclass="grid-resume-procedure" height="130px">
        <auxhead>
            <auxheader  colspan="1">
                <label value=""/> 
            </auxheader>
            <auxheader  colspan="2" style="align:center">
                <label value="Resumen del Tramite"/> 
            </auxheader>
            <auxheader  colspan="1">
                <label value=""/> 
            </auxheader>            
        </auxhead>      
        <columns>
            <column label="Numero de Tramite" hflex="min" width="15%"  align="center"/>
            <column label="Cliente" hflex="min" width="15%" align="center"/>
            <column label="Orden" hflex="min" width="15%" align="center"/>
            <column label="Estado" hflex="min" width="15%" align="center"/>     
        </columns>
        <rows>
            <row>
                <label id="proced"/>
                <label id="resume_client"/>
                <label id="resumenumOrder"/>
                <label id="resume_status"/>
            </row>
        </rows> 
    </grid>
</div>

它工作正常，当浏览器调整为较小的宽度时，我可以看到带有滚动条的网格并且信息清晰可见。但是当调整浏览器大小时，图像中的问题就会出现。我找到了一种解决方案，就是在网格中设置hflex，但是当浏览器调整到很小的时候，水平滚动条不会出现。

Answer 1

我认为列必须覆盖网格的 100% 宽度，但在你的列中我看到右侧是空的 space。所以不要使用 hflex="min" 和 width="15%"。您应该对至少一列（包含最重要信息的列）使用 hflex="1"，对其他列使用 hflex="min"。试试这个：

<column label="Numero de Tramite" hflex="min" align="center"/>
<column label="Cliente" hflex="1" align="center"/>
<column label="Orden" hflex="min" align="center"/>
<column label="Estado" hflex="min" align="center"/>

Answer 2

您需要提供 ID 并使用 invalidate() 刷新该网格就像这样：

grid id="grdProcedure" sclass="grid-resume-procedure" height="130px"

比 Java class 只需添加 grdProcedure.invalidate();.

在网格中弯曲。调整浏览器大小后无法正确显示

Hflex in Grid. Doesn't show correclty after resize the Browser

grid

zk

zul