Как добавить элементы управления в строку заголовка гибкой панели?

Question

Я пытаюсь реализовать складное всплывающее окно TitleWindow, добавив маркер в верхний правый угол элемента управления Panel.К сожалению, изображение, которое я добавляю как дескриптор, не отображается при отрисовке элемента управления.Я могу вызвать перерисовку, изменив источник изображения, так что, очевидно, оно есть, но оно как-то скрыто.

Есть ли способ сделать этот элемент управления изображением видимым для пользователя?

Вот код для окна:

package
{
    import mx.containers.Panel;
    import mx.controls.Image;

    public class CollapsableWindow extends Panel
    {
        public function CollapsableWindow()
        {
            super();
        }

        public var close:Image;

        protected override function createChildren():void
        {
            super.createChildren();
            close = new Image();
            close.source = "/assets/close.png";
            close.x = this.width - 20;
            close.y = 8;
            this.titleBar.addChildAt(close, 0);
        } 

    }
}

Answer 1

Вам нужно создать свою кнопку в методе createChildren, затем поместить ее в метод updateDisplayList:

    /**
     * Creates the button and adds it to the titlebar
     */
    override protected function createChildren():void 
    {
        super.createChildren();

        this.myButton = new Button();
        this.myButton.addEventListener(MouseEvent.CLICK, onButtonClick);
        this.titleBar.addChild(this.myButton);
    }

    /**
     * Sizes and positions the button on the titlebar
     */
    override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void 
    {
        super.updateDisplayList(unscaledWidth, unscaledHeight);

        this.myButton.setActualSize(myButton.getExplicitOrMeasuredWidth(),
                                       myButton.getExplicitOrMeasuredHeight());

        // Position the button 
        var y:int = 4;
        var x:int = this.width - this.myButton.width - 2;
        this.myButton.move(x, y);
    }   

Answer 2

У меня были проблемы с тем, что PNG не отображается в нашем приложении. Время от времени все наши PNG исчезают. Чтобы проверить, не страдает ли ваш код той же проблемой, попробуйте использовать тестовое изображение в формате GIF или другой формат. Если это работает, то у вас та же проблема, с которой я сталкивался десятки раз.

В нашем проекте мы решаем это двумя способами:

1. Обходной путь . Переключить SDK-версию вашего проекта и по какой-то странной причине это исправляет
   • Так, например, мы используем SDK 3.6
   • Я щелкаю правой кнопкой мыши по проекту, выбираю свойства и перехожу в раздел Flex SDK
   • Оттуда я переключаюсь на ЛЮБУЮ ДРУГУЮ версию SDK (скажем, Flex 3.2) и выбираю ok
   • Это запускает автоматическую сборку (с какой-то загадочной силой PNG-фиксации)
   • Затем я возвращаюсь в свойства проекта и возвращаю его в нашу версию.
   • 8 раз из 10 восстанавливает изображения PNG
   • Это работало, даже когда мы использовали Flex SDK 3.4 и 3.5
2. Исправление. Измените формат PNG на PNG-24
   • Кажется, корень проблемы связан с использованием формата PNG-8
   • Для наших изображений я открываю оригинал в Photoshop, нажимаю CMD-Shft-Ctrl-S, вызывая «Save For Web ...»
   • Затем я выбираю PNG-24 для формата вместо PNG-8
   • Аналогичный процесс должен работать в любой другой программе для редактирования изображений

Надеюсь, это поможет,

- gMale