Настройка отображения отключенных кнопок в Flex - PullRequest
Новая
       32

Настройка отображения отключенных кнопок в Flex

2 голосов
/ 11 апреля 2011

Я делаю мелочи в приложении Air, вопрос, три кнопки, после того как вы выберете одну, правая кнопка окрашивается в зеленый цвет, а неправильные - в красный.Я пытался сделать это, изменяя стили, поэтому я создал стиль Button.Right и Button.Wrong, но мне также нужно отключить кнопки, чтобы они не нажимались более одного раза, пока я показываю правильные ответы.

Так что у меня проблемы с настройкой, чтобы кнопки не выглядели сероватыми, а альфа выключена, когда я установил для их свойства enabled значение false.

Я пытаюсь бытьздесь настолько минималистично, насколько возможно, изменение disabled-overlay-alpha или disabledOverlayAlpha в файле css, похоже, не помогает, равно как и не отключение disabledBorderColor

каких-либо быстрых приемов для этого?

Ответы [ 3 ]

3 голосов
/ 11 апреля 2011

Это может быть несколько грязный обходной путь, но вы можете попробовать отключить кнопки, установив для их свойства mouseEnabled значение false, чтобы запретить им взаимодействовать с мышью.

1 голос
/ 12 апреля 2011

Я всегда использовал скины с состоянием, чтобы выполнить это. Это относительно просто, но я бы так и сделал:

CSS (путь меняется в зависимости от ваших активов): 

Button {
   skin:ClassReference('com.mysite.assets.skins.MyStatefulSkin');
}

Тогда в / com / mysite / assets / skins вы получите: 

package com.mysite.assets.skins {

    import flash.display.GradientType;
    import mx.containers.Canvas;

    public class MyStatefulSkin extends Canvas {

        import flash.display.Graphics;
        import flash.geom.Rectangle;
        import mx.graphics.GradientEntry;
        import mx.graphics.LinearGradient;

        public function MyStatefulSkin() {
            super();
        }

        protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
            super.updateDisplayList(unscaledWidth,unscaledHeight);

            var w:Number = unscaledWidth;
            var h:Number = unscaledHeight;
            var cr:Number = getStyle('cornerRadius');
            var backgroundFillColors:Array;

            var g:Graphics = graphics;
            g.clear();

            switch( name ){
                case "upSkin":
                    backgroundFillColors = [0xffffff,0xdddddd];
                    break;
                case "overSkin":
                    backgroundFillColors = [0xffffff,0xdddddd];
                    break;
                case "downSkin":
                    backgroundFillColors = [0xffffff,0xdddddd];
                    break;
                case "disabledSkin":
                    backgroundFillColors = [0xffffff,0xdddddd];
                    break;
            }

            // Draw Background
            g.beginGradientFill( GradientType.LINEAR, backgroundFillColors, [1.0,1.0], [0,255], verticalGradientMatrix( 0, 0, w, h ) );
            g.drawRoundRectComplex( 0, 0, w, h, cr, cr, cr, cr );
            g.endFill();

            // Draw other things (borders, icons, etc)

        }

    }

}

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

0 голосов
/ 11 апреля 2011

Лично я думаю, что вы должны просто расширить любой используемый компонент и добавить состояния (correctNormal, correctDisabled, falseNormal, неправильныйDisable) и просто соответствующим образом изменить состояние в зависимости от свойств, предоставленных компоненту. При этом вы можете очень легко указать, как все должно выглядеть. Было бы еще проще, если бы вы использовали Flex 4.

...