Flex:如何创建一个全新的组件?

时间:2009-01-28 19:44:06

标签: flex user-interface

我想为Flex开发一个网络图应用程序 - 想象一下将节点放在Canvas上并用链接连接它们。节点应具有可编辑的文本和其他UI组件。

我正在尝试从头开始创建一个全新的UI组件的示例,但我能找到的只是扩展现有组件的简单示例:例如,扩展Button的RedButton,或者是一个ComboBox有州可以选择。

我的主要问题是,什么是ActionScript方法定义组件的绘图? Java的paint()方法的ActionScript等价物是什么?

5 个答案:

答案 0 :(得分:5)

您想要创建一个覆盖updateDisplayList方法的组件,并在那里进行绘制:

override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
{
  super.updateDisplayList( unscaledWidth, unscaledHeight );

  // The drawing API is found on the components "graphics" property
  graphics.clear();
  graphics.lineTo( 0, unscaledWidth );
  // etc
}

可在此处找到更多信息:http://livedocs.adobe.com/flex/3/html/help.html?content=ascomponents_advanced_3.html

答案 1 :(得分:4)

如果您需要自定义组件的示例,我建议您查看flexlib项目。

在livingocs here

中有很好的一般信息

虽然您可以在MXML和ActionScript中创建自定义组件,但我建议您在ActionScript中实现它们。

简而言之,这就是你需要做的事情:

  

在ActionScript中创建自定义组件时,必须覆盖UIComponent类的方法。您实现了基本组件结构,构造函数以及createChildren(),commitProperties(),measure(),layoutChrome()和updateDisplayList()方法。

答案 2 :(得分:3)

我建议阅读Peter Ent关于创建自定义组件的5部分教程系列。 Here是第1部分的链接。

还推荐了关于ItemRenderersItemEditors的教程系列。

答案 3 :(得分:1)

Kazoun和Lott编程Flex 2的第19章展示了构造事件模型以及刷新事件模型。

简而言之,Flex组件结构假定您具有影响其外观的对象属性。它不是立即应用更改,而是允许属性更改器通过继承的invalidateProperties()方法使组件的“内容”(例如文本)无效。当一个属性更改,ummm,更改组件的大小,以及当需要重新绘制事物时(而不是只有不同的文本),invalidateDisplayList()也调用invalidateSize()。

此失效模型可优化组件的工作。它不会衡量自己,除非它知道它改变了大小;它不会放置并绘制自己,除非上次更新其布局时调用了invalidateDisplayList();并且它不会将其属性的值移动到其子组件中,除非它知道这些值已经更改。

干杯

答案 4 :(得分:1)

典型的行为是对现有组件进行子类化,主要是因为实现了许多最典型的组件功能的大量工作已经为您完成了 - 您只需知道哪个组件最类似于你想要创造的那个。 (鉴于其中有多少,本身就是一项挑战。)

如果你愿意,你可以“从头开始”创建一个非常简单的UIComponent,只需扩展UIComponent(它会给你所有基线的东西),或者我想,如果你是真的追求极简主义,你需要挑战,你可以实现IUIComponent,并手动定义每个界面方法。如果您确实选择了第二条路线,那么请先帮个忙listen to this talk - 这是对Flex组件架构的深入讨论,由Flex团队的一位工程师提供。我经常和高度推荐它;它非常出色,它澄清了许多组件开发细节,但仍未完全记录。如果您要构建您所描述类型的非平凡自定义组件,那将是非常有价值的东西。

希望它有所帮助。祝你好运!