[转] 用flex4制作跑马灯效果
自定义类 BroadCastMarquee.as
1 package utils
2 {
3 import flash.events.MouseEvent;
4 import flash.events.TimerEvent;
5 import flash.geom.Rectangle;
6 import flash.text.TextField;
7 import flash.text.TextFieldAutoSize;
8 import flash.text.TextFormat;
9 import flash.utils.Timer;
10
11 import mx.core.UIComponent;
12
13 public class BroadCastMarquee extends UIComponent
14 {
15
16 [Bindable]
17 private var broadcastText:String="broadcast message";
18
19 private var m_timer:Timer
20
21 private var m_DefaultText_X:Number=0;
22
23 //每次移动距离
24 private var m_step:Number=10;
25
26 //滚动范围
27 private var m_rect:Rectangle;
28
29 //移动时间间隔
30 private var t_delay:Number=100;
31
32 //广播信息滚动宽度
33 private var m_Width:Number;
34
35 //滚动方向属性
36 [Inspectable(defaultValue="left",enumeration="right,left", category="direction", type="String")]
37 public var ScrollDirection:String="left";
38
39 //显示内容样式
40 [Bindable]
41 private var m_TextFormat:TextFormat=new TextFormat("Verdana","10","#0b333c");
42
43 /**广播信息内容显示控件*/
44 private var m_BroadCastText:TextField;
45
46 // private var m_BroadcastLabel:Label;
47
48 public function BroadCastMarquee()
49 {
50 super();
51
52 InitBroadcast();
53
54 addEventListener(MouseEvent.MOUSE_OVER,rollOverHandler);
55 addEventListener(MouseEvent.ROLL_OUT, rollOutHandler);
56 }
57
58 /**初始化*/
59 private function InitBroadcast():void
60 {
61 /**广播信息显示控件初始化*/
62 m_BroadCastText=new TextField();
63 m_BroadCastText.autoSize=TextFieldAutoSize.LEFT;
64 m_BroadCastText.multiline=false;
65 m_BroadCastText.selectable=false;
66 m_BroadCastText.x=m_BroadCastText.y=m_DefaultText_X
67 m_BroadCastText.wordWrap=false;
68 m_BroadCastText.text=broadcastText;
69 //m_BroadCastText.defaultTextFormat=m_TextFormat;
70 addChild(m_BroadCastText);
71
72
73 this.m_Width=this.width;
74 m_rect=new Rectangle(0,0,this.width,this.m_BroadCastText.textHeight);
75 this.m_BroadCastText.scrollRect=m_rect;
76
77 m_timer = new Timer(t_delay);
78
79 ScrollBroadText();
80 }
81
82 /**
83 * 如果有新的广播消息,或者长度改变进行滚动显示
84 * */
85 private function ScrollBroadText():void
86 {
87 if(this.m_timer!=null)
88 {
89 //停止移动
90 StopMoveBroadcast();
91
92 if(this.broadcastText!="")
93 {
94 m_timer.addEventListener(TimerEvent.TIMER, timerHandler);
95 m_timer.start();
96 }
97 }
98 }
99
100 /**控制滚动信息*/
101 private function timerHandler(evt:TimerEvent):void
102 {
103 if(this.m_BroadCastText.textWidth>0)
104 {
105
106 if(ScrollDirection.toLowerCase()=="left")
107 {
108
109 if(m_rect.x<=this.m_BroadCastText.textWidth)
110 {
111 // this.m_BroadCastText.x+=(-this.m_step);
112 m_rect.x+=this.m_step;
113
114 }else
115 {
116 //this.m_BroadCastText.x=m_DefaultText_X+this.m_BroadCastText.textWidth;
117 m_rect.x=-(m_DefaultText_X+this.m_Width);
118 }
119 }
120 else
121 {
122
123 if(Math.abs(m_rect.x)<=this.m_BroadCastText.textWidth)
124 {
125 m_rect.x-=this.m_step;
126 }
127 else
128 {
129 this.m_rect.x=m_DefaultText_X;
130 }
131 }
132 m_BroadCastText.scrollRect = m_rect;
133
134 }else
135 {
136 //停止移动
137 StopMoveBroadcast();
138 }
139 }
140
141 /**停止移动*/
142 private function StopMoveBroadcast():void
143 {
144 if(m_timer!=null)
145 {
146 this.m_timer.stop();
147 if(m_timer.hasEventListener(TimerEvent.TIMER))
148 m_timer.removeEventListener(TimerEvent.TIMER, timerHandler);
149
150 m_BroadCastText.x=this.m_DefaultText_X;
151 m_rect.height = m_BroadCastText.height;
152 // this.height=m_rect.height;
153 m_BroadCastText.scrollRect = m_rect;
154 }
155 }
156
157
158 /**************************广播信息处理事件*********************************/
159
160 /**鼠标经过处理事件*/
161 protected function rollOverHandler(event:MouseEvent):void
162 {
163 if(this.m_timer!=null&&this.broadcastText!="")
164 {
165 this.m_timer.stop();
166 }
167 }
168
169 /**鼠标离开处理事件*/
170 protected function rollOutHandler(event:MouseEvent):void
171 {
172 if(this.m_timer!=null&&this.broadcastText!="")
173 {
174 this.m_timer.start();
175 }
176 }
177
178 /**************************广播信息属性*************************************/
179
180 /**移动时间间隔*/
181 public function set BroadCastDeplay(value:Number):void
182 {
183 this.m_timer.delay=value;
184 }
185
186 /**设置广播信息内容*/
187 public function set BroadCastText(value:String):void
188 {
189 this.m_BroadCastText.text=value;
190 ScrollBroadText();
191 }
192
193 /**取得广播信息内容*/
194 public function get BroadCastText():String
195 {
196 return this.broadcastText;
197 }
198
199
200 /**广播信息宽度宽度*/
201 public override function get width():Number
202 {
203 return this.m_Width;
204 }
205
206 public override function set width(width:Number):void
207 {
208 this.m_Width=width;
209 this.m_rect.width=this.m_Width;
210 this.m_BroadCastText.scrollRect=this.m_rect;
211 ScrollBroadText();
212 //this.m_BroadCastText.setTextFormat
213 }
214
215
216 /**设置滚动方向('left' or 'right')*/
217 public function set Direction(value:String):void
218 {
219 this.ScrollDirection=value;
220 ScrollBroadText();
221 }
222
223
224 /**设置字体格式化样式*/
225 public function set defaultTextFormat(format:TextFormat):void
226 {
227 this.m_BroadCastText.defaultTextFormat=format;
228 this.setTextFormat(format);
229 }
230
231 public function setTextFormat(format:TextFormat, beginIndex:int = -1, endIndex:int = -1):void
232 {
233 m_BroadCastText.setTextFormat(format, beginIndex, endIndex);
234 ScrollBroadText();
235 }
236
237
238 /**字体大小*/
239 public function set fontSize(value:Object):void
240 {
241 this.m_TextFormat=new TextFormat(this.m_TextFormat.font,value,this.m_TextFormat.color);
242 this.m_BroadCastText.setTextFormat(this.m_TextFormat,-1,-1);
243
244 }
245
246 /**字体名称*/
247 public function set fontFamily(value:String):void
248 {
249 this.m_TextFormat=new TextFormat(value,this.m_TextFormat.size,this.m_TextFormat.color);
250 this.m_BroadCastText.setTextFormat(this.m_TextFormat,-1,-1);
251 }
252
253 /**字体颜色*/
254 public function set color(value:Object):void
255 {
256 this.m_TextFormat=new TextFormat(this.m_TextFormat.font,this.m_TextFormat.size,value);
257 this.m_BroadCastText.setTextFormat(this.m_TextFormat,-1,-1);
258 }
259
260 /**是否是粗体*/
261 public function set fontWeight(value:Object):void
262 {
263 this.m_TextFormat=new TextFormat(this.m_TextFormat.font,this.m_TextFormat.size,this.m_TextFormat.color,value)
264 this.m_BroadCastText.setTextFormat(this.m_TextFormat,-1,-1);
265 }
266 }
267 }
268
2 {
3 import flash.events.MouseEvent;
4 import flash.events.TimerEvent;
5 import flash.geom.Rectangle;
6 import flash.text.TextField;
7 import flash.text.TextFieldAutoSize;
8 import flash.text.TextFormat;
9 import flash.utils.Timer;
10
11 import mx.core.UIComponent;
12
13 public class BroadCastMarquee extends UIComponent
14 {
15
16 [Bindable]
17 private var broadcastText:String="broadcast message";
18
19 private var m_timer:Timer
20
21 private var m_DefaultText_X:Number=0;
22
23 //每次移动距离
24 private var m_step:Number=10;
25
26 //滚动范围
27 private var m_rect:Rectangle;
28
29 //移动时间间隔
30 private var t_delay:Number=100;
31
32 //广播信息滚动宽度
33 private var m_Width:Number;
34
35 //滚动方向属性
36 [Inspectable(defaultValue="left",enumeration="right,left", category="direction", type="String")]
37 public var ScrollDirection:String="left";
38
39 //显示内容样式
40 [Bindable]
41 private var m_TextFormat:TextFormat=new TextFormat("Verdana","10","#0b333c");
42
43 /**广播信息内容显示控件*/
44 private var m_BroadCastText:TextField;
45
46 // private var m_BroadcastLabel:Label;
47
48 public function BroadCastMarquee()
49 {
50 super();
51
52 InitBroadcast();
53
54 addEventListener(MouseEvent.MOUSE_OVER,rollOverHandler);
55 addEventListener(MouseEvent.ROLL_OUT, rollOutHandler);
56 }
57
58 /**初始化*/
59 private function InitBroadcast():void
60 {
61 /**广播信息显示控件初始化*/
62 m_BroadCastText=new TextField();
63 m_BroadCastText.autoSize=TextFieldAutoSize.LEFT;
64 m_BroadCastText.multiline=false;
65 m_BroadCastText.selectable=false;
66 m_BroadCastText.x=m_BroadCastText.y=m_DefaultText_X
67 m_BroadCastText.wordWrap=false;
68 m_BroadCastText.text=broadcastText;
69 //m_BroadCastText.defaultTextFormat=m_TextFormat;
70 addChild(m_BroadCastText);
71
72
73 this.m_Width=this.width;
74 m_rect=new Rectangle(0,0,this.width,this.m_BroadCastText.textHeight);
75 this.m_BroadCastText.scrollRect=m_rect;
76
77 m_timer = new Timer(t_delay);
78
79 ScrollBroadText();
80 }
81
82 /**
83 * 如果有新的广播消息,或者长度改变进行滚动显示
84 * */
85 private function ScrollBroadText():void
86 {
87 if(this.m_timer!=null)
88 {
89 //停止移动
90 StopMoveBroadcast();
91
92 if(this.broadcastText!="")
93 {
94 m_timer.addEventListener(TimerEvent.TIMER, timerHandler);
95 m_timer.start();
96 }
97 }
98 }
99
100 /**控制滚动信息*/
101 private function timerHandler(evt:TimerEvent):void
102 {
103 if(this.m_BroadCastText.textWidth>0)
104 {
105
106 if(ScrollDirection.toLowerCase()=="left")
107 {
108
109 if(m_rect.x<=this.m_BroadCastText.textWidth)
110 {
111 // this.m_BroadCastText.x+=(-this.m_step);
112 m_rect.x+=this.m_step;
113
114 }else
115 {
116 //this.m_BroadCastText.x=m_DefaultText_X+this.m_BroadCastText.textWidth;
117 m_rect.x=-(m_DefaultText_X+this.m_Width);
118 }
119 }
120 else
121 {
122
123 if(Math.abs(m_rect.x)<=this.m_BroadCastText.textWidth)
124 {
125 m_rect.x-=this.m_step;
126 }
127 else
128 {
129 this.m_rect.x=m_DefaultText_X;
130 }
131 }
132 m_BroadCastText.scrollRect = m_rect;
133
134 }else
135 {
136 //停止移动
137 StopMoveBroadcast();
138 }
139 }
140
141 /**停止移动*/
142 private function StopMoveBroadcast():void
143 {
144 if(m_timer!=null)
145 {
146 this.m_timer.stop();
147 if(m_timer.hasEventListener(TimerEvent.TIMER))
148 m_timer.removeEventListener(TimerEvent.TIMER, timerHandler);
149
150 m_BroadCastText.x=this.m_DefaultText_X;
151 m_rect.height = m_BroadCastText.height;
152 // this.height=m_rect.height;
153 m_BroadCastText.scrollRect = m_rect;
154 }
155 }
156
157
158 /**************************广播信息处理事件*********************************/
159
160 /**鼠标经过处理事件*/
161 protected function rollOverHandler(event:MouseEvent):void
162 {
163 if(this.m_timer!=null&&this.broadcastText!="")
164 {
165 this.m_timer.stop();
166 }
167 }
168
169 /**鼠标离开处理事件*/
170 protected function rollOutHandler(event:MouseEvent):void
171 {
172 if(this.m_timer!=null&&this.broadcastText!="")
173 {
174 this.m_timer.start();
175 }
176 }
177
178 /**************************广播信息属性*************************************/
179
180 /**移动时间间隔*/
181 public function set BroadCastDeplay(value:Number):void
182 {
183 this.m_timer.delay=value;
184 }
185
186 /**设置广播信息内容*/
187 public function set BroadCastText(value:String):void
188 {
189 this.m_BroadCastText.text=value;
190 ScrollBroadText();
191 }
192
193 /**取得广播信息内容*/
194 public function get BroadCastText():String
195 {
196 return this.broadcastText;
197 }
198
199
200 /**广播信息宽度宽度*/
201 public override function get width():Number
202 {
203 return this.m_Width;
204 }
205
206 public override function set width(width:Number):void
207 {
208 this.m_Width=width;
209 this.m_rect.width=this.m_Width;
210 this.m_BroadCastText.scrollRect=this.m_rect;
211 ScrollBroadText();
212 //this.m_BroadCastText.setTextFormat
213 }
214
215
216 /**设置滚动方向('left' or 'right')*/
217 public function set Direction(value:String):void
218 {
219 this.ScrollDirection=value;
220 ScrollBroadText();
221 }
222
223
224 /**设置字体格式化样式*/
225 public function set defaultTextFormat(format:TextFormat):void
226 {
227 this.m_BroadCastText.defaultTextFormat=format;
228 this.setTextFormat(format);
229 }
230
231 public function setTextFormat(format:TextFormat, beginIndex:int = -1, endIndex:int = -1):void
232 {
233 m_BroadCastText.setTextFormat(format, beginIndex, endIndex);
234 ScrollBroadText();
235 }
236
237
238 /**字体大小*/
239 public function set fontSize(value:Object):void
240 {
241 this.m_TextFormat=new TextFormat(this.m_TextFormat.font,value,this.m_TextFormat.color);
242 this.m_BroadCastText.setTextFormat(this.m_TextFormat,-1,-1);
243
244 }
245
246 /**字体名称*/
247 public function set fontFamily(value:String):void
248 {
249 this.m_TextFormat=new TextFormat(value,this.m_TextFormat.size,this.m_TextFormat.color);
250 this.m_BroadCastText.setTextFormat(this.m_TextFormat,-1,-1);
251 }
252
253 /**字体颜色*/
254 public function set color(value:Object):void
255 {
256 this.m_TextFormat=new TextFormat(this.m_TextFormat.font,this.m_TextFormat.size,value);
257 this.m_BroadCastText.setTextFormat(this.m_TextFormat,-1,-1);
258 }
259
260 /**是否是粗体*/
261 public function set fontWeight(value:Object):void
262 {
263 this.m_TextFormat=new TextFormat(this.m_TextFormat.font,this.m_TextFormat.size,this.m_TextFormat.color,value)
264 this.m_BroadCastText.setTextFormat(this.m_TextFormat,-1,-1);
265 }
266 }
267 }
268
在mxml文件中：
1 <?xml version="1.0" encoding="utf-8"?>
2 <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
3 xmlns:s="library://ns.adobe.com/flex/spark"
4 xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" xmlns:utils="utils.*">
5 <fx:Declarations>
6 <!-- Place non-visual elements (e.g., services, value objects) here -->
7 </fx:Declarations>
8
9 <utils:BroadCastMarquee width="888" height="25" BroadCastDeplay="800" BroadCastText="公告：火爆商品等你拿!" ScrollDirection="left">
10
11 </utils:BroadCastMarquee>
12 </s:Application>
13
2 <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
3 xmlns:s="library://ns.adobe.com/flex/spark"
4 xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" xmlns:utils="utils.*">
5 <fx:Declarations>
6 <!-- Place non-visual elements (e.g., services, value objects) here -->
7 </fx:Declarations>
8
9 <utils:BroadCastMarquee width="888" height="25" BroadCastDeplay="800" BroadCastText="公告：火爆商品等你拿!" ScrollDirection="left">
10
11 </utils:BroadCastMarquee>
12 </s:Application>
13
