Archive for septiembre, 2010

mouseX y mouseY relativo a objetos distintos

Muchas veces necesitamos saber en donde ésta el mouse con respecto a algo. Y en cualquier momento podemos obtener su ubicación relativa al escenario o a un objeto de manera muy simple.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
import flash.events.MouseEvent;
 
cuadrado_mc.addEventListener(MouseEvent.MOUSE_OVER, onDown);
function onDown(e:MouseEvent):void
{
    e.target.addEventListener(MouseEvent.MOUSE_MOVE,onMove);
}
 
function onMove(e:MouseEvent):void
{
    trace(e.localX,e.localY);
 
    debug_txt.htmlText="<b>entre del cuadrado</b>\nx: "+e.localX+"\ny: "+e.localY+"\n\n<b>mouse relativo al escenario</b>\nx: "+mouseX+"\ny: "+mouseY;
}

Esto requiero Flash player 9

Generar columnas en Flash

Aca dejo un pequeño tip de como generar columnas en flash facilmente.
La idea en usar un for pero no necesitar de hacer for añidados o usar contadores sino hacer todo en una sola línea usando el símbolo %. Con este “truquico” cada vez que i es divisible por 10 la vuelve cero de forma que el contador en x de este ejemplo decrementa desde -250 de 50 en 50. Lo único valores que peude tomar x son entre -250 y 250 y varía de 50 en 50. Usando este método es muy fácil generar una grilla donde posicionamos elementos.

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
for(var i : int = 0; i< 100; i++){
trace ('x: '+((i%10)-5)*50);
trace('y: '+ ((i/10)-5)*50);
}
//los traces de este ejemplo sería:
/*
x: -250
y: -250
x: -200
y: -245.00000000000003
x: -150
y: -240
x: -100
y: -235
x: -50
y: -229.99999999999997
x: 0
y: -225
x: 50
y: -220.00000000000003
x: 100
y: -215
x: 150
y: -210
x: 200
y: -204.99999999999997
x: -250
y: -200
x: -200
y: -195
x: -150
y: -190
x: -100
y: -185
x: -50
y: -180
x: 0
y: -175
x: 50
y: -170
x: 100
y: -165
x: 150
y: -160
x: 200
...*/

Tierra en paperVision

Estuve jugando con PV3d en Flash Builder 4 y termine con este experimento. es el tipico Hello World, en este caso el nuestro mundo ;-)

El experimento se trató de ver como se comportaban dos texturas una arriba de otra. lo que hice fue crear dos primitivas de, dos esferas, una esfera minimamente más grande que la otra. Luego le apliqué una textura distinta a cada una.  finalmente agregue una particulas con un bitmap que simula ser una extrella.

Como toque final puse un onEnterFrame para renderizar la escena, mientras muevo giro en el eje de la Y ambas esferas a velocidades distintas y tambien muevo minimamente las particulas. Es bastante pesado para el procesador, pero no pain no gain.

Esto requiero Flash player 9

acá dejo el código:

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
package {
import flash.display.BitmapData;
import flash.events.Event;
 
import org.papervision3d.core.math.Number3D;
import org.papervision3d.materials.special.MovieParticleMaterial;
 
import org.papervision3d.core.geom.Particles;
import org.papervision3d.core.geom.renderables.Particle;
import org.papervision3d.lights.PointLight3D;
import org.papervision3d.materials.BitmapMaterial;
import org.papervision3d.materials.shaders.GouraudShader;
import org.papervision3d.materials.shaders.ShadedMaterial;
import org.papervision3d.materials.shaders.Shader;
import org.papervision3d.materials.special.BitmapParticleMaterial;
import org.papervision3d.materials.special.ParticleBitmap;
import org.papervision3d.materials.special.ParticleMaterial;
import org.papervision3d.objects.primitives.Sphere;
import org.papervision3d.objects.special.ParticleField;
import org.papervision3d.view.BasicView;
 
[SWF (width="450", height="300", backgroundColor="0x000000", frameRate="30")]
 
public class earth extends BasicView
{
 
public var sphere:Sphere;
public var sphere2:Sphere;
 
public var light : PointLight3D;
 
public var shader : Shader;     
 
public var stars : ParticleField;
public var cloudMaterial : BitmapMaterial;
 
[Embed (source="/../assets/Earth.jpg")]
private var EarthMap : Class;
 
[Embed (source="/../assets/star.png")]
private var particleBitmap : Class;
 
[Embed (source="/../assets/earthcloudmap.png")]
private var CloudMap : Class;
 
public var particles : Particles;
public var particle : Particle
public var counter : int = 0 ;
 
public function earth()
{
super(500,400);
 
var earthbmp:BitmapData = new EarthMap().bitmapData;
var earthmaterial:BitmapMaterial = new BitmapMaterial(earthbmp);
 
var clouds : BitmapData = new CloudMap().bitmapData;
 
// luz
light = new PointLight3D();
light.x = 300;
light.y = 300;
 
// tipo de shader que uso...
 
shader = new GouraudShader(light, 0xFFFFFF,0x404040)
 
// y el material.
var shadedmaterial:ShadedMaterial = new ShadedMaterial(earthmaterial, shader);
shadedmaterial.smooth=true;
 
//creo la primer esfera, la tierra
sphere = new Sphere(shadedmaterial, 150,24,16);
 
//material para la nubes
cloudMaterial = new BitmapMaterial(clouds)
cloudMaterial.smooth = true;
cloudMaterial.doubleSided = false;
 
// creo la segunda esfera
sphere2 = new Sphere(cloudMaterial,160,24,16); 
 
//creo el sistema de particulas
particles = new Particles();
 
//saco el bitmap para crear un material que sera aplicado a cada particula
var particlematerial : BitmapParticleMaterial = new BitmapParticleMaterial(new particleBitmap().bitmapData,0.5,-32,-32);
 
//creo 500 estrellas y la dispongo en el espacio entre 1000 y -500
for(var i : int = 0; i< 500; i++)
{
var particle : Particle = new Particle(particlematerial, 1, (Math.random()*1000) -500, (Math.random()*1000) -500, (Math.random()*3000) -1500);
particles.addParticle(particle);
}
//agrego al sceneario el sistema de particulas
scene.addChild(particles);
 
//agrego la tierra
scene.addChild(sphere);
//agrego las nubes
scene.addChild(sphere2); 
 
//punto de interes de la camara
camera.fov = 30;
 
addEventListener(Event.ENTER_FRAME, enterFrame);             
 
}
 
public function enterFrame(e:Event) : void
{
counter++;
 
sphere.yaw(-1);
sphere2.yaw(-0.5);
particles.yaw(-0.01);
particles.pitch(-0.01);
 
//camera.x = Math.sin(counter*0.02) * 2000;  si quieren que sea automatico en vez de seguir el mouse lo pueden hacer con una onda senoidal
camera.x = ((320-mouseX)*0.01) * 2000;
singleRender();
 
}
 
}
}

Descanzar los ojos frente al monitor

Hoy encontré una aplicación bastante simpática que te va cambiando el brillo de la pantalla según la hora del día. Nosotros que estamos hasta 16 horas por día en la computadora puede resultar en un cansancio excesivo en lo ojos por estar mirando fijo una pantalla muy brillante. Está parece ser una fácil solución, para aquellos preocupados por controles de color, tiene una opción para volver al brillo normal para hacer correciones. Pruébenlo y comenten que les parece.

http://www.stereopsis.com/flux/

galeria jquery de pantalla completa

Un post muy cortito solo para compartir esta excelente galeria jqueryde pantalla completa

http://manos.malihu.gr/sideways-jquery-fullscreen-image-gallery