Как получить возможность выбора элементов списка при использовании маски png в средстве визуализации элементов в мобильном приложении Flex 4.5? - PullRequest
Новая
       22

Как получить возможность выбора элементов списка при использовании маски png в средстве визуализации элементов в мобильном приложении Flex 4.5?

0 голосов
/ 10 июня 2011

Я создаю мобильное приложение, в котором мне нужно показать календарь с месяцами вверху. Месяцы являются частью компонента, который происходит от SkinnableDataContainer (и имеет некоторую пользовательскую прокрутку / поведение - вот почему я не использовал список искры). Мне нужно, чтобы месяцы отображались в виде вкладки в форме «трапеции», поэтому я использую изображение png в качестве маски в средстве визуализации элементов для компонента.

Когда маска не применяется, все работает хорошо - рендеринг месяцев, выбор списка / контейнера данных работает, когда я нажимаю на месяц и т. Д.

Когда маска применяется, она хорошо отрисовывается, прокрутка и все остальное, кажется, работает хорошо, но когда я нажимаю на месяц, ничего не происходит визуально. И из операторов трассировки в моем коде, кажется, выбор элемента списка не меняется. Похоже, щелчки мыши не работают.

Есть идеи как это исправить?

Я искал похожие звучащие вопросы (но задаю обратное) здесь, на SO. (/1203866/ogranichit-mouseevents-dlya-maskirovki-v-flex-skin)

С уважением, Кришна

Код: 

public class TopCalendarMonthRenderer extends LabelItemRenderer {

    [Embed(source="/assets/trapezium_alpha.png")]
    private static var TrapeziumMask:Class;
    private static var trapeziumMaskInstance:BitmapAsset;

            override protected function createChildren():void {

        super.createChildren();
        setLabelProperties();

        createMask();
    }

    private function createMask():void {

        if (!this.maskShape){

            if (!trapeziumMaskInstance){
                trapeziumMaskInstance = (new TrapeziumMask()) as BitmapAsset; 
            }

            maskShape = new Sprite();

            //maskShape.visible = false;
            //maskShape.mouseEnabled = false;

            maskShape.cacheAsBitmap = true;
            this.cacheAsBitmap = true;

            this.addChild(maskShape);
            //this.hitArea = maskShape;
        }
    }

    override protected function drawBackground(unscaledWidth:Number, unscaledHeight:Number):void {
        //don't call the parent's draw: because we draw our own background

        var bgColor:uint = 0x555555;
        if (this.selected)
            bgColor = backgroundColor;

        var g:Graphics = this.graphics;
        g.beginFill(bgColor);
        g.drawRoundRectComplex(0, 0, unscaledWidth, unscaledHeight, 3, 3, 0, 0);
        g.endFill();

        //TODO: make the mask a hitArea - so the user can interact with it - HOW?
        drawMask();

    }

    private function drawMask():void {
        var g:Graphics = maskShape.graphics;
        var img:BitmapData = trapeziumMaskInstance.bitmapData;
        g.beginBitmapFill(img, null, false, true);
        //g.beginGradientFill(GradientType.RADIAL, [0xffffff, 0xff0000], [1, 0], [0, 255]);
        //g.beginFill(0xff0000);
        g.drawRect(0, 0, img.width, img.height);
        g.endFill();

        this.mask = maskShape;

        //this.hitArea = maskShape;
    }

}

1 Ответ

2 голосов
/ 11 июня 2011

Я наконец нашел это:

http://aaronhardy.com/flex/displayobject-quirks-and-tips/

Это объясняет, как установка изображения PNG в качестве альфа-маски на DisplayObject прерывает события мыши.

В этой статье также предусмотрено обходное решение, которое мне помогло:)

...