- 浏览: 330145 次
- 性别:
- 来自: 北京
文章分类
最新评论
-
wangjun0603:
学习了,写的真好!
native2ascii的简单应用 -
qq672076266:
...
native2ascii的简单应用 -
loyalboys:
...
native2ascii的简单应用 -
hanjinting1004:
...
Flex开发者需要知道的10件事 -
管好你家猫:
学了,文章,
native2ascii的简单应用
一:
SWF Flex 2 Preloader
SWF Flex 2 Preloader View Source
SWF Flex 2 Preloader Source ZIP
GIF Flex 2 Preloader
GIF Flex 2 Preloader View Source
GIF Flex 2 Preloader Source ZIP
PNG Flex 2 Preloader
PNG Flex 2 Preloader View Source
PNG Flex 2 Preloader Source ZIP
二:
flex应用看久了,一个默认的装载loading界面就会导致审美疲劳,下面提供一种方法,让你可以自定义你的装载界面。
1,在src目录下建立自定义类,两个文件代码如下:
Preloader.as
package com.preloader { import mx.preloaders.DownloadProgressBar; import flash.display.Sprite; import flash.events.ProgressEvent; import flash.events.Event; import mx.events.FlexEvent; import mx.managers.SystemManager; import mx.managers.BrowserManager; import flash.utils.Timer; import flash.events.TimerEvent; public class Preloader extends DownloadProgressBar { public var m_Progress: ProgressBar; private var m_Timer: Timer; public function Preloader(): void{ super(); var browser: BrowserManager; m_Progress = new ProgressBar; this.addChild(m_Progress); m_Timer = new Timer(1); m_Timer.addEventListener(TimerEvent.TIMER, timerEventHandler); m_Timer.start(); } override public function set preloader(value:Sprite):void{ value.addEventListener(ProgressEvent.PROGRESS, progressEventHandler); value.addEventListener(Event.COMPLETE, completeEventHandler); value.addEventListener(FlexEvent.INIT_PROGRESS, initProgressEventHandler); value.addEventListener(FlexEvent.INIT_COMPLETE, initCompleteEventHandler); } private function progressEventHandler(event: ProgressEvent): void{ var progress: Number = event.bytesLoaded / event.bytesTotal * 100; if (m_Progress){ m_Progress.progress = progress; } } private function timerEventHandler(event: TimerEvent): void{ this.stage.addChild(this); var width: Number = this.stage.stageWidth * 40 / 100; // Get 40% for the Stage width // Set the Position of the Progress bar to the middle of the screen m_Progress.x = (this.stage.stageWidth - m_Progress.getWidth()) / 2; m_Progress.y = (this.stage.stageHeight - m_Progress.getHeight()) / 2; m_Progress.refreshProgressBar(); } private function completeEventHandler(event: Event): void{ var i: int = 0; } private function initProgressEventHandler(event: FlexEvent): void{ var i: int = 0; } private function initCompleteEventHandler(event: FlexEvent): void{ m_Progress.ready = true; m_Timer.stop(); this.dispatchEvent(new Event(Event.COMPLETE)); } } }
ProgressBar.as
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->
package com.preloader { import flash.display.Bitmap; import flash.display.BitmapData; import flash.display.Graphics; import flash.display.Loader; import flash.display.Sprite; import flash.events.Event; import flash.geom.Matrix; import flash.text.TextField; import flash.text.TextFormat; import flash.text.TextFieldAutoSize; import flash.utils.ByteArray; import mx.controls.Label; import mx.graphics.codec.PNGEncoder; public class ProgressBar extends Loader { // Logo picture [Embed(source="icon/loader.png")] [Bindable] private var logoClass: Class; private var Logo: Bitmap; private var m_Ready: Boolean; private var m_Progress: Number; private var m_BitmapData: BitmapData; // Constant to change to fit your own layout private static var ProgressWidth: int = 150; // Progress bar width private static var PictureWidth: int = 48; // Logo picture width private static var LeftMargin: int = 1; // Left Margin private static var RightMargin: int = 1; // Right Margin private static var Spacing: int = 10; // Spacing between logo and progress bar private static var TopMargin: int = 1; // Top Margin private static var BottomMargin: int = 1; // Bottom Margin private static var PictureHeight: int = 48; // Logo picture height private static var ProgressHeight: int = 12; // Progress bar height private static var ProgressBarBackground: uint = 0xFFFFFF; private static var progressBarOuterBorder: uint = 0x323232; private static var ProgressBarColor: uint = 0xFF4707; private static var ProgressBarInnerColor: uint = 0xFFFFFF; public function ProgressBar(): void{ super(); m_Progress = 0; Logo = new logoClass as Bitmap; this.addEventListener(Event.RENDER, renderEventHandler); } private function renderEventHandler(event: Event): void{ } public function refreshProgressBar(): void{ m_BitmapData = drawProgress(); // Create the bitmapdata object var encoder: PNGEncoder = new PNGEncoder(); var byteArray: ByteArray = encoder.encode(m_BitmapData); // Encode the bitmapdata to a bytearray this.loadBytes(byteArray); // Draw the bitmap on the loader object } public function getWidth(): Number{ return LeftMargin + PictureWidth + Spacing + ProgressWidth + RightMargin; } public function getHeight(): Number{ return TopMargin + PictureHeight + BottomMargin; } private function drawProgress(): BitmapData{ // Create the bitmap class object var bitmapData: BitmapData = new BitmapData(getWidth(), getHeight(), true, 0); // Draw the Progress Bar var sprite: Sprite = new Sprite(); var graph: Graphics = sprite.graphics; // Draw the progress bar background graph.beginFill(ProgressBarBackground); graph.lineStyle(1, progressBarOuterBorder, 1, true); var containerWidth: Number = ProgressWidth; var px: int = getWidth() - RightMargin - ProgressWidth; var py: int = (getHeight() - ProgressHeight)*2/3; graph.drawRoundRect(px, py, containerWidth, ProgressHeight, 0); containerWidth -= 4; var progressWidth: Number = containerWidth * m_Progress / 100; graph.beginFill(ProgressBarColor); graph.lineStyle(1, ProgressBarInnerColor, 1, true); graph.drawRoundRect(px+1, py+1, progressWidth, ProgressHeight-2, 0); //Construct the Text Field Object and put the progress value in it var textField: TextField = new TextField(); //textField.background = true; //textField.border = true; var format:TextFormat = new TextFormat(); format.font = "Verdana"; format.color = 0x000000; format.size = 10; //format.bold = true; textField.defaultTextFormat = format; textField.text = m_Progress.toFixed(0) + "%"; //Create a BitmapData object and take the Width and height of the TextField text. var textBitmapData: BitmapData = new BitmapData(textField.textWidth + 5, textField.textHeight); //Set the BitmapData object background color to the background color of the progress bar textBitmapData.floodFill(0, 0, ProgressBarBackground); //Draw the TextFiel object in the BitmapData object textBitmapData.draw(textField); //Construct the matrix object //The matrix object is used to place the text var textBitmapMatrix: Matrix = new Matrix(); textBitmapMatrix.translate(px + (containerWidth-textBitmapData.width) / 2, py + (ProgressHeight - textBitmapData.height) / 2-2); var textField1: TextField = new TextField(); var format1:TextFormat = new TextFormat(); format1.color = 0x0b333c; textField1.defaultTextFormat = format1; textField1.text = "系统正在装载,请稍候"; textField1.autoSize = TextFieldAutoSize.LEFT; //Create a BitmapData object and take the Width and height of the TextField text. var textBitmapData1: BitmapData = new BitmapData(textField1.textWidth + 5, textField1.textHeight); //Set the BitmapData object background color to the background color of the progress bar textBitmapData1.floodFill(0, 0, ProgressBarBackground); //Draw the TextFiel object in the BitmapData object textBitmapData1.draw(textField1); //Construct the matrix object //The matrix object is used to place the text var textBitmapMatrix1: Matrix = new Matrix(); textBitmapMatrix1.translate(px, 2); //Draw the sprite object on the parent BitmapData bitmapData.draw(sprite); //Draw the text on the parent BitmapData bitmapData.draw(textBitmapData, textBitmapMatrix, null, null, null, false); bitmapData.draw(textBitmapData1, textBitmapMatrix1, null, null, null, false); //Draw the Logo bitmapData.draw(Logo.bitmapData, null, null, null, null, true); return bitmapData; } public function set ready(value: Boolean): void{ m_Ready = value; this.visible = !value; } public function get ready(): Boolean{ return m_Ready; } public function set progress(value: Number): void{ m_Progress = value; } public function get progress(): Number{ return m_Progress; } } }
2,修改你的Application的属性: preloader="com.preloader.Preloader"
3,运行应用,默认的loading已经变成你想要的效果了。
三:
首先:修改下载进度的文字为中文
建立扩展至 mx.preloaders.DownloadProgressBar 的一个类:
package myDownPro { import mx.preloaders.DownloadProgressBar; public class myDownProBar extends DownloadProgressBar { public function myDownProBar() { //TODO: implement function super(); downloadingLabel="正在下载中..."; initializingLabel="正在初始化内容..."; } } }
然后在修改 preloader 为你建立的这个类:
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" preloader="myDownPro.myDownProBar" layout="absolute"> <mx:Text text="程序进度条测试" x="37" y="71"/> </mx:Application>
方法二:覆写 DownloadProgressBar 类的 preloader,可以在其中加入你自已喜欢的标签或者图像
package myDownPro { import mx.preloaders.DownloadProgressBar; import flash.display.Sprite; import flash.events.ProgressEvent import flash.events.* import flash.text.TextField; import mx.events.*; public class myDownProBar2 extends DownloadProgressBar { public var msg:TextField public function myDownProBar2() { super(); msg=new TextField() msg.x=200 msg.y=200 addChild(msg) } override public function set preloader(s:Sprite):void{ s.addEventListener(ProgressEvent.PROGRESS,prog) s.addEventListener(Event.COMPLETE,ecom) s.addEventListener(FlexEvent.INIT_COMPLETE,flInC) s.addEventListener(FlexEvent.INIT_PROGRESS,flIn) } private function prog(e:ProgressEvent):void{ msg.text=String(int(e.bytesLoaded/e.bytesTotal*100))+" %"; } private function ecom(e:Event):void{ msg.text="完成了!!!!" } private function flInC(e:FlexEvent):void{ msg.text="初始化完毕!"//初始完后要派遣 Complete 事件,不然会停在这里,不会进入程序画面的 dispatchEvent(new Event(Event.COMPLETE)) } private function flIn(e:FlexEvent):void{ msg.text="开始初始化程序" } } }
同样修改<mx:Application>标签的 preloader 为这个类。
发表评论
-
应用避免访问浏览器缓存
2011-05-12 17:33 1319项目经常遇到这么个问题:程序做了改动之后,由于浏览 ... -
flex皮肤资源
2011-05-05 15:28 1273如果要找flex皮肤,这里的皮肤真是多。http: ... -
flex利用asdoc生成doc和制作chm
2011-04-02 17:33 1593How to set up ASDoc in Flex Bui ... -
restrict的应用实例
2011-04-02 11:54 10921. 限制某个字符的输入,用符号 ^ 跟上要限制的 ... -
flex中as、instanceof、is、 typeof用法
2011-03-24 09:48 4524“as” 我主要用它做类型转化 假设有一个类叫做 ... -
在Chart上画平均线的三种方法
2011-02-16 14:52 1387在Chart上画平均线的三种方法 ... -
Flex Frameworks
2010-11-12 15:32 971Some say that if a t ... -
flex4国际化
2010-11-11 16:56 2090国际化变得如此简单 <?xml versi ... -
使用ToolTipManager自定义tooltip
2010-11-05 14:52 2585直接贴代码,一看就懂。 <?xml version=& ... -
flex 校验
2010-11-05 14:41 1001①flex中的校验可以使用mx.validator ... -
Flex中的fx、mx和s命名空间
2010-11-05 13:12 3340Flex 4带给我们的 ... -
socket中writeUTF和writeUTFBytes的区别
2010-11-03 10:25 2765Q:用writeUTF发送数据的时候,后台多 ... -
AIR文件操作
2010-09-26 10:01 2877AIR文件操作(一):AIR文件基础 AI ... -
ActionScript 3.0 Socket编程
2010-09-17 17:25 1144在使用ActionScript3.0进行编程的时候需要注 ... -
as 对象深度拷贝
2010-08-20 10:32 953这是一篇关于as3中对象深度拷贝的问题今天自己总结下,便 ... -
Create a FlexUnit TestCase
2010-04-29 20:34 1002Problem How to create a Fle ... -
as3corelib
2010-04-29 20:10 1459google code :http://code. ... -
FusionCharts
2010-04-28 19:26 2340无意中接触到这个产品FusionCharts,3D ... -
flex datagrid自动换行
2010-04-19 17:10 2858以为datagrid的自动换行有多复杂,其实 ... -
让Enter键盘起到Tab键盘的功能
2010-04-19 16:25 821让Enter键盘起到Tab键盘的功能 ...
相关推荐
自定义的loading,可以代替Flex的默认loading。
网上找了很多都不完整,上传一个工程给大家分享,采用子类...如果需要百分比显示的话可能还需要修改一下代码。 ===================================== 压缩包内容:preloader和button两种方式显示loading fex3源码
经过修改的flex商城,flex4以上可用!
flex4 修改IDE配置 使项目及时编译 完美教程
在项目中,以前有个使用Flex的功能,发现没有源代码,几经周折,最终通过此软件实现反编译及代码的修改,最后在原有功能的基础中,实现了项目上的新需求。
修改枯燥的flex默认的初始化页面。个性的进度条,个性的logo
flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图flex 地图...
默认版本不打包任何编译器在内,运行工具可以生成特定编译的FlexBuild配置 增加Mac OSX版FlexBuild(命令行版本) 修改log,编译后运行log指令会弹出上一次的编译日志 修改编译日志格式 修改flexbuild配置文件格式...
FLEX特效FLEX特效FLEX特效FLEX特效 FLEX特效FLEX特效FLEX特效FLEX特效 FLEX特效FLEX特效FLEX特效FLEX特效 FLEX特效FLEX特效FLEX特效FLEX特效
Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex Flex ...
Flex简介Flex简介Flex简介Flex简介Flex简介
flex事件flex事件flex事件flex事件flex事件
flex 精通 flexflex 精通 flexflex 精通 flexflex 精通 flexflex 精通 flexflex 精通 flexflex 精通 flexflex 精通 flexflex 精通 flexflex 精通 flexflex 精通 flexflex 精通 flexflex学习的好资源啊
Flex 4 进度条的皮肤 自己定义的进度条的皮肤 可以按自己的要求随便修改
Flex 组件Flex 组件Flex 组件Flex 组件Flex 组件
flex 修改 tree的icon,根据数据源root 中不同的参数修改不同的图片。
在FLEX 里,解决FLEX 占用内存一直不减,无法清除的问题
java flexjava flexjava flex
动态修改注册点,通过二个swf文件演示 注册点变化后的效果
Flex万年历记事本_flex源码