ActionScript:更改 Spark TitleWindow 的标题栏颜色
我有一个简单的疑问。我制作了一个自定义的 ActionScript mxml 组件,它是一个带有文本区域的 Spark TitleWindow,如果在文本中找到“成功”一词,则标题(标题栏)应显示绿色背景,如果没有,则显示红色背景。
我的问题是我不知道在哪里访问和修改这个属性,我发现的唯一的解决方法是将 TitleWindow 的“chromeColor”绑定到一个布尔值,该布尔值将根据我是否找到“成功”这个词。这确实将标题栏背景更改为我想要的颜色,但是,它也更改了滚动条颜色,例如,这有点令人讨厌。我的课程的代码如下:
<?xml version="1.0" encoding="utf-8"?>
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="400"
title="Output: "
chromeColor="{success ? ( 0x00ff6b as uint) : ( 0xFF0000 as uint)}"
close="closeHandler(event)">
<fx:Script>
<![CDATA[
import mx.events.CloseEvent;
import mx.managers.PopUpManager;
[Bindable]
public var success:Boolean = false;
public function setText(text:String):void
{
textContainer.text = text;
if(text.indexOf("SUCCESS")!=-1)
{
success=true;
}
}
protected function closeHandler(event:CloseEvent):void
{
PopUpManager.removePopUp(this);
}
]]>
</fx:Script>
<s:TextArea id="textContainer" x="0" y="0" width="100%" height="100%"
paddingBottom="10" paddingLeft="10" paddingRight="10" paddingTop="10"
borderVisible="false" editable="false" fontFamily="Courier New"/>
</s:TitleWindow>
所以,感谢您的阅读,并希望任何人都知道答案:)
干杯, 佩皮略
I have a simple doubt. I have made a custom ActionScript mxml component, which is a spark TitleWindow with a text area, which header (titlebar) should display a green background if it finds the word 'success' in its text, or red, if it doesn't.
My problem is that I don't know where to access and modify this property, and the only turnaround I've found is binding the 'chromeColor' of the TitleWindow to depend on a boolean that will change depending on whether I find or not the word 'success'. And this does change the TitleBar background to the color I desire, however, it also changes the scrollbar color, for example, which is a bit nasty. The code for my class is the following:
<?xml version="1.0" encoding="utf-8"?>
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="400"
title="Output: "
chromeColor="{success ? ( 0x00ff6b as uint) : ( 0xFF0000 as uint)}"
close="closeHandler(event)">
<fx:Script>
<![CDATA[
import mx.events.CloseEvent;
import mx.managers.PopUpManager;
[Bindable]
public var success:Boolean = false;
public function setText(text:String):void
{
textContainer.text = text;
if(text.indexOf("SUCCESS")!=-1)
{
success=true;
}
}
protected function closeHandler(event:CloseEvent):void
{
PopUpManager.removePopUp(this);
}
]]>
</fx:Script>
<s:TextArea id="textContainer" x="0" y="0" width="100%" height="100%"
paddingBottom="10" paddingLeft="10" paddingRight="10" paddingTop="10"
borderVisible="false" editable="false" fontFamily="Courier New"/>
</s:TitleWindow>
So, thanks for reading, and hope anyone knows the answer :)
Cheers,
pepillo
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
我会通过扩展标准组件并创建自定义皮肤来解决它。
我的组件版本:
皮肤(基于标准皮肤):
以及要测试的简单应用程序:
I'd solve it with extending standard component and creating custom skin.
My version of component:
The skin (based on standard skin):
And the simple app to test:
Flex 4 的方法是通过复制 TitleWindowSkin 的代码来创建您自己的自定义外观类,并将其更新为绿色背景。然后,您可以通过向 TitleWindow 标记添加 SkinClass 属性或在 CSS 配置中设置 SkinClass 来告诉 felx 使用自定义外观。
The Flex 4 Way to do this, would be to create your own custom skin class by copying the code of TitleWindowSkin and to update this to have a green background. You would then tell felx to use your custom skin by adding a skinClass attribute to the TitleWindow tag or by setting the skinClass in a CSS configuration.
如果使用 FlashBuilder,请创建一个从要覆盖的外观类型派生的新 MXML 外观(最好使用名为
skins
的包)。然后创建一个新的 ActionScript 类并扩展 MXML 皮肤。然后,您将完全控制皮肤,并能够在必要时扩展模板。
就我而言,我想覆盖
TitleWindow
[spark.skins.spark.TitleWindowSkin]
的皮肤(即使在移动设备上 设备)。许多对话框项(即标题栏)不可换肤,而是硬编码的。tbFill
是 TitleBar 的 ID。我能够调整 Skin 代码,将 ID 属性名称分配给标题栏渐变,并读取 Style 值来设置颜色 [在updateDisplayList
函数中]。然后使用自定义外观类的名称作为您要设置外观的项目的
skinClass
属性。总的来说,使用这种方法并不难。这是皮肤类。
在派生的 MXML 皮肤中:
If using FlashBuilder, create a new MXML Skin derived from the skin type you want to override (good to use a package named
skins
). Then create a new ActionScript class and extend the MXML skin.You will then have full control over the skin, and be able to extend the template if necessary.
In my case I wanted to override the skin of a
TitleWindow
[spark.skins.spark.TitleWindowSkin]
(even on a mobile device). Many of the Dialog items (i.e. titlebar) are not skinnable but hard coded.tbFill
is the ID of the TitleBar. I was able to adjust the Skin code to assign ID property names to the title bar gradient and read Style values to set the colors [in theupdateDisplayList
function].Then use the name of your custom skin class as the
skinClass
property of the item you are skinning.Overall it's not that difficult to do, using this method. Here is the skin class.
In the derived MXML Skin: