在右侧面板中的Flex的标题栏添加图像4 [英] Adding an image on the right side of the title bar of a panel in Flex 4

问题描述

我试图创建一个基于火花小组一个MXML组件，我想补充的图像在标题栏的右端，使面板将有标题栏文字和小图片在右端。我使用的皮肤来定义颜色，背景填充等，但我怎么添加这个形象的标题栏右端的？ 我想使该图像cutomizable使插入组件时，无论是默认的图像，要么采用新的图像可以提供。

I'm trying to create a MXML component based on the spark Panel and I would like to add an image on the right end of the title bar, so that the panel will have a text on the title bar and a small image at the right end. I'm using a skin to define the colors, background fill etc. But how do I add this image at the right end of the title bar? I would like to make that image cutomizable so that when the component is inserted, either the default image is used or a new image can be provided.

请帮助你的想法。

推荐答案

图像组件添加到你的皮肤，给它一个id，还设置要显示的默认图像。然后创建一个ActionScript组件扩展面板。在您的自定义面板code，使用相同的名称，你把你的皮肤ID声明外观部件。现在重写partAdded功能，自定义面板，并设置为任何你喜欢的图片：

Add the image component to your skin and give it an id, also set the default image you want to show. Then create an ActionScript component extending Panel. In your custom Panel code, declare a skin part using the same name as the id you put in your skin. Now override the partAdded function in your custom Panel and set the image to whatever you like:

package mypackage
{
    import spark.components.Panel;
    import spark.primitives.BitmapImage;

    public class MyCustomPanel extends Panel
    {

        [SkinPart (required="false")]
        public var panelIcon:BitmapImage;

        override protected function partAdded(partName:String, instance:Object):void {
            super.partAdded(partName, instance);

            if (instance == panelIcon) {
                panelIcon.source = someOtherImageSource;
            }
        }
    }
}

最后，你的皮肤文件，自定义面板，联想无论是在CSS或通过设置的skinClass当您使用自定义面板。

Lastly, associate your skin file with your custom panel, either in CSS or by setting the skinClass when you use your custom panel.

这篇关于在右侧面板中的Flex的标题栏添加图像4的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！