【问题标题】:What's the best way to implement flex multiple view components?实现 flex 多视图组件的最佳方式是什么?
【发布时间】:2011-08-30 20:19:12
【问题描述】:

我正在开发一个越来越大的 Flex/AIR 应用程序,并且需要从不同的角度(即管理员、员工、用户、访客)来查看某些组件。我已经看到自己在这些组件中放置代码来处理用户可以看到和看不到的内容。但随着代码和角色变得越来越大,它变得难以管理。我想知道在组件内实现多个视图同时保持它们尽可能可重用的最佳方法是什么。

我现在在做什么:

<mx:HBox width="100%" horizontalAlign="right" visible="{_view == TS_VIEW || _view == PRJ_VIEW}"
       includeInLayout="{_view == TS_VIEW || _view == PRJ_VIEW}">
<mx:Button label="Agregar" click="button1_clickHandler(event)"
           enabled="{_state != ADDING_STATE &amp;&amp; !_loading &amp;&amp; _canAdd}"/>
</mx:HBox>

有没有更好的方法来做到这一点,也适用于 states,正如你所看到的,我对它们做了几乎同样的事情。

感谢大家的回答!

编辑 - 我正在使用 Flex 3.5,并将迁移到 Flex 4。

【问题讨论】:

    标签: apache-flex air


    【解决方案1】:

    我在自己负责的大型代码库中遇到了一些类似的问题,我一直在努力实现两个主要目标:

    • 使视图尽可能小,并通过组合重用它们
    • 分解特定于视图的代码和后端功能(数据处理、服务器端请求等)

    可重用视图

    当构建一个视图是另一个视图(可能是管理员和用户)的超集时,我一直在尝试构建由相似组件组成的单独视图。管理视图可能会“包装”用户视图并添加它需要的任何功能。当这可行时(并非总是如此),这意味着我不必处理太多状态,因为一个视图只是另一个视图的包装器。

    当包装不起作用时,我会尝试找到共同的功能部分来分别构建每个视图。

    例如:管理员和用户可能有登录控制,但没有访客。这些将是一个单独的 MXML 组件,然后我将其包含在 Admin 和 User 视图中。所有 3 个共有的其他控件可能是另一个 MXML 组件,它将包含在所有 3 个视图中。这种技术需要做更多的工作,你需要小心不要发疯(例如,每个 Flex 容器/控件都使用一个 MXML 文件),但这意味着我可以重用某些可视化组件而无需复制和粘贴。这也意味着每个视图都可以根据需要自定义它们的显示方式。

    我在我的视图中使用了继承,但只有当它们明确具有 IS-A 关系并且更改其中一个代码时,才需要更改另一个。我还使用状态来控制单个视图中的较小更改,但我尝试将它们限制在一个或两个状态,这样它就不会像你提到的那样变得非常笨拙。


    解耦功能

    我使用presenters 来帮助解耦视图与其数据的连接。每个视图都有一个 Presenter 对象,它绑定到它的数据。这使得视图中的 SCRIPT 标记非常小,因为视图只需要知道要绑定演示者中的哪些数据以及调用其控件时要调用的方法。

    这些演示者也可以在视图之间共享。

    以下是用户/管理员登录项目中的示例:

    ------------------
    | User View      |        -----------------------       ---------------
    |   Login Button |------- | Presenter           |       | Model/      |
    ------------------        | Login Click Handler |-------| Controller/ |
                              -----------------------       | ...         |
                                       |                    ---------------
    ------------------                 |
    | Admin View     |                 |
    |   Login Button |------------------
    ------------------
    

    User 和 Admin 视图相当简单:它们是可视控件(HBox、滑块、按钮等)的集合,用 MXML 编写,我可以管理尽可能少的 ActionScript 代码(尽管它们通常有一些)。每个都被赋予一个演示者对象(用 ActionScript 编写并由框架注入),它具有视图可以调用的可绑定属性/数据和函数。演示者还能够以某种方式将属性/数据的更改中继到应用程序的后端(例如,通过控制器、事件等)。它们通过其可绑定的属性/数据将数据的任何更新转发回视图。

    为了促进这一点,我一直在使用Parsley,尽管有许多other 框架也有助于这种类型的解耦。

    这使得创建新视图相当容易,因为后端功能主要是编写的。如果没有写出来,我会针对我正在创建的视图编写一个新的演示者,或者尝试通过继承或组合重用现有的演示者。


    我认为这将使迁移到 Flex 4 变得更容易一些(我正在推动我们的项目尽快完成):所有与视图相关的主要更改都应该限制在 MXML 文件中,并且演示者应该更改很少。除了在视图中,我不会追逐需要在任何地方更改的视觉组件。

    这里有两篇很好的文章也讨论了分解视图:

    【讨论】:

    • 这两篇文章太棒了!非常感谢您让我朝着正确的方向前进,我的代码打破了 AS3 中的所有“最佳实践”规则,而我实际上并不知道。希望我们能及时重构和迁移。
    【解决方案2】:

    您想使用 Flex 视图中内置的状态管理系统。

    看到这个article about using states

    【讨论】:

    • 我正在使用 flex 3.5 希望迁移到 flex 4,所以您的解决方案与我现在正在做的类似,但我仍然不觉得它可以轻松扩展更多视图和更多状态(将在未来的开发过程中出现)
    猜你喜欢
    • 2018-05-16
    • 2012-03-31
    • 2010-12-14
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-10-26
    • 1970-01-01
    • 2023-03-09
    相关资源
    最近更新 更多