Прямоугольник, нарисованный с графикой, отображается под фоном BorderContainer

#apache-flex #drawing

#apache-flex #рисунок

Вопрос:

В гибком компоненте, который наследуется от BorderContainer, я переопределяю функцию updateDisplayList для рисования прямоугольника:

 override protected function updateDisplayList(unscaledWidth : Number, unscaledHeight : Number) : void
{
    this.graphics.clear();
    super.updateDisplayList(unscaledWidth, unscaledHeight); // If ommited the rect is shown properly
    drawRects(); // Just calls graphics.drawRoundedRect
}
  

Проблема в том, что прямоугольники, которые я рисую, отображаются под белым фоном контейнера, а не рисуются поверх него. Если я удалю вызов super.updateDisplayList, я увижу, что прямоугольник нарисован правильно. Что я делаю не так?

Ответ №1:

Да, использование graphics API всегда будет отображать фактический спрайт ниже всего. Вместо использования графики используйте искровые примитивы, такие как Rect .

AS3:

 var rect:Rect = new Rect();
rect.id = "backgroundRect";
rect.fill = new SolidColor();
rect.fill.color = 0xFFFFFF;
addElement(rect);
  

MXML:

 <s:Rect id="backgroundRect" left="0" right="0" top="0" bottom="0"  >
    <s:fill>
        <s:SolidColor color="#FFFFFF"/>
    </s:fill>
</s:Rect>
  

РЕДАКТИРОВАТЬ: если вы не используете Spark, то, я думаю, решением было бы использовать облегченный графический компонент (извините за расплывчатость, мои знания MX действительно ограничены) и вместо этого использовать графический API для этого компонента. Таким образом, порядок воспроизведения должен работать.

Комментарии:

1. Я боюсь, что Spark — это не вариант. Мне нужно очень быстро нарисовать тысячи прямоугольников. Какой облегченный компонент вы имели в виду?

2. Как я уже сказал, я не знаком с компонентами MX, но самый простой из объектов отображения, который реализует IVisualElement, подойдет просто отлично. Может быть, mx: Container или mx: UIComponent?

3. UIComponent является самым легким компонентом. Далее вам придется иметь дело со спрайтом, который плохо обрабатывается Flex.

Ответ №2:

OP здесь. Кажется, что при перемещении кода рисования в оболочку моего компонента все работает так, как ожидалось.