Flex Mobile 上的数据网格

发布于 2024-11-07 04:15:03 字数 1713 浏览 0 评论 0原文

Adobe 告诉我们不要使用 Datagrid< /a> 在移动设备上。我正在创建一个 Blackberry Playbook 应用程序,该应用程序具有更多的屏幕空间来显示数据表。那么有几个问题出现了!

  • 如果我不应该使用 DataGrid,我应该使用什么? (列表不算数,因为在我的应用程序中,我有 10 个表,每个表都有不同的列数和列宽)

  • 好吧,如果我必须使用 Datagrid,我如何设置它的大小以准确显示所有内容数据?例如,某些表的行长度不同,因此 requestedRowCount='-1' 似乎不起作用(参见下面的示例)

代码

    <s:DataGrid  requestedRowCount="-1" requestedColumnCount="-1" variableRowHeight="true"  styleName="dataGrid" id="partiesGrid" dataProvider="{arr1}"  skinClass="skins.DataGridSkin" click="navigator.pushView(view.AssessmentInvolvementEditView)">
        <s:columns>
        <s:ArrayList>
            <s:GridColumn dataField="name" headerText="Name" width="150"/>
            <s:GridColumn dataField="role" headerText="Role" width="150"/>
            <s:GridColumn dataField="startdate" headerText="Start" width="100"/>
            <s:GridColumn dataField="enddate" headerText="End" width="100"/>
            <s:GridColumn dataField="presponsibility" headerText="Response" width="150"/>
            <s:GridColumn dataField="pcarer" headerText="Carer" width="110"/>
            <s:GridColumn dataField="kworker" headerText="Worker" width="110"/>
            <s:GridColumn dataField="kteam" headerText="Team" width="110"/>
        </s:ArrayList>
        </s:columns>
    </s:DataGrid>`

结果(注意高度不适合 3 行,它增加了底部的空间)在此处输入图像描述

Adobe tells us to not use Datagrid on mobile devices. I'm creating a Blackberry Playbook application that has more screen space to potentially display a table of data. So a few questions arise!

  • If I shouldn't use DataGrid, what should I use? (List doesn't count because in my application I have 10's of tables each with different numbers of columns and column widths)

  • Ok, if I have to use a Datagrid, how can I set the size of it to show exactly all the data? For example, some tables have rows of different lengths, so requestedRowCount='-1' doesn't seem to work (See example below)

The Code

    <s:DataGrid  requestedRowCount="-1" requestedColumnCount="-1" variableRowHeight="true"  styleName="dataGrid" id="partiesGrid" dataProvider="{arr1}"  skinClass="skins.DataGridSkin" click="navigator.pushView(view.AssessmentInvolvementEditView)">
        <s:columns>
        <s:ArrayList>
            <s:GridColumn dataField="name" headerText="Name" width="150"/>
            <s:GridColumn dataField="role" headerText="Role" width="150"/>
            <s:GridColumn dataField="startdate" headerText="Start" width="100"/>
            <s:GridColumn dataField="enddate" headerText="End" width="100"/>
            <s:GridColumn dataField="presponsibility" headerText="Response" width="150"/>
            <s:GridColumn dataField="pcarer" headerText="Carer" width="110"/>
            <s:GridColumn dataField="kworker" headerText="Worker" width="110"/>
            <s:GridColumn dataField="kteam" headerText="Team" width="110"/>
        </s:ArrayList>
        </s:columns>
    </s:DataGrid>`

The Result (Notice how the height doesnt fit the 3 rows, it adds space at the bottom)!enter image description here

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

情魔剑神 2024-11-14 04:15:03

让数据网格仅显示添加的数据并非不可能,但这不是我会做的,特别是对于移动应用程序。

就个人而言,我会使用包裹在高度/宽度 100% 的 Scroller 中的 DataGroup(使用 virtualLayout=true)(仅在数据“溢出”时显示)。 DataGroups 默认设置为显示所有数据。您必须为数据创建自己的项目渲染器,并且可以创建自己的“标题”。

通过这样做,您将从网格中删除许多功能,但这是移动应用程序中很少使用的功能。另外,如果您创建数据组,您可以添加自己的触摸功能和手势来执行操作,同时保持网格的“权重”较低,以提供良好的用户体验。

It's not impossible to make the datagrid show only the data that's added, but it's not what I would do, especially for a mobile application.

Personally, I would use a DataGroup (using virtualLayout=true) wrapped in a Scroller set to height/width 100% (which would only show when the data 'overflows'). The DataGroups default settings to show all data. You'll have to create your own item renderers for the data and can create your own 'headers'.

By doing this, you're removing a lot of functionality from the grid, but it's something that's rarely used in mobile applications. Plus, if you create the datagroup, you can add your own touch functionality and gestures to do things, while keeping the 'weight' of the grid low to give a good user experience.

你的心境我的脸 2024-11-14 04:15:03

使用宽度=“100%”和高度=“100%”

use width="100%" and height="100%"

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文