`

按照比例来设置列宽

阅读更多

Flex里面,DataGrid的column的width属性不接受百分比,只接受一个具体的像素值,所以,如果想按照比例来设置列宽需要费些周折。 Google了一下,有两种方法可以做到: 第一种方法,不要设置width为百分比,而设置为一个小数,所有列的小数值的和必须为1。 <mx:DataGrid width="100%" height="100%">
<mx:columns>
<mx:DataGridColumn headerText="Name" dataField="name" width=".25" />
<mx:DataGridColumn headerText="Age" dataField="age" width=".15" />
<mx:DataGridColumn headerText="Job" dataField="job" width=".35" />
<mx:DataGridColumn headerText="Height" dataField="height" width=".25" />
</mx:columns>
</mx:DataGrid>
参见:http://www.switchonthecode.com/tutorials/flex-datagrid-percentage-width-columns
这种方法比较简单明了,但是如果你的项目不是用的标准Flex的库,而是自己公司开发的库,那么上面的就可能不工作,那么就只能采用下面一种方法了。
 
第二种方法:在DataGrid的creationComplete()回调函数中手动设置列宽,看下面的代码:
<mx:Script>
<![CDATA[
function setRelativeColWidths(){
dg1.getColumnAt(0).width =dg1.width*.10;
dg1.getColumnAt(1).width =dg1.width*.15;
dg1.getColumnAt(2).width =dg1.width*.50;
dg1.getColumnAt(3).width =dg1.width*.10;
dg1.getColumnAt(4).width =dg1.width*.15;
}
]]>
</mx:Script>
<mx:DataGrid id="dg1" editable="false" hScrollPolicy="off" rowCount="5"
width="50%" creationComplete="setRelativeColWidths()" resize="setRelativeColWidths()>
 
在creationComplete的回调函数setRelativeColWidths方法中,对每一列按照比例设置了列宽。
参见:http://kb2.adobe.com/cps/224/224468bb.html
但这种方法有个问题:设置列宽后,如果DataGrid自身大小发生变化后,列的宽度不会自动调整,因此再在resize的时候让其调整一次列宽,这样就完美了。 ......

分享到:
评论

相关推荐

    Excel精确设置列宽、行高

    - 使用“格式”菜单下的“列宽”命令,可以直接输入数值来设置列宽。 - **调整行高**: - 同样可以通过拖动行标题之间的分隔线来手动调整行高。 - 使用“格式”菜单下的“行高”命令,可以直接输入数值来设置行高...

    FlexGrid自动设置列宽

    总的来说,FlexGrid的自动设置列宽功能是通过各种方式实现的,可以根据需求灵活选择适合的方法。这不仅提高了用户界面的易用性,还简化了开发流程,使得在处理网格数据时更加高效。理解并掌握这些方法,可以帮助...

    QT - QTableView表格视图的列宽设置 - 王严の博客 - CSDN博客1

    在Qt的QTableView中,你可以通过两种方式来设置列宽:自动调整列宽以适应内容(`setSectionResizeMode(QHeaderView::ResizeToContents)`),或者手动设定每列的具体宽度(`setColumnWidth()`方法)。前者简洁但限制较多...

    PB自动实现列宽

    在这个场景中,"PB自动实现列宽"指的是如何在PowerBuilder的数据窗口中设置列宽,使得列宽能够根据内容自动调整,以达到最佳的显示效果。 在PowerBuilder中,数据窗口的列宽有两种基本模式:固定和动态。固定列宽...

    Qt 自定义Tableview,根据内容调整列宽

    列宽可以通过setColumnWidth()函数进行设置,但默认情况下,QTableView并不会自动根据内容调整列宽。 要实现自适应列宽,我们可以采用以下几种策略: 1. **重载QTableView的sizeHintForColumn()函数**: 你可以...

    易语言快速设置高级表格列宽

    2. **获取列数**:在设置列宽前,可能需要先了解表格有多少列。这可以通过`表格1.获取列数`命令得到。 3. **设置默认列宽**:如果需要所有列都有相同的宽度,可以使用循环结构遍历每一列,使用`表格1.设置列宽`命令...

    TIA博途WinCC PRO V16中如何修改报警控件的列宽?.docx

    列宽的设置直接影响到这些信息在屏幕上的显示比例和清晰度。 修改报警控件列宽的步骤如下: 1. 打开TIA博途WinCC项目,找到需要调整列宽的报警视图控件。 2. 双击该控件,进入其属性编辑界面。在属性编辑器中,...

    解决wpf ListView最小列宽问题

    为了实现更复杂的列宽调整,我们可以监听`SizeChanged`事件,然后动态计算并设置列宽。这在需要根据窗口大小变化动态调整列宽的情况下很有用。以下是一个简单的示例: ```csharp private void lvData_SizeChanged...

    易语言源码易语言快速设置高级表格列宽源码.rar

    5. **调试与测试**:在编写源码后,需要进行调试和测试,确保在不同情况下(如数据量变化、屏幕分辨率变化等)都能正确设置列宽。这涉及到易语言的调试工具和测试方法。 6. **易语言特性**:易语言有一些独特的特性...

    Excel把行高和列宽单位设置成厘米,精确设置表格.docx

    然而,默认情况下,Excel的行高是以磅为单位,列宽则是以“标准字符宽度”来衡量。对于行高,1英寸约等于72磅,而在Windows系统中,这个换算比例保持不变,即72磅等于1英寸,进一步转换为厘米,即72磅等于2.54厘米。...

    winform中自动调节datagrid列宽(c#)

    1. **AutoSizeMode**:这是`DataGridViewColumn`类中的一个属性,它可以设置为不同的值来决定列宽如何自动调整。 - `DataGridViewAutoSizeColumnsMode.None`:关闭自动调整功能,列宽由用户或代码手动设定。 - `...

    易语言高级表格自动调整列宽源码

    4. **设置列宽**:最后,使用表格控件的API(如`表.设置列宽度`)将计算出的理想宽度应用到对应列上。同时,为了保持整体界面的平衡,可能还需要考虑为表格添加一些额外的间距。 这个源码示例是一个很好的学习资源...

    layui table 列宽百分比显示的实现方法

    接下来,我们来看一段示例代码,这段代码展示了如何在初始化Layui table时设置列宽为百分比。此处列宽被设置为20%,15%,20%,20%等,这些百分比代表了列宽相对于整个表格宽度的比例。 ```javascript var tableInit...

    超级列表框调整列宽.rar

    在Windows API中,可能涉及到`ListView_SetColumnWidth`函数来设置列宽。而在.NET Framework中,可以使用`ListView.Columns[i].Width`属性进行设置,或者调用`ColumnHeader.Width`的属性设置方法。 4. **事件处理*...

    完整版超级列表框自动调整列宽.e.rar

    3. **设置列宽**:计算出每个列的最优宽度后,需要使用相关函数(如ListView_SetColumnWidth在Windows API或CListCtrl::SetColumnWidth在MFC中)来设置列宽。可以选择填充满整个控件,或者按照计算的比例分配宽度。 ...

    PB数据Grod数据窗口列宽度自动适应

    为了实现数据窗口中 Grid 类型的列宽自动适应,我们需要编写一段代码来动态计算并设置每个列的宽度。以下为具体的实现步骤: 1. **获取数据窗口对象**:首先需要获取到数据窗口对象本身。 2. **遍历所有列**:接着...

    让DataGridView的列宽自适应

    5. `None`: 不进行自动调整,用户或代码需要手动设置列宽。 在C#中,你可以通过以下方式设置`DataGridView`的列宽自适应: ```csharp dataGridView.AutoSizeColumnsMode = DataGridViewAutoSizeColumnsMode.All...

    基于ElementUI二次封装的支持自适应列宽的tablecolumn列组件

    2. **比例分配**:将表格总宽度按比例分配给各个列。可以设定权重值,权重高的列分配到的宽度更大。这种方式需要考虑如何动态调整权重,以保持列宽的合理分布。 3. **流式布局**:利用CSS的Flexbox或Grid布局,让...

    易语言源码伟业超级列表框列宽尺寸自动调整.7z

    源码可能还包含了一些特定的优化技巧,例如批量设置列宽以减少界面刷新次数,或者使用异步处理避免阻塞用户界面。 总的来说,这个易语言源码示例为开发者提供了一个实用的工具,帮助他们创建更加友好和智能的用户...

    超级列表框自动调整列宽.rar

    7. **自定义逻辑**:根据具体需求,可能还需要添加一些自定义逻辑,比如设置最小和最大列宽限制,或者在调整列宽时保持列宽比例等。 这个压缩包可能包含了实现上述功能的代码示例,或者是一个已经封装好的控件库,...

Global site tag (gtag.js) - Google Analytics