Question

我遇到了这段代码，这引起了我的兴趣。我之前没见过这样的皮肤。我想知道它是否有任何缺点和替代方案。例如，像addChild调用那样cpu密集吗？

<s:Button id="loginoutBtn" right="10" top="10" label="Log out" label.loggedout="Log in" skinClass.loggedin="skins.FBLogoutButtonSkin" skinClass.loggedout="skins.FBLoginButtonSkin" click.loggedin="logout()" click.loggedout="login()"/>

背景：上面的按钮是Login示例的一部分。我经常使用皮肤，但这个过程几乎总是会产生一个与新皮肤搭配的新组件。另外，ToggleButton会是一个很好的用例吗？

更好的问题是，如果你必须在x y位置有一个登录和注销按钮，你会怎么做？

我认为在这种情况下，我会将两个按钮设置为相关的皮肤，并为每个皮肤设置一个includeIn，所以，

<s:Button id="loginBtn" includeIn="loggedIn" right="10" top="10" skinClass="skins.FBLoginButtonSkin" click="login()"/>

<s:Button id="logoutBtn" includeIn="loggedOut" right="10" top="10" skinClass="skins.FBLogoutButtonSkin" click="logout()" />

Answer 1

您可以选择两个按钮或一个按钮来更改属性。要查看性能的影响差异，您可能希望保留生成的AS3代码。有关详细信息，请参阅此链接。

http://saravananrk.wordpress.com/2008/05/26/keep-generated-actionscript-in-flex/

这两种方法都有效，但我更喜欢两种不同的按钮，因为它们将来可能会发生变化，变得越来越不同。一个按钮的所有属性都基于状态，没有多大意义。可能还有两个按钮，它可以保持代码清洁。

Answer 2

在这种特殊情况下，我会选择带有自定义皮肤的ToggleButton。

为什么？

只需要一个自定义皮肤而不是两个
'host'组件中的清洁代码：不需要两个按钮或一堆与状态相关的属性;只是'被选中'需要被绑定到州。
因为您已经问过：可能是CPU密集度较低的选项（因为A.只有一个Button和B.只有一个皮肤）。但说实话，我认为无论如何它真的无关紧要：单个Button的性能确实无关紧要。

<s:ToggleButton id="loginBtn" selected.loggedin="true" selected.loggedout="false"
                skinClass="skins.FBLoginToggleButtonSkin" 
                click="logInOrOut(loginBtn.selected)" />

注意：两个标签将在自定义ToggleButtonSkin中定义：

<s:Label text="log in" text.selectedStates="log out" />

通过文档状态在Flex中为按钮设置外观

2 个答案: