`
zhanshenlvbu
  • 浏览: 110345 次
社区版块
存档分类
最新评论

Flex进度条的使用

阅读更多

例1: mxml文件中的使用方法

<?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" creationComplete="InitApp()"
			   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" width="435" height="208">
	<fx:Script>
		<![CDATA[
			import mx.controls.Alert;
			import mx.controls.Image;
			import flash.net.URLLoader;
			import flash.net.URLRequest;
			import mx.managers.PopUpManager;
			import mx.controls.ProgressBar;
			
			private var valueNum:Number = 0;
			
			//使用定时器处理progressBar 开始
			private var timer:Timer;

			protected function InitApp():void{
				timer = new Timer(1);  
				timer.addEventListener(TimerEvent.TIMER, OnTimeEvent);
				timer.start();
			}
			
			private function OnTimeEvent(evt:TimerEvent):void{
				valueNum = valueNum + 10;
				var vaPercent:Number = valueNum / 100;
				if(valueNum >= 10000)
				{
					progressBar.setProgress(valueNum, 10000);
					progressBar.label = "download completed";
					return;
				}
				progressBar.setProgress(valueNum, 10000);
				progressBar.label = vaPercent + "% has been downloaded"   
			}
		]]>
	</fx:Script>
	
	<mx:ProgressBar x="108" y="22" label="0% has been downloaded" minimum="0" maximum="100" mode="manual" id="progressBar" name="progress" indeterminate="false" enabled="true" chromeColor="#1F1616" color="#FB0D0D" disabledColor="#FA1919" errorColor="#26AE4D"/>
</s:Application>

 

 

 

例2: as文件中的使用方法

 

var proBar:ProgressBar = new ProgressBar();
proBar.width = 48;
proBar.x = 0;
proBar.y = 0;
proBar.minimum = 0;
proBar.maximum = 100;
proBar.direction = "right";
proBar.mode = "manual";
this.addChild(proBar);
				
var timer:Timer;
var valueNum:Number = 0;
			
timer = new Timer(1);  
timer.addEventListener(TimerEvent.TIMER, function():void{
	valueNum = valueNum + 10;
	var vaPercent:Number = valueNum / 100;
	if(valueNum >= 10000)
	{
		proBar.setProgress(valueNum, 10000);
		proBar.label = "同步完成";
		proBar.visible = false;
		return;
	}
	proBar.setProgress(valueNum, 10000);
	proBar.label = "已经同步" + vaPercent + "%";   
});
timer.start();
 
分享到:
评论

相关推荐

    Flex 进度条

    Flex进度条组件的使用示例代码中提到了如何设置Timer来模拟进度条的加载过程。代码中定义了计时器(Timer)和一个增加进度条值的函数(runit),并设置了一个监听器来响应计时器事件。在每个周期,进度条的进度值...

    flex进度条

    ### Flex进度条实现原理与应用 #### 一、引言 在现代Web开发中,进度条作为一种常见的UI组件,主要用于指示加载或处理过程中的完成情况。对于基于Flex框架的应用而言,进度条同样扮演着重要的角色,尤其是在应用...

    Flex进度条小例子

    标题中的“Flex进度条小例子”表明我们将讨论的是使用Adobe Flex技术实现的进度条组件的应用。Flex是一个开源的、基于MXML和ActionScript的框架,用于构建富互联网应用程序(RIA)。在Flex中,我们可以创建自定义的...

    flex进度条展示源码

    flex进度条展示源码

    Flex 4 进度条的皮肤

    本文将深入探讨如何在Flex 4中创建和定制进度条的皮肤。 首先,我们需要了解Flex 4中的皮肤架构。Flex 4引入了Spark组件模型,其中皮肤是组件外观的独立层,可以通过CSS样式或MXML代码进行定义。每个组件都有一个...

    结合flash制作的flex进度条

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

    Flex进度条示例源码

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

    flex 自定义进度条

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

    Flex 指定文件下载 带进度条

    在Flex编程中,指定文件下载并带有进度条功能是一项常见的需求,这主要涉及到网络I/O操作、事件处理以及用户界面的更新。以下是对这个主题的详细讲解。 首先,Flex是Adobe开发的一种开源富互联网应用程序(RIA)...

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

    在这个特定的案例中,我们关注的是使用Flex实现的自定义圆形加载进度条。 在Web应用中,进度条是用户界面中常见的一种元素,用于指示某个任务或数据加载的进度。圆形进度条与传统的水平进度条不同,它以圆形图案...

    flex带进度条上传文件

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

    Flex3自定义的加载进度条

    创建完自定义进度条后,你可以像使用任何其他Flex组件一样在应用程序中导入并使用它。将其添加到主容器中,设置相关属性,如初始值、最大值等,然后在加载数据时启动进度条。 7. **优化和调试** 为了确保自定义...

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

    以上就是使用Flex+PHP实现批量上传文件并刷新进度条的基本原理和步骤。实际应用中可能还需要根据项目需求进行调整和优化,例如添加取消上传功能、显示上传状态等。记得在编写代码时保持良好的编程习惯,以便于后期的...

    纯CSS3进度条

    4. **Flexbox布局**:使用`display: flex`,我们可以轻松地调整进度条容器的布局,使其在不同屏幕尺寸下保持响应式。 现在,我们来构建一个基本的进度条结构: ```html ;"&gt; ``` 在这个例子中,`.progress-bar`...

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

    Flex组件库提供了丰富的UI元素,包括用于文件上传的控件,可以方便地创建具有进度条显示的上传功能。 **无刷上传原理** 无刷上传,即无需刷新页面即可完成文件上传,这主要依赖于Ajax技术。Ajax(Asynchronous ...

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

    本教程将深入探讨如何使用jQuery创建网页步骤流程进度条。 首先,我们需要理解jQuery的基本用法。jQuery通过选择器选取DOM元素,然后应用各种方法来操作这些元素,如添加样式、修改内容或触发事件。在进度条的场景...

    flex 面试题flex

    若仅需要编码便利,可创建AS工程,使用Flex作为AS编码工具。 9. Flex Builder 3的MXML页面默认背景: Flex Builder 3创建的MXML页面默认背景通常是蓝色。可以自定义皮肤或修改CSS样式来更改背景颜色。 以上是Flex...

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

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

    flex 自定义加载进度框

    2. **Flex SDK**:理解Flex SDK的结构和使用,包括如何使用mxml和as文件创建组件。 3. **事件监听**:监听加载进度事件,如`ProgressEvent.PROGRESS`和`Event.COMPLETE`,以便更新进度条的状态。 4. **Flex ...

    flash进度条

    响应式设计则需要考虑进度条在不同分辨率和设备上的适配,可能需要借助CSS3或Flex布局。 总的来说,创建“Flash进度条”涉及了Flash的基础动画原理、ActionScript编程技巧以及UI/UX设计原则。在CS4版本中,开发者...

Global site tag (gtag.js) - Google Analytics