FineUI 官方论坛

标题: 界面自适应问题，求帮助。 [打印本页]

作者: ☆幻~精灵 时间: 2012-5-25 17:28
标题: 界面自适应问题，求帮助。
本帖最后由 ☆幻~精灵于 2012-5-25 17:31 编辑

一、首先，如果我设置Grid的 <ext:Grid ID="Grid1" PageSize="20" ShowBorder="true" ShowHeader="false" AutoHeight="true" Width="1150px" AllowPaging="true" runat="server" DataKeyNames="cId"
IsDatabasePaging="true" EnableRowNumber="True">
这种条件下，Width为固定值，当不在PageManager中不设置AutoSizePanelID="Grid1"时，Grid1为固定宽度，当页面宽度小于该宽度时，为出现滚动条。

二、当不设置Grid1的Width属性，而只设置AutoWidth为true时，同时设置PageManager的AutoSizePanelID="Grid1"，此时，Grid1会自适应宽度。总是占满屏幕。当屏幕宽度较小时，右边会有部分内容不显示。
截图如下：

[attach]555[/attach]
如何能够在第二种条件下，设置一个最小宽度，如果屏幕宽度小于最小宽度，自动出现滚动条呢？求帮助！

作者: ☆幻~精灵 时间: 2012-5-27 10:54
发现解决方案。截图如下。[attach]564[/attach]
代码如下：
<ext

ageManager ID="

ageManager" runat="server" AutoSizePanelID="Grid1" />
<ext:Grid ID="Grid1" Title="收件箱消息列表" PageSize="30" ShowBorder="true" ShowHeader="false"
      AllowPaging="true" runat="server" EnableCheckBoxSelect="True" DataKeyNames="msgId"
      IsDatabasePaging="true" EnableRowNumber="True"
      AllowSorting="true">

关键代码是：在PageManager中添加AutoSizePanelId，然后在Grid中取消AutoHeight和AutoWidth属性。

作者: 天蓝若空 时间: 2012-5-27 15:40

☆幻~精灵发表于 2012-5-27 10:54
发现解决方案。截图如下。
代码如下：

[attach]565[/attach]如图，设置pagemanager 的AutoSizePanelId 为外层的一个panel，里边是一个form和panel ，设置内部的panel 的layout 为fit 实现grid的自适应后，缩小浏览器就不会出现滚动条。求解决方法

作者: ☆幻~精灵 时间: 2012-5-27 16:24
只需要删除内部Panel中Grid的AutoHeight和AutoWidth属性就可以了。

作者: ☆幻~精灵 时间: 2012-5-27 16:26

天蓝若空发表于 2012-5-27 15:40
如图，设置pagemanager 的AutoSizePanelId 为外层的一个panel，里边是一个form和panel ，设置内部的panel ...

<form id="form1" runat="server">
<ext

ageManager ID="

ageManager1" AutoSizePanelID="RegionPanel1" runat="server">
</ext

ageManager>
<ext:RegionPanel ID="RegionPanel1" ShowBorder="false" runat="server">
      <Toolbars>
         <ext:Toolbar ID="Toolbar1" runat="server">
            <Items>
                  <ext:ToolbarFill runat="server">
                  </ext:ToolbarFill>
                  <ext

abel ID="Label1" Text="客户状态：" runat="server">
</ext

abel>
<ext

ropDownList ID="ddlState" runat="server" AutoPostBack="true" OnSelectedIndexChanged="ddlState_SelectedIndexChanged"
Label="Label">
<ext

istItem Text="所有状态" Value="0" />
</ext

ropDownList>
<ext

abel ID="Label2" Text="关键字：" runat="server">
</ext

abel>
                  <ext:TextBox runat="server" ID="tbKeys">
                  </ext:TextBox>
                  <ext:Button Text="查找" Icon="Find" ID="btnFind" runat="server">
                  </ext:Button>
            </Items>
         </ext:Toolbar>
      </Toolbars>
      <Regions>
         <ext:Region ID="Region2" Split="true" Width="400px" Margins="0 0 0 0" ShowHeader="false"
            Title="目录" EnableCollapse="true" Layout="Fit" Position="Left" runat="server">
            <Items>
                  <ext:Grid ID="Grid1" Title="表格" PageSize="20" ShowBorder="true" ShowHeader="false"
                     AutoPostBack="true" AllowPaging="true" runat="server" DataKeyNames="cId" IsDatabasePaging="true"
                     OnPageIndexChange="Grid1_PageIndexChange" OnRowClick="Grid1_RowClick" EnableRowNumber="True">
                     <Columns>
                        <ext:BoundField DataField="cName" Width="100px" ColumnID="name" DataFormatString="{0}"
                              HeaderText="客户名称" />
                        <ext:BoundField DataField="applyMoney" Width="80px" DataFormatString="{0:N2}万元" HeaderText="担保金额" />
                        <ext:BoundField DataField="applyLimit" DataFormatString="{0}个月" HeaderText="担保期限"
                              Width="60px" />
                        <ext:BoundField DataField="depName" DataFormatString="{0}" HeaderText="部门" Width="60px" />
                        <ext:BoundField DataField="dealName" DataFormatString="{0}" HeaderText="客户经理" Width="60px" />
                     </Columns>
                  </ext:Grid>
            </Items>
         </ext:Region>
         <ext:Region ID="Region3" ShowHeader="false" Margins="0 0 0 0" Layout="Fit" Position="Center"
            runat="server">
            <Items>
                  <ext:Grid ID="Grid2" Title="用款还款记录表-【请选择客户】" ShowBorder="true" ShowHeader="true"
                     AutoHeight="true" AutoWidth="false" AllowPaging="true" runat="server" DataKeyNames="cuId"
                     EnableRowNumber="True">
                     <Toolbars>
                        <ext:Toolbar ID="Toolbar2" runat="server">
                              <Items>
                                 <ext:Button runat="server" Icon="Add" ID="btnAdd" Text="添加放款记录">
                                 </ext:Button>
                                 <ext:ToolbarSeparator runat="server">
                                 </ext:ToolbarSeparator>
                                 <ext:Button runat="server" ID="btnSet" Text="还款结束-流转到解保" Icon="AwardStarAdd" ConfirmText="客户已还清款项吗？是否确定还款结束？"
                                    OnClick="btnSet_Click">
                                 </ext:Button>
                              </Items>
                        </ext:Toolbar>
                     </Toolbars>
                     <Columns>
                        <ext:BoundField DataField="cName" DataFormatString="{0}" HeaderText="客户名称" DataToolTipField="cName"
                              ExpandUnusedSpace="true" />
                        <ext:BoundField DataField="cuMoney" Width="80px" DataFormatString="{0:N2}万元" HeaderText="放款金额" />
                        <ext:BoundField DataField="cuType" DataFormatString="{0}" HeaderText="放款品种" Width="80px" />
                        <ext:BoundField DataField="cuUserDate" DataFormatString="{0:yyyy-MM-dd}" HeaderText="放款时间"
                              Width="80px" />
                        <ext:BoundField DataField="cuShouldDate" DataFormatString="{0:yyyy-MM-dd}" HeaderText="到期时间"
                              Width="80px" />
                        <ext:CheckBoxField DataField="isReturn" RenderAsStaticField="true" Width="60px" HeaderText="是否还款" />
                        <ext:BoundField DataField="cuTrueMoney" Width="80px" DataFormatString="{0:N2}万元"
                              HeaderText="还款金额" />
                        <ext:BoundField DataField="cuTrueDate" DataFormatString="{0:yyyy-MM-dd}" HeaderText="还款时间"
                              Width="80px" />
                        <ext:WindowField ColumnID="win1" WindowID="Window1" HeaderText="操作" DataIFrameUrlFields="cuId"
                              DataIFrameUrlFormatString="ReturnMoney.aspx?id={0}" DataWindowTitleField="cName"
                              DataWindowTitleFormatString="还款登记-[{0}]" Width="60px" Text="登记还款" />
                     </Columns>
                  </ext:Grid>
            </Items>
         </ext:Region>
      </Regions>
</ext:RegionPanel>
<ext:Window ID="Window1" runat="server" EnableIFrame="true" Height="350px" IsModal="true"
      Hidden="true" Title="Window" Width="400px" OnClose="Window1_Close">
</ext:Window>
</form>

贴一段类似的代码。

作者: TiDi 时间: 2012-5-27 22:24
一直没搞明白，pannel类控件里AutoHeight和AutoWidth属性干嘛用的

作者: ☆幻~精灵 时间: 2012-5-29 17:35

TiDi 发表于 2012-5-27 22:24
一直没搞明白，pannel类控件里AutoHeight和AutoWidth属性干嘛用的

自适应内容宽度吧！我也不太清楚。

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