FineUI 官方论坛

标题: 用HBox布局的第一种，GRID控件的高度不随窗口变化，只能固定 [打印本页]

作者: 幻之达 时间: 2015-3-17 09:11
标题: 用HBox布局的第一种，GRID控件的高度不随窗口变化，只能固定
控件版本：v3.3.3.0；IE8

问题：用HBox布局的第一种，如何解决GRID控件的高度随窗口变化。如示例中的Anchar布局中的面板四例子，GRID高度装满页面版面。

作者: sanshi 时间: 2015-3-19 13:22
自动就会随窗口的变化而变化，无需特殊设置

请用空项目重现你的问题

作者: 幻之达 时间: 2015-3-19 14:22

sanshi 发表于 2015-3-19 13:22
自动就会随窗口的变化而变化，无需特殊设置

请用空项目重现你的问题

ageManager ID="

ageManager1" AutoSizePanelID="

anel2" runat="server" />
<f

anel ID="

anel2" runat="server" ShowBorder="False"
         Layout="HBox" BoxConfigAlign="Stretch" BoxConfigPosition="Start"
         BoxConfigChildMargin="0 5 0 0" ShowHeader="false">
         <Items>
            <f

anel ID="

anel1" BoxFlex="2" runat="server" ShowBorder="true" ShowHeader="false" EnableBackgroundColor="true">
                  <Items>
                     <f:Form ID="Form2" ShowBorder="False" ShowHeader="False" runat="server" BodyPadding="3px"
                        LabelWidth="60px" AutoHeight="true" EnableBackgroundColor="true">
                        <Rows>
                           <f:FormRow>
                              <Items>
                                 <f:TextBox ID="keySupplier" runat="server" Width="250px" Label="供应商"></f:TextBox>
                                 <f:Button ID="btnSearch" Text="查询" runat="server" OnClick="btnSearch_Click" Icon="Zoom"></f:Button>
                              </Items>
                           </f:FormRow>
                           <f:FormRow>
                              <Items>
                                 <f:Grid ID="Grid1" ShowBorder="false" ShowHeader="false" runat="server" PageSize="20" AllowPaging="true" DataKeyNames="receivingid,compid,yesnot"
                                    IsDatabasePaging="true" OnPageIndexChange="Grid1_PageIndexChange" EnableRowNumber="True"
                                    EnableRowClickEvent="true" OnRowClick="Grid1_RowClick">
                                    <Columns>
                                          <f:BoundField Width="85px" DataField="shipment_date" HeaderText="运输启运日期" />
                                          <f:BoundField Width="85px" DataField="reach_date" HeaderText="运输到达日期" />
                                          <f:BoundField Width="100px" DataField="distribution_comp" HeaderText="配送物流" />
                                          <f:BoundField Width="80px" DataField="supplier_code" HeaderText="供应商编码" />
                                          <f:BoundField Width="180px" DataField="supplier" HeaderText="供应商名称" />
                                          <f:BoundField Width="50px" DataField="packages" HeaderText="件数"  TextAlign="Right" />
                                          <f:BoundField Width="60px" DataField="yesnot" HeaderText="关联品种" TextAlign="Center" />
                                          <f:BoundField Width="200px" DataField="remark" HeaderText="备注" />
                                    </Columns>
                                 </f:Grid>
                              </Items>
                           </f:FormRow>
                           </Rows>
                        </f:Form>
                  </Items>
            </f

anel>
<f

anel ID="

anel3" Width="250px" runat="server" ShowBorder="true" ShowHeader="false">
                  <Items>
                     <f:Grid ID="Grid2" Title="到货品种" ShowBorder="false" ShowHeader="true"
                           runat="server" DataKeyNames="goods" AutoHeight="true">
                        <Columns>
                              <f:BoundField DataField="name" ExpandUnusedSpace="true" HeaderText="通用名" />
                              <f:BoundField DataField="spec" HeaderText="规格" Width="90px" />
                              <f:BoundField DataField="producer" HeaderText="生产厂家" Width="90px" />
                        </Columns>
                     </f:Grid>
                  </Items>
            </f

anel>
</Items>
</f

anel>

作者: 幻之达 时间: 2015-3-19 14:34
页面运行显示

作者: sanshi 时间: 2015-3-19 15:31

幻之达发表于 2015-3-19 14:34
页面运行显示

请用空项目重现你的问题，别人方便直接运行，才能快速解决问题

作者: Gnid 时间: 2015-3-20 10:39
粗略看了一下，你的代码中控件如果要撑满的话，缺少了一个属性: BoxFlex="1"

作者: Gnid 时间: 2015-3-20 10:42
再看了一下，Panel2设定Layout="VBox" BoxConfigPosition="Start"
Form2应该设定 Height属性，建议30px以上；
Grid1加上BoxFlex="1"

作者: Gnid 时间: 2015-3-20 10:43
V3.3版本的话，Panel2还需要加上 BoxConfigAlign="Stretch"

作者: 幻之达 时间: 2015-3-23 17:50

Gnid 发表于 2015-3-20 10:39
粗略看了一下，你的代码中控件如果要撑满的话，缺少了一个属性: BoxFlex="1"

V 3.3.3.0，IE8
官方示例：http://fineui.com/demo_v3/#/demo_v3/layout/hbox.aspx
只是复制源码进行测试
运行载图
[attach]7320[/attach]
没有自动填满窗口
源码页面截图
[attach]7321[/attach]

作者: Gnid 时间: 2015-3-25 20:39
PageManager1添加属性 AutoSizePanelID="Panel2"

作者: 幻之达 时间: 2015-3-26 10:52

Gnid 发表于 2015-3-25 20:39
PageManager1添加属性 AutoSizePanelID="Panel2"

我加上此属性，是可以自动填充窗口。

加下GRID控件，GRID控件就不能自动填充窗口了

作者: Gnid 时间: 2015-3-26 11:37
本帖最后由 Gnid 于 2015-3-26 11:38 编辑

说的笼统一点，应该是这样的：
凡是要自动伸展的，都要有BoxFlex属性；
最外层的容器，要在PageManager中设定AutoSizePanelID；
凡是要固定高度但是内容可能过长需要出现滚动条的，就设定AutoScroll="true"

作者: 幻之达 时间: 2015-3-26 11:53

Gnid 发表于 2015-3-26 11:37
说的笼统一点，应该是这样的：
凡是要自动伸展的，都要有BoxFlex属性；
最外层的容器，要在PageManager中设 ...

GRID中也加入了这个属性BoxFlex，还是不能自动填充窗口

作者: Gnid 时间: 2015-3-26 13:08
你还是用空项目重现，或者直接贴整个页面的前端代码，并配图说明吧，这样讲起来真的很费劲。

欢迎光临 FineUI 官方论坛 (https://fineui.com/bbs/)