制作带有占位符的 Flex 组件的好方法是什么?
我想创建一个具有几个“洞”的组件,每次使用时都要以不同的方式填充这些“洞”。目前,我正在这样做(在本例中使用 Flex 4 框架 --- 对于 Flex 3 来说它看起来几乎相同):
public var fooComponent : IVisualElement;
public var barComponent : IVisualElement;
override protected function createChildren() : void
{
super.createChildren();
fooContainer.addElement(fooComponent);
barContainer.addElement(barComponent);
}
<Group id="fooContainer"/>
<!-- ... other components ... -->
<Group id="barContainer"/>
这很好用,但是要为如此简单的东西编写大量代码。
我想要的是这样的:
[Bindable] public var fooComponent : IVisualElement;
[Bindable] public var barComponent : IVisualElement;
<Placeholder content="{fooComponent}"/>
<!-- ... other components ... -->
<Placeholder content="{barComponent}"/>
现在,我可以自己实现 Placeholder 组件,但我不禁想知道是否没有更好的方法使用 Flex 框架中的现有工具来实现此目的。
理论上,如果有适当的编译器支持,它甚至可以归结为这样的内容:
<Placeholder id="fooComponent"/>
<!-- ... other components ... -->
<Placeholder id="barComponent"/>
I want to create a component that has a couple of "holes" that are to be filled in differently on each use. Currently, I'm doing it like this (using the Flex 4 framework in this example --- it would look almost the same for Flex 3):
public var fooComponent : IVisualElement;
public var barComponent : IVisualElement;
override protected function createChildren() : void
{
super.createChildren();
fooContainer.addElement(fooComponent);
barContainer.addElement(barComponent);
}
<Group id="fooContainer"/>
<!-- ... other components ... -->
<Group id="barContainer"/>
This works well, but it's kind of a lot of code to write for something so simple.
What I'd like is something like this:
[Bindable] public var fooComponent : IVisualElement;
[Bindable] public var barComponent : IVisualElement;
<Placeholder content="{fooComponent}"/>
<!-- ... other components ... -->
<Placeholder content="{barComponent}"/>
Now, I could implement the Placeholder component myself, but I can't help wondering if there isn't a better way to do this using the existing tools in the Flex framework.
Theoretically, with the proper compiler support, it could even be boiled down to something like this:
<Placeholder id="fooComponent"/>
<!-- ... other components ... -->
<Placeholder id="barComponent"/>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
这里是Flex3的模板组件实践。
http://livedocs.adobe.com/flex/3 /html/help.html?content=templatating_3.html
Here is template component practice for Flex3.
http://livedocs.adobe.com/flex/3/html/help.html?content=templating_3.html
我们只需要使用任何标准容器作为占位符。我们可以使用 addChild() 和removeChild() 方法来添加、删除该容器中的控件。
We just need to use any of standard containers as the placeholder. And we could use the addChild() and removeChild() methods to add, remove controls in that container.
您是否尝试过创建一个带有几个 SkinPart 的 SkinnableComponent 以及一个合适的 Skin?我想这会有所帮助。
Have you tried to create a SkinnableComponent with a couple of SkinParts, and a proper Skin for it? I guess it could help.