百叶窗特效

effects\Blinds.as

JScript code

   
   

    
    
package effects
{
    
    import effects.effectClasses.BlindsInstance;
    
    import mx.controls.scrollClasses.ScrollBarDirection;
    import mx.effects.IEffectInstance;
    import mx.effects.TweenEffect;
    
    public class Blinds extends TweenEffect
    {
        
        private static 
    
    var
    
     AFFECTED_PROPERTIES:Array 
    
    =
    
     [
    
    "
    
    mask
    
    "
    
    ];
        
        public 
    
    function
    
     Blinds(target:Object
    
    =
    
    null
    
    )
        {
            super(target);
            instanceClass 
    
    =
    
     BlindsInstance;
        }
        
        public 
    
    var
    
     direction:String 
    
    =
    
     ScrollBarDirection.VERTICAL;
        
        public 
    
    var
    
     blindsFrom:Number;
        
        public 
    
    var
    
     blindsTo:Number;
        
        public 
    
    var
    
     gapFrom:Number;
        
        public 
    
    var
    
     gapTo:Number;
        
        override public 
    
    function
    
     getAffectedProperties():Array
        {
            
    
    return
    
     AFFECTED_PROPERTIES;
        }
        
        override protected 
    
    function
    
     initInstance(instance:IEffectInstance):
    
    void
    
    
        {
            super.initInstance(instance);
            
    
    var
    
     blindsInstance:BlindsInstance 
    
    =
    
     BlindsInstance(instance);
            blindsInstance.direction 
    
    =
    
     direction;
            blindsInstance.blindsFrom 
    
    =
    
     blindsFrom;
            blindsInstance.blindsTo 
    
    =
    
     blindsTo;
            blindsInstance.gapFrom 
    
    =
    
     gapFrom;
            blindsInstance.gapTo 
    
    =
    
     gapTo;
        }
        
    }
    
}

   
   

effects\effectClasses\BlindsInstance.as

JScript code

   
   

    
    
package effects.effectClasses
{
    
    import flash.display.DisplayObject;
    import flash.display.Sprite;
    
    import mx.controls.scrollClasses.ScrollBarDirection;
    import mx.effects.effectClasses.TweenEffectInstance;
    
    public class BlindsInstance extends TweenEffectInstance
    {
        
        public 
    
    function
    
     BlindsInstance(target:Object)
        {
            super(target);
        }
        
        public 
    
    var
    
     direction:String 
    
    =
    
     ScrollBarDirection.VERTICAL;
        
        public 
    
    var
    
     blindsFrom:Number;
        
        public 
    
    var
    
     blindsTo:Number;
        
        public 
    
    var
    
     gapFrom:Number;
        
        public 
    
    var
    
     gapTo:Number;
        
        override public 
    
    function
    
     play():
    
    void
    
    
        {
            super.play();
            
    
    if
    
     (isNaN(blindsFrom))
                blindsFrom 
    
    =
    
     
    
    30
    
    ;
            
    
    if
    
     (isNaN(blindsTo))
                blindsTo 
    
    =
    
     
    
    30
    
    ;
            
    
    if
    
     (isNaN(gapFrom))
                gapFrom 
    
    =
    
     
    
    100
    
    ;
            
    
    if
    
     (isNaN(gapTo))
                gapTo 
    
    =
    
     
    
    0
    
    ;
            blindsFrom 
    
    =
    
     Math.max(Math.min(blindsFrom, 
    
    100
    
    ), 
    
    0
    
    );
            blindsTo 
    
    =
    
     Math.max(Math.min(blindsTo, 
    
    100
    
    ), 
    
    0
    
    );
            gapFrom 
    
    =
    
     Math.max(Math.min(gapFrom, 
    
    100
    
    ), 
    
    0
    
    );
            gapTo 
    
    =
    
     Math.max(Math.min(gapTo, 
    
    100
    
    ), 
    
    0
    
    );
            tween 
    
    =
    
     createTween(
    
    this
    
    , [blindsFrom, gapFrom], [blindsTo, gapTo], duration);
        }
        
        override public 
    
    function
    
     onTweenUpdate(value:Object):
    
    void
    
    
        {
            setBlindsMask(value[
    
    0
    
    ], value[
    
    1
    
    ]);
        }
        
        override public 
    
    function
    
     onTweenEnd(value:Object):
    
    void
    
    
        {
            setBlindsMask(value[
    
    0
    
    ], value[
    
    1
    
    ]);
            super.onTweenEnd(value);    
        }
        
        private 
    
    function
    
     setBlindsMask(blinds:Number, gap:Number):
    
    void
    
    
        {
            
    
    var
    
     currentTarget:DisplayObject 
    
    =
    
     target as DisplayObject;
            
    
    if
    
     (
    
    !
    
    currentTarget)
                
    
    return
    
    ;
            
    
    var
    
     mask:Sprite 
    
    =
    
     
    
    new
    
     Sprite();
            
    
    var
    
     targetWidth:Number 
    
    =
    
     currentTarget.width;
            
    
    var
    
     targetHeight:Number 
    
    =
    
     currentTarget.height;
            
    
    var
    
     length:Number 
    
    =
    
     
    
    0
    
    ;
            
    
    var
    
     gapLength:Number 
    
    =
    
     
    
    0
    
    ;
            
    
    var
    
     currentOffset:Number 
    
    =
    
     
    
    0
    
    ;
            
    
    var
    
     i:
    
    int
    
     
    
    =
    
     
    
    0
    
    ;
            mask.graphics.clear();
            mask.graphics.beginFill(
    
    0x000000
    
    , 
    
    1
    
    );
            
    
    if
    
     (direction 
    
    ==
    
     ScrollBarDirection.VERTICAL)
            {
                blinds 
    
    =
    
     (targetHeight 
    
    /
    
     
    
    2
    
    ) 
    
    *
    
     (blinds 
    
    /
    
     
    
    100
    
    );
                length 
    
    =
    
     (blinds 
    
    ==
    
     
    
    0
    
     
    
    ?
    
     targetHeight : Math.floor(targetHeight 
    
    /
    
     blinds));
                gapLength 
    
    =
    
     Math.round((length 
    
    /
    
     
    
    2
    
    ) 
    
    *
    
     (gap 
    
    /
    
     
    
    100
    
    ));
                
    
    for
    
     (i 
    
    =
    
     
    
    0
    
    ; i 
    
    <
    
     blinds; i
    
    ++
    
    )
                {
                    mask.graphics.drawRect(
    
    0
    
    , currentOffset, 
                            targetWidth, Math.max(length 
    
    -
    
     gapLength, 
    
    0
    
    ));
                    currentOffset 
    
    =
    
     currentOffset 
    
    +
    
     length;
                }
                
    
    if
    
     (currentOffset 
    
    <
    
     targetHeight)
                    mask.graphics.drawRect(
    
    0
    
    , currentOffset, 
                            targetWidth, targetHeight 
    
    -
    
     currentOffset);
            }
            
    
    else
    
    
            {
                blinds 
    
    =
    
     (targetWidth 
    
    /
    
     
    
    2
    
    ) 
    
    *
    
     (blinds 
    
    /
    
     
    
    100
    
    );
                length 
    
    =
    
     (blinds 
    
    ==
    
     
    
    0
    
     
    
    ?
    
     targetWidth : Math.floor(targetWidth 
    
    /
    
     blinds));
                gapLength 
    
    =
    
     Math.round((length 
    
    /
    
     
    
    2
    
    ) 
    
    *
    
     (gap 
    
    /
    
     
    
    100
    
    ));
                
    
    for
    
     (i 
    
    =
    
     
    
    0
    
    ; i 
    
    <
    
     blinds; i
    
    ++
    
    )
                {
                    mask.graphics.drawRect(currentOffset, 
    
    0
    
    , 
                            Math.max(length 
    
    -
    
     gapLength, 
    
    0
    
    ), targetHeight);
                    currentOffset 
    
    =
    
     currentOffset 
    
    +
    
     length;
                }
                
    
    if
    
     (currentOffset 
    
    <
    
     targetWidth)
                    mask.graphics.drawRect(currentOffset, 
    
    0
    
    , 
                            targetWidth 
    
    -
    
     currentOffset, targetHeight);
            }
            mask.graphics.endFill();
            currentTarget.mask 
    
    =
    
     mask;
        }
        
    }
    
}

   
   

Test.mxml

XML code

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
				xmlns:mx="library://ns.adobe.com/flex/mx"
				xmlns:effect="effects.*" 
				width="100%"
				height="100%"
				backgroundColor="#2D8B21"
				>
	
	<fx:Declarations>
		<effect:Blinds id="hBlinds" 
					   direction="horizontal" duration="1000" 
					   blindsFrom="10" blindsTo="10" gapFrom="100" gapTo="0" />
		
		<effect:Blinds id="vBlinds" 
					   direction="vertical" duration="1000" 
					   blindsFrom="10" blindsTo="10" gapFrom="100" gapTo="0" />
	</fx:Declarations>
	
	<mx:Panel id="panel" width="100%" height="100%" title="Panel" layout="vertical">
		<mx:Label text="Label" />
		<mx:Button label="Button" />
		<mx:TextInput text="TextInput" />
		<mx:HRule width="100%" />
		<mx:Button label="Play(horizontal)" color="#FF0000" click="hBlinds.play([panel])" />
		<mx:Button label="Play(vertical)" color="#FF0000" click="vBlinds.play([panel])" />
	</mx:Panel>
	
</mx:Application>