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

一个flex进度条

    博客分类:
  • flex
阅读更多
package com.iman.sps.sheet.ascript
{
	import flash.display.Sprite;
	import flash.display.*; 
	import flash.events.*; 
	import flash.filters.BitmapFilterQuality; 
	import flash.filters.BlurFilter; 
	import flash.geom.Matrix; 
	import flash.net.*; 
	import flash.text.TextField; 
	import flash.utils.*; 
	import flash.system.Capabilities; 
	
	import mx.events.*; 

	import mx.preloaders.IPreloaderDisplay;
	
	public class MyProgressBar extends Sprite implements IPreloaderDisplay
	{
		[Embed(source="../image/logo.gif", mimeType="application/octet-stream")] 
		public var _loadingLogo:Class; 
		
		private var dpbImageControl:Loader; 
		private var _barSprite:Sprite; 
		private var progressText:TextField;        
		private var ProgressBarSpritIsAdded:Boolean = false; 

		public function MyProgressBar()
		{
			super();
		}
		
		// Specify the event listeners. 
		public function set preloader(preloader:Sprite):void { 
			//Listen for 正在下载 
			preloader.addEventListener(ProgressEvent.PROGRESS, handleProgress); 
			//Listen for 下载完成 
			preloader.addEventListener(Event.COMPLETE, handleComplete); 
			//Listen for 正在初始化 
			preloader.addEventListener(FlexEvent.INIT_PROGRESS, handleInitProgress); 
			//Listen for 初始化完成 
			preloader.addEventListener(FlexEvent.INIT_COMPLETE, handleInitComplete); 
		} 
		
		// Initialize the Loader control in the override 
		// of IPreloaderDisplay.initialize(). 
		public function initialize():void { 
			//添加logo图 
			dpbImageControl = new Loader();       
			dpbImageControl.contentLoaderInfo.addEventListener(Event.COMPLETE, loader_completeHandler); 
			dpbImageControl.loadBytes(new _loadingLogo() as ByteArray); 
			//dpbImageControl.load(new URLRequest("loadinglogo.swf")); 
		} 
		
		
		// After the SWF file loads, set the size of the Loader control. 
		private function loader_completeHandler(event:Event):void 
		{         
			addChild(dpbImageControl); 
			dpbImageControl.width = 136; 
			dpbImageControl.height= 54; 
			dpbImageControl.x = this.stage.stageWidth/2 - dpbImageControl.width/2; 
			dpbImageControl.y = this.stage.stageHeight/2 - dpbImageControl.height/2 - 40; 
		}   
		
		// 
		private function addProgressBarSprit():void{ 
			//绘制背景渐变 
			var matrix:Matrix=new Matrix(); 
			matrix.createGradientBox(this.stage.stageWidth,this.stage.stageHeight,Math.PI/2); 
			var colors:Array=[0x3399ff,0xFFFFFF]; 
			var alphas:Array=[1,1]; 
			var ratios:Array=[0,255]; 
			this.graphics.lineStyle(); 
			this.graphics.beginGradientFill(GradientType.LINEAR,colors,alphas,ratios,matrix);        
			this.graphics.drawRect(0,0,this.stage.stageWidth,this.stage.stageHeight); 
			this.graphics.endFill(); 
			
			//绘制中心白色发光 
			var _Sprite1:Sprite = new Sprite(); 
			addChild(_Sprite1); 
			_Sprite1.graphics.beginFill(0xffffff,0.45); 
			_Sprite1.graphics.drawEllipse(this.stage.stageWidth/2-130, this.stage.stageHeight/2-90, 280, 100); 
			_Sprite1.graphics.endFill(); 
			//滤镜实现发光边缘柔和            
			var blur:BlurFilter = new BlurFilter(); 
			blur.blurX = 100; 
			blur.blurY = 50; 
			blur.quality = BitmapFilterQuality.HIGH; 
			_Sprite1.filters = [blur]; 
			
			//------------------------------------------------- 
			
			//绘制进度条背景 
			var _Sprite2:Sprite = new Sprite(); 
			addChild(_Sprite2); 
			_Sprite2.graphics.lineStyle(1, 0xCCCCCC); 
			_Sprite2.graphics.beginFill(0xFFFFFF); 
			_Sprite2.graphics.drawRect((this.stage.stageWidth/2 - 152), (this.stage.stageHeight/2 - 10), 304, 20);   
			_Sprite2.graphics.endFill(); 
			
			//------------------------------------------------- 
			
			//加载进度条Sprite 
			_barSprite = new Sprite(); 
			addChild(_barSprite); 
			_barSprite.x = this.stage.stageWidth/2 - 150; 
			_barSprite.y = this.stage.stageHeight/2 - 8; 
			
			//------------------------------------------------- 
			
			//加载进度条文字 
			progressText = new TextField(); 
			addChild(progressText); 
			progressText.textColor = 0x333333; 
			progressText.width = 300; 
			progressText.height = 18; 
			progressText.x = this.stage.stageWidth/2 - 152; 
			progressText.y = this.stage.stageHeight/2 + 20; 
		} 
		
		//刷新进度条 
		private function drawProgressBar(bytesLoaded:Number, bytesTotal:Number):void 
		{   
			if (_barSprite != null && progressText != null){ 
				var g:Graphics = _barSprite.graphics; 
				g.clear(); 
				g.beginFill(0xCCCCCC); 
				g.drawRect(0, 0, 300*(bytesLoaded/bytesTotal),16);   
				g.endFill();    
				
				var matrix:Matrix=new Matrix(); 
				matrix.createGradientBox(300*(bytesLoaded/bytesTotal),16,Math.PI/2); 
				var colors:Array=[0x0099CC,0x99cc77]; 
				var alphas:Array=[1,1]; 
				var ratios:Array=[0,255]; 
				g.lineStyle(); 
				g.beginGradientFill(GradientType.LINEAR,colors,alphas,ratios,matrix);        
				g.drawRect(0,0,300*(bytesLoaded/bytesTotal),16); 
				g.endFill();  
				
				
			} 
		} 
		
		//正在下载的进度 
		private function handleProgress(event:ProgressEvent):void { 
			//第一次处理时绘制进度条Sprit 
			if (ProgressBarSpritIsAdded == false){ 
				ProgressBarSpritIsAdded = true; 
				addProgressBarSprit(); 
			} 
			
			if (progressText != null){ 
				progressText.text = "下载进度:已下载 " + event.bytesLoaded + " byte,总大小 " + event.bytesTotal + " byte."; 
			}         
			drawProgressBar(event.bytesLoaded, event.bytesTotal); 
		} 
		
		private function handleComplete(event:Event):void { 
			if (progressText != null){ 
				progressText.text = "下载完成."; 
			} 
			drawProgressBar(1,1);        
		} 
		
		private function handleInitProgress(event:Event):void { 
			if (progressText != null){ 
				progressText.text = "正在初始化..."; 
			} 
			drawProgressBar(1,1); 
		} 
		
		private function handleInitComplete(event:Event):void { 
			if (progressText != null){ 
				progressText.text = "初始化完成."; 
			} 
			drawProgressBar(1,1);         
			
			//0.03秒后抛出完成事件 
			var timer:Timer = new Timer(300,1); 
			timer.addEventListener(TimerEvent.TIMER, dispatchComplete); 
			timer.start();      
		} 
		
		private function dispatchComplete(event:TimerEvent):void { 
			dispatchEvent(new Event(Event.COMPLETE)); 
		} 

		
		public function get backgroundAlpha():Number
		{
			return 0;
		}
		
		public function set backgroundAlpha(value:Number):void
		{
		}
		
		public function get backgroundColor():uint
		{
			return 0;
		}
		
		public function set backgroundColor(value:uint):void
		{
		}
		
		public function get backgroundImage():Object
		{
			return null;
		}
		
		public function set backgroundImage(value:Object):void
		{
		}
		
		public function get backgroundSize():String
		{
			return null;
		}
		
		public function set backgroundSize(value:String):void
		{
		}
		
		
		
		public function get stageHeight():Number
		{
			return 0;
		}
		
		public function set stageHeight(value:Number):void
		{
		}
		
		public function get stageWidth():Number
		{
			return 0;
		}
		
		public function set stageWidth(value:Number):void
		{
		}
		
		
	}
}

 使用方法:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark"
			    preloader="com.iman.sps.sheet.ascript.MyProgressBar">

 

分享到:
评论

相关推荐

    Flex 进度条

    Flex进度条是一种用于显示操作进度的图形用户界面组件,尤其适用于那些需要花费一定时间的异步操作,比如文件下载、音乐或视频的加载以及登录过程等。通过进度条,用户可以直观地看到当前操作的完成情况,从而减少...

    flex进度条

    本文将详细探讨Flex进度条的实现方式,并通过一个具体示例来阐述其工作原理。 #### 二、Flex进度条基础知识 在Flex中,`ProgressBar` 组件是用于展示进度的核心组件。它可以通过设置不同的属性来控制进度条的表现...

    Flex进度条小例子

    Flex是一个开源的、基于MXML和ActionScript的框架,用于构建富互联网应用程序(RIA)。在Flex中,我们可以创建自定义的用户界面组件,其中包括进度条,用于显示任务的完成进度或数据加载状态。 描述部分虽然为空,...

    Flex 4 进度条的皮肤

    Flex 4是一个强大的富互联网应用程序(RIA)开发框架,由Adobe公司推出,它允许开发者创建交互性强、用户体验优秀的Web应用程序。在Flex 4中,皮肤是界面组件外观的关键元素,可以自定义以满足特定设计需求。进度条...

    flex进度条展示源码

    flex进度条展示源码

    结合flash制作的flex进度条

    结合Flash制作Flex进度条的目的是为了实现更丰富的视觉效果和用户体验。通过在Flash中设计和动画化进度条的外观,我们可以将其导出为SWC库文件,然后在Flex项目中导入和使用。这允许开发者利用Flash强大的图形编辑...

    Flex进度条示例源码

    综上所述,Flex进度条示例源码涉及了如何在Flex应用中创建、更新和定制进度条,以及对项目文件结构的理解。通过深入学习这些内容,开发者可以更好地构建具有反馈功能的用户界面,提升应用的交互性。

    flex 自定义进度条

    标题提到的"flex 自定义进度条",指的是利用Flex布局技术来设计一个可定制的进度条组件。Flex布局,全称为Flexible Box布局,是一种在CSS3中引入的布局模型,旨在提供更灵活的盒状模型布局方式,尤其适合在不同屏幕...

    Flex 指定文件下载 带进度条

    1. 创建URLLoader对象:这是下载文件的起点,我们需要实例化一个URLLoader对象,并设置其data属性为null,以准备接收下载的数据。 ```actionscript var loader:URLLoader = new URLLoader(); ``` 2. 准备...

    flex可自定义圆形加载进度条例子代码下载

    在进度条中,可能有一个属性如`progress`,它与后台数据的加载进度相绑定,当数据加载完成时,进度条会自动填满。 5. **事件处理**:开发者可能会监听数据加载的事件,如HTTPService的result事件或Loader的complete...

    flex带进度条上传文件

    flex带进度条上传文件,非常棒,相信你会喜欢的。大家不要下载了,这个资源不知道为什么不能用了,请csdn的管理员关注一下。

    Flex3自定义的加载进度条

    通过以上步骤,你就可以在Flex3中创建一个自定义的加载进度条。这个过程涉及到了组件开发、事件处理、数据绑定和界面设计等多个方面,对于深入理解和使用Flex3框架非常有帮助。同时,加入相关的技术交流群或者访问...

    Flex+php 批量上传源码 (可刷新进度条 )

    本教程将详细讲解如何利用Flex作为前端界面,PHP作为后端处理,创建一个支持批量上传并能刷新进度条的功能。 **Flex** 是Adobe开发的一种富互联网应用程序(RIA)开发框架,基于ActionScript编程语言和Flash Player...

    纯CSS3进度条

    本文将深入探讨如何使用纯CSS3来创建一个功能完备且美观的进度条,适合初学者学习和使用。 首先,让我们理解CSS3(层叠样式表第三版)的核心特性。CSS3是CSS的最新版本,它引入了许多新特性,如选择器、边框与背景...

    一个flex的播放器

    描述中的"一个继承flex的Video做成的类组件"指的是开发者创建了一个新的类,该类继承了Flex框架中的Video组件。Video组件是Flex中内置的用于播放视频的组件,它可以处理各种视频格式,如FLV、H.264等,并且可以与...

    flash进度条

    对于进度条,可能需要设置一个背景图层(通常是静态的进度条背景)和一个动态的填充图层(随着进度变化而移动)。通过调整图层的位置和透明度,可以实现平滑的动画效果。 其次,ActionScript是Flash中的脚本语言,...

    jQuery多步骤进度条_网页步骤流程进度条代码

    jQuery是一个轻量级、功能丰富的JavaScript库,它提供了丰富的API来实现各种动态效果,包括多步骤进度条。本教程将深入探讨如何使用jQuery创建网页步骤流程进度条。 首先,我们需要理解jQuery的基本用法。jQuery...

    Flex actionscript3 as3加载文件资源进度条.rar

    "Flex actionscript3 as3加载文件资源进度条.rar"这个压缩包可能包含了一个示例项目,演示如何在Flex应用中实现文件加载的进度反馈。 首先,我们需要理解AS3中的Loader类。Loader类是AS3中负责加载不同类型的媒体...

    基于flex的无刷上传控件可以显示进度条

    以下是一个简单的步骤概述: 1. 用户选择文件,触发`FileReference.browse()`方法。 2. 选择文件后,使用`FileReference.load()`读取文件内容。 3. 文件读取完成后,调用`FileReference.upload()`,指定HTTPService...

    FLEX播放器 flex 开发AIR及Flex之mp3播放器教程

    在本教程中,我们将深入探讨如何使用Adobe Flex技术开发一个MP3播放器,这涉及到FLEX播放器、Flex SDK以及Adobe Integrated Runtime (AIR)的使用。Flex是一种强大的开放源代码框架,用于构建富互联网应用程序(RIA)...

Global site tag (gtag.js) - Google Analytics