`
mmk12333
  • 浏览: 33454 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

flex 加载数据时的动画效果

    博客分类:
  • flex
阅读更多

//

package hxht.comps.round
{
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.geom.Point;
    import flash.text.TextField;

    import mx.core.UIComponent;

    /**
     *
     * @author Administrator
     */
    public class RoundLavel extends UIComponent
    {
        /**
         * 加载效果动画类
         * @param width
         * @param height
         * @param roudr
         * @param showPross
         * @param loadtext
         * @param textposition
         */
        public function RoundLavel(width:Number = 100, height:Number = 100, roudr:Number = 40, showPross:Boolean = false, loadtext:String = "", textposition:String = "bottom")
        {
            super();
            roudR = 40;
            this.width = width;
            this.height = height;
            this.loadText = loadtext;
            this.textPosition = textposition;
            showProssText = showPross;
            this.addEventListener(Event.ENTER_FRAME, farmeHandler);
        }

        private var dfff:Boolean = true;

        /**
         *
         * @default
         */
        public var color:uint = 0x0000ff;

        /**
         *
         * @default
         */
        public var colorAlpha:Number = .6;

        /**
         *
         * @default
         */
        public var roudR:Number = 40;

        private var loadText:String = "";

        /**
         *
         * @default
         */
        public var arrd:Array = [ 345, 26, 60, 100, 140, 180, 220, 260 ];

        private var dddd:Number = 2;

        private var u:UIComponent;

        private var _sprit:Sprite;

        /**
         *
         * @default
         */
        public var speed:Number = 24;

        private var _text:TextField;

        private var showProssFlag:Boolean = false;

        private var textPosition:String = "bottom";

        private var playTime:int = 0;

        private var rounds:Vector.<Sprite> = new Vector.<Sprite>();


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

        /**
         *
         * @param v
         */
        public function set showProssText(v:Boolean):void
        {
            showProssFlag = v;
            if (showProssFlag)
            {
                _text = new TextField();
                _text.mouseEnabled = false;
                this.addChild(_text);
                updateText();
            }
        }

        /**
         *
         * @param v
         */
        public function set label(v:String):void
        {
            this.loadText = v;
            updateText();
        }

        /**
         *
         * @return
         */
        public function get label():String
        {
            return loadText;
        }

        /**
         *
         */
        protected function updateText():void
        {
            if (_text != null)
            {
                _text.text = loadText;
                _text.width = _text.textWidth;
                _text.x = (this.width - _text.textWidth) / 2;
                _text.y = roudR + (roudR - 20) + 10;
            }
        }

        override protected function createChildren():void
        {
            super.createChildren();
            drawRound();
        }

        /**
         *
         */
        protected function drawRound():void
        {
            this.graphics.clear();

            var p:Point;
            var _round:Sprite;
            var _r:Number;

            for (var i:int = 0; i < arrd.length; i++)
            {
                p = getPointOnScrile(roudR, roudR, (roudR - 20), arrd[i]);

                _round = new Sprite();
                _r = (dddd * (1 + i * 0.2));
                _round.graphics.beginFill(color, colorAlpha);
                _round.graphics.drawCircle(_r, _r, _r);
                _round.graphics.endFill();
                _round.x = p.x - _r;
                _round.y = p.y - _r;
                rounds.push(_round);

                this.addChild(_round);
            }
        }

        /**
         *
         */
        protected function updateRound():void
        {
            var p:Point;
            var _round:Sprite;
            var _r:Number;
            for (var i:int = 0; i < arrd.length; i++)
            {
                p = getPointOnScrile(roudR, roudR, (roudR - 20), arrd[i]);

                _round = rounds[i];
                _r = (dddd * (1 + i * 0.2));
                _round.x = p.x - _r;
                _round.y = p.y - _r;
            }
        }

        /**
         *
         */
        public function play():void
        {
            dfff = true;
            this.visible = true;
            playTime = 0;
        }

        /**
         *
         */
        public function stop():void
        {
            dfff = false;
            playTime = 0;
            this.visible = false;
        }

        /**
         *
         * @param v
         */
        public function set playFlag(v:Boolean):void
        {
            if (v)
                play();
            else
                stop();
        }

        /**
         *
         * @return
         */
        public function get isPlay():Boolean
        {
            return dfff;
        }

        /**
         *
         * @return
         */
        public function get playCountTime():int
        {
            return playTime * 24;
        }

        /**
         *
         * @param e
         */
        protected function farmeHandler(e:Event):void
        {
            if (dfff && this.initialized)
            {
                playTime++;
                var len:int = arrd.length;
                for (var i:int = 0; i < len; i++)
                {
                    arrd[i] += speed;
                    if (arrd[i] > 360)
                    {
                        arrd[i] = (arrd[i] - 360);
                    }
                }
                updateRound();
            }
        }


        /**
         *
         * @param x
         * @param y
         * @param r
         * @param angle
         * @return
         */
        protected function getPointOnScrile(x:Number, y:Number, r:Number, angle:Number):Point
        {
            var _angle:Number = angle * Math.PI / 180;
            var _re:Point = new Point();
            _re.x = x + r * Math.cos(_angle);
            _re.y = y - r * Math.sin(_angle);

            return _re;
        }

    }
}

 

//

<?xml version="1.0" encoding="utf-8"?>
<s:BorderContainer xmlns:fx="http://ns.adobe.com/mxml/2009"
       xmlns:s="library://ns.adobe.com/flex/spark"
       xmlns:mx="library://ns.adobe.com/flex/mx"
       width="100%"
       height="100%"
       styleName="loadingmask"
       visible="{loadingFlag}"
       includeInLayout="{loadingFlag}"
       xmlns:round="hxht.comps.round.*">
 <fx:Script>
  <![CDATA[
   [Bindable]
   public var loadingFlag:Boolean=false;

   [Bindable]
   public var label:String="";
  ]]>
 </fx:Script>
 <round:RoundLavel playFlag="{loadingFlag}"
       width="100"
       height="100"
       verticalCenter="0"
       horizontalCenter="0"
       label="{label}"/>
</s:BorderContainer>

 

// true 加载, false 不加载

<win:Loading loadingFlag="{Boolean}"/>

分享到:
评论

相关推荐

    Flex与处部的数据通信和图表

    4.1 Flex与处部的数据通信 4.1.1 使用HTTPService 4.1.2 使用WebService ...4.2.4 向图表添加动画 4.2.5 图表的综合应用 4.3 部署Flex应用程序 4.3.1 用AIR摆脱浏览器 4.3.2 创建AIR应用程序 4.3.3 导出AIR文件

    flexchartdemo

    该工程简介: 这个工程是用flex画图表...6、该工程加载的是外部数据,数据存放在一个专门的文件(data.xml)中 注:鉴于本人以前在网上下的很多demo是不完整的不能运行的,再次保证本demo是可以运行的完整工程包

    带特效的flex list

    带有动画特效的曾、删、改和查。能加载xml数据并作为数据源。

    Flash ActionScript 3.0高级动画教程

    用shader填充制作动画 指定shader的输入图片 使用shader作为滤镜 使用shader作为混合模式 总结 第十章 补间 引擎 Flash的Tween类 缓动方法 合并补间 Flex Tween类 Flex Tween类的缓动函数 5 Tween组合 Tween序列 补...

    ActionScript开发人员指南中文版

    位图示例:带动画效果的旋转的月亮 位图图像的异步解码 第章:过滤显示对象 过滤显示对象的基础知识 创建和应用滤镜 可用的显示滤镜 筛选显示对象示例:FilterWorkbench 第章:使用PixelBender着色器 PixelBender着色...

    第三代移动WEB内核小程序风口-逐浪CMS2 x3.9.3全面发布

    ■扩展:LED设计模块,支持动画等效果 ■修改:Boot4标签解析,增加font字体,基于逐浪字库的高端字体图标技术。 ■增加:Bis增加订单补录功能 ■修复:邮件页面支持name与title字段传参 ■优化:优化调整商品逻辑层 ...

    how-to-learn:学习方法

    描述: 创建设计作品的目的是巩固静态布局中的实践技能并创建动画。功能性: 用flex构建网格。 动画制作。 根据BEM使用样式。 使用符合BEM的文件系统。 元素的绝对和相对位置。 使用iframe添加外部数据源。

    Flash 反编译工具 Flash Decompiler Trillix 5.3.1400 中文汉化版.zip

    SWF文件转换为基本与标准的Flash预加载(如文件使用TLF文本)新 支持嵌入到SWF文件作为二进制数据(嵌套的SWF文件)的SWF文件新 批量反编译和转换的Flash文件 反编译EXE文件(投影机)的文件 支持内置在Flex的SWF...

    asp.net知识库

    使用microsoft.web.ui.webcontrols的TabStrip与IFame组件,达到页的切换效果 HttpModule 实现 ASP.Net (*.aspx) 中文简繁体的自动转换,不用修改原有的任何代码,直接部署即可! 服务器自定义开发二之客户端脚本回发 Web...

    emWin5用户手册(中文)

    1.11 数据类型..................................................................................................29 2 入门指南...............................................................................

Global site tag (gtag.js) - Google Analytics