2

有人告诉我，在布置孩子的位置时，使用 Canvas 与 HBox 或 VBox 相比，性能会有所提高。因此，我们的许多组件已转换为使用 Canvas。但是，现在添加了代码来根据其他子元素的宽度和高度计算某些子元素的 x 和 y 位置。如果需要添加代码来确定孩子的坐标/位置，是否值得使用 Canvas 来提高性能？除了最小化添加的 ui 组件的数量和绝对指定定位之外，是否还有更好的方法或技术可以实践？

4

3 回答 3

4

有许多中间技术，其中之一是使用渲染类型的组件，例如TileGridor ItemRenderers，如果您的布局符合某个公式。如果您使用的是表单，请尝试使用Form布局组件而不是使用自定义布局。

如果确实需要在 Flex 中使用布局引擎，优化使用的方法是记住框架使用某些技术来增加性能负载，大致遵循以下列表，最后一个是性能最密集的：

  1. 绝对定位 ( <Canvas>)
  2. 相对定位 ( <VBox>)
  3. 基于约束的定位 ( right=0)
  4. 先进的基于约束的定位 ( <constraintColumns>)

使用相对定位通常不是性能密集型的。如果您发现是这样，则可能是您使用了太多嵌套容器。查看您的布局架构并尝试找出您的对象可能“重叠”的方式，并简化它们。一个很好的工具是 FlexSpy，它可以让您在运行时内省对象布局。

另一个常见的性能瓶颈是您的应用程序试图在您的 GUI 试图响应用户交互的同时进行一些数字运算。尽管目前不存在使您能够在单独的“线程”中运行 UI 和逻辑的绿色线程框架，但您可以使用良好的架构框架，例如 Cairngorm 或 Mate（有很多），它使用命令而不是直接方法，所以可能占用处理周期的功能执行会一直等待，直到 UI 完成对用户的响应。

于 2009-05-22T23:11:16.273 回答
2

在优化 Flex UI 时需要牢记以下几点：

  1. 避免容器过度嵌套。考虑在嵌套大量 HBox / VBox 元素上使用具有绝对或基于约束的定位的 Canvas。然而这并不意味着你永远不应该使用 VBox/HBox。可以混搭，比如用一个Canvas作为主容器，根据需要在里面放置子Box，尽量避免嵌套过多。

  2. 在自定义组件中正确使用 UIComponent 模型。特别是，使用 invalidateProperties()、invalidateSize() 和 invalidateDisplayList()，以便在 Flash Player 的最佳时间调用它们的配套函数（commitProperties()、measure() 和 updateDisplayList()）。Deepa 在这里对此进行了精彩的讨论：

http://tv.adobe.com/#vi+f15384v1002

她解释了如何大量使用失效方案允许 Flash Player 在理想的时间执行您的代码，即不在屏幕更新的中间。所有 Flex 组件都使用这些原则，无论使用何种框架，都可以/应该利用这些原则。

于 2009-05-23T02:01:23.183 回答
1

为了确保我理解：

  • 你听说 Canvas 可以比 [VH]Box 更快地定位子元素
  • Canvas 只做绝对定位
  • 您的某些（很多？）组件具有绝对位置，因此您切换到使用 Canvas
  • 但是你的一些组件是有相对位置的，所以你需要编写代码来定位它们

那是对的吗？

无论如何，假设我是正确的（可能不是这样），您要做的第一件事是选择需要最少代码行的功能接口，然后确定它是否“足够好”。您想要代码行数最少的那个，因为研究表明代码行数和错误数量之间存在相关性（并且您不想要错误）。你想看看它是否“足够好”，因为如果它“足够好”，你不需要做任何事情（如果你尝试让它更快，你就是在提交Premature Optimization）。

但这可能不是你想听到的:)

所以我也建议，如果你想坚持使用基于 Canvas 的布局，你可以尝试将所有相对定位的内容粘贴在 [VH]Boxes 中，然后绝对定位在 Canvas 中。Adobe 编写的代码很有可能比代码更快，因此您应该尝试利用它。

但唯一能确定的方法是尝试并分析它。

于 2009-05-22T21:50:53.937 回答