scrollbar et onMouseWheel

**Archimède** · 12/10/2013, 21h03

Finalement, je me suis fait une scrollbar... n'ayant pas de réponse à mon post sur le trackbar.

ci-joint :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
 
package  
{
	import flash.display.MovieClip;
	import flash.events.Event;
	import flash.events.MouseEvent;
 
	public class scrollBar extends MovieClip
	{
		private var _min:int;
		private var _max:int;
		private var _position:Number;
		private var _orientation:String;
		private var w:Number;
		private var ymouse:Number;
		private var taille:int;
		private var but1: scrollButton = new scrollButton();
		private var but2: scrollButton = new scrollButton();
		private var	cur: curseur = new curseur();
 
		public function scrollBar(size:int)
		{
			taille = size;
			addEventListener(Event.ADDED_TO_STAGE, init);	
		}
 
		private function init(e:Event = null):void 
		{	
			removeEventListener(Event.ADDED_TO_STAGE, init);
		        w = taille-70;//30 ->15+15 +  40->2x20 taille 2x bouton+curseur
			with (graphics)
			{
			 lineStyle(1, 0xE7E7E7);	
			 beginFill(0xF0F0F0);
			 drawRect( -7.5, 0, 15, taille);
			 endFill();
			 }
			but1.y = 7.5;
			but1.Fonction = 'Substract';
			but2.y = taille-7.5;
			but2.rotation = 180;
			but2.Fonction = 'Add';
			cur.addEventListener(MouseEvent.MOUSE_DOWN, mousedown);
                        stage.addEventListener(MouseEvent.MOUSE_MOVE, mousemove); 
                        stage.addEventListener(MouseEvent.MOUSE_UP, mouseup);
	                stage.addEventListener(MouseEvent.MOUSE_WHEEL, mouseWheel);
 
			addChildAt(but1, 0);
			addChildAt(but2,1);
			addChildAt(cur, 2);
		}
 
		private function mouseWheel(event:MouseEvent):void
		{
	           var temppos:int;
                   if (Orientation == 'vertical')
		  {
		    temppos = Position;
	            if (event.delta > 0)  event.delta = 2; else event.delta = -2;
		    Position-= event.delta; 
                    if (Position >= _min && Position <= _max) cur.y = 35 + (Position - _min) * w  / (_max - _min); else Position = temppos;
		   onChange();
		  }
        }
 
		private function mousedown(e:MouseEvent):void 
               {
		 cur.Click = true;
		 ymouse =cur.mouseY;
                }
 
 
 
		private function mouseup(e:MouseEvent):void 
	        { 
		  cur.Click = false;
                }
 
                private function mousemove(e:MouseEvent):void
	        {	
		  if (cur.Click == true)
		 {
	  	  cur.y= cur.y + cur.mouseY -ymouse;
                  if (cur.y<35) cur.y=35;
                  if (cur.y>taille-35) cur.y=taille-35;
                  Position=Math.round((cur.y-35)*(_max-_min)/w+_min);
                  onChange();
		 }  
        }
 
		public function onChange():void
		{
 
		}
 
 
	         public function get Min():int
		{
		  return _min;
		}
 
		public function get Max():int
		{
		 return _max;
		}
 
		public function get Orientation():String
		{
		 return _orientation;	
		}
 
                public function get Position():int
		{
		  return _position;
		}
 
		 public  function set Min(value:int):void
		{
		  _min = value;
		}
 
		public  function set Max(value:int):void
		{
		  _max = value;
		}
 
                public  function set Position(value:int):void 
	        {
		   cur.y =35+ Math.abs(value -_min) * w / (_max - _min);  
		   _position = value;
	        }
 
               public function set Orientation(value:String):void 
	       {
		 if (value=='horizontal')
                 {
                  rotation = -90;
	          y = y +but1.height/2;
		 }	
		 else if (value == 'vertical')
		 {
		  x = x +but1.width / 2;
		 }
		  _orientation = value; 
	    } 
 
	}	
}		
 
import flash.display.SimpleButton;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.geom.Matrix;
 
class scrollButton extends SimpleButton
{
	private var _fonction:String;
		public function scrollButton() 
		{
		 downState = new BtnFace(1,15);
                 overState = new BtnFace(2,15);
                 upState = new BtnFace(3,15);
                 hitTestState =  new BtnFace(4, 15);
                 hitTestState.y = hitTestState.x;
		 useHandCursor  = true;
		 addEventListener(Event.ADDED_TO_STAGE, init);
		 addEventListener(MouseEvent.MOUSE_DOWN, doClick);
		}
 
		private function init(pEvent:Event):void
		{
			removeEventListener(Event.ADDED_TO_STAGE, init);
			stage.addEventListener(MouseEvent.MOUSE_UP, doStop);
		}
 
		public function get Fonction():String
		{
		  return _fonction;
		}
 
		public function set Fonction(S:String):void
		{
			_fonction = S;
		}
 
		private function doFrame(pEvent:Event):void
		{
			if (Fonction == 'Add' && scrollBar(parent).Position <scrollBar(parent).Max)
			{
		       scrollBar(parent).Position += 1;	 
			}
			else if (Fonction == 'Substract'&& scrollBar(parent).Position >scrollBar(parent).Min)
			{
			   scrollBar(parent).Position -= 1; 	
			}	
			scrollBar(parent).onChange();
		}
 
		private function doStop(pEvent:MouseEvent):void
		{
		  removeEventListener(Event.ENTER_FRAME, doFrame);
		}
 
		private function doClick(pEvent:MouseEvent):void
		{
		  addEventListener(Event.ENTER_FRAME, doFrame);
		}		
}
 
import flash.display.Sprite;
 
class BtnFace extends Sprite
{
	private var bgColorup:int = 0xF0F0F0;
	private var bgColorsurvol:int = 0xD6EEFB;
	private var bgColordown:int = 0x42A1D4;
 
 
	public function BtnFace(num:int,size:int):void
	{
	  draw(num,size);
	}
 
	 private function draw(val:int,size:int):void
	{	
 
	 with (graphics)
	 {
		lineStyle(1,0);
		switch (val)
		{	
		 case 1: beginFill(bgColordown);
			     break;
		 case 2: beginFill(bgColorsurvol);
			     break;
 
		 case 3: beginFill(bgColorup);
			     break;
 
		 case 4: beginFill(bgColorsurvol);
			     break;	  
		}
		drawRect(-size/2, -size/2,size, size);
		endFill();
		beginFill(0);
		lineStyle(1, 0);
		moveTo(0, -size/2+size/3);
		lineTo(size/2-size/3,size/2-size/3);
		lineTo(-size/2+size/3,size/2-size/3);
		lineTo(0, -size/2+size/3);
		endFill();
	 }
    }
}
 
 
import flash.display.Sprite;
import flash.display.GradientType;
import flash.display.SpreadMethod;
import flash.events.Event;
 
class curseur extends Sprite
{
	private var mat:Matrix = new Matrix();
	private var fillType:String = GradientType.LINEAR;
    private var colors1:Array = [0xFCFCFC, 0xdcdcdc];
	private	var colors2:Array = [0xE3F4FC, 0x9CCAE3];
    private var alphas:Array = [1, 1];
    private var ratios:Array = [0,255];
    private var matr:Matrix = new Matrix();
    private var spreadMethod:String = SpreadMethod.PAD;
	private var _FClick:Boolean=false;
 
	public function curseur():void
	{ 
		 matr.createGradientBox(2, 2, 0, 0, 0);
		 draw(1);
		 buttonMode = true;
		 addEventListener(MouseEvent.ROLL_OUT, doOut);
		 addEventListener(MouseEvent.ROLL_OVER, doOver);	 
	}
 
	public function get Click():Boolean
	{
		return _FClick;
	}
 
	public function set Click(val:Boolean):void
	{
		_FClick = val;
	}
 
	private function doOver(pEvent: Event):void
	{
	  draw(2);
	}
 
 
	private function doOut(pEvent:Event):void
	{
      draw(1);
	}
 
	private function draw(val:int):void
	{
		with (graphics)
		{
		 switch (val)
		 {
		   case 1:
			    lineStyle(1,0x949494);
			    beginGradientFill(fillType, colors1, alphas, ratios, matr, spreadMethod);
			    drawRect( -7, -20, 13.5, 40);
			    endFill();
			    beginFill(0xB1B1B1);
			    lineStyle(1, 0x727171);
			    break;  
		   case 2:
			    lineStyle(1,0x949494);
			    beginGradientFill(fillType, colors2, alphas, ratios, matr, spreadMethod);
			    drawRect( -7, -20, 13.5, 40);
			    endFill();
			    beginFill(0x58A2C2);
			    lineStyle(1, 0x62A8CA)
			   break;
		 }
		 drawRect( -4, -5, 8, 2);
	     drawRect( -4, -1, 8, 2);
		 drawRect( -4, 3, 8, 2);
	     endFill();
		}	   	
	}
}

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
 
package 
{
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.geom.Matrix;
	import flash.display.Bitmap;
	import flash.geom.Rectangle;
 
	[SWF(frameRate='32',width='1000',height='500',backgroundColor='0xF5F5FF')]
 
	public class Main extends Sprite 
	{
		private var scroll1:scrollBar1 = new scrollBar1(1000);
		private var scroll2:scrollBar2 = new scrollBar2(500 - 16);
		[Embed(source = "../lib/developpez.jpg")]
		private  var developpez:Class;
	    private var Fond:Bitmap = new developpez();
		private	var matrice:Matrix = new Matrix();
		public var espace:Sprite = new Sprite();
 
		public function Main():void 
		{	
			scrollRect = new Rectangle(0, 0, 1000, 500);
            matrice.createBox(1, 1, 0, - Fond.width / 2, - Fond.height / 2);
			with (espace.graphics)
			{
			 beginBitmapFill(Fond.bitmapData, matrice); 
			 drawRect( - Fond.width / 2, - Fond.height / 2, Fond.width, Fond.height);
			} 
			espace.x =stage.stageWidth/2;
			espace.y =stage.stageHeight/2;
		    addChildAt(espace, 0);
 
 
 
			addChildAt(scroll1,1);
			scroll1.y = 500 - 15;//-hauteur de la scrollbar
	    	scroll1.Orientation = 'horizontal';
			scroll1.Min = -76;
			scroll1.Max = 76;
			scroll1.Position =0;     
 
			addChildAt(scroll2, 2);
			scroll2.x =1000-15;//-largeur de la scrollbar
	    	scroll2.Orientation = 'vertical';
			scroll2.Min = -182;
			scroll2.Max = 182;
			scroll2.Position =0;				
		}
 
	}
 
}
 
class scrollBar1 extends scrollBar 
{
	public function scrollBar1(size:int):void
	{
		super(size);
	}
 
	override public function onChange():void
	{
		Main(parent).espace.x = stage.stageWidth/2+Position;
	}
}
 
class scrollBar2 extends scrollBar 
{
	public function scrollBar2(size:int):void
	{
		super(size);
	}
 
	override public function onChange():void
	{
		Main(parent).espace.y= stage.stageHeight/2+Position;
	}
}

ma question est : comment rendre directement l'événement onMouseWheel de la scrollbar verticale opérationnel dans un navigateur alors que celui marche parfaitement directement dans flashplayer ?

Ci-joint le fichier correspondant :

scrollbar et onMouseWheel

ActionScript 3

Mode arborescent

Discussions similaires

Partager

Partager