Esta es una demostración de lo fácil que es desarrollar aplicaciones en Flash CS3. Después de los diversos debates sobre el desarrollo de un "borrar", propongo una sencilla aplicación que implemente plenamente algunas de las cosas dichas en posts anteriores. En este ejemplo he añadido una barra de herramientas "arrastrar", la capacidad de elegir el color del pincel y el color de fondo, la selección del instrumento de "borrado" y un ligero "desenfoque" en el diseño!
A partir de los códigos previstos en crear una pintura en Flash CS3 , y la realización de pequeñas modificaciones, puede mejorar el instrumento de "borrar". Cómo añadir una figura no está visible, se puede utilizar como un "plan" para ejecutar el draw() en el modo de mezcla de "borrado". Como se muestra en el ejemplo siguiente, después de dibujar algo, mantenga pulsada la tecla Ctrl y el efecto de "eliminar" aparece ahora en tiempo real.
El código es el siguiente - Fuente :
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 | . MouseEvent ; flash.events de importación. MouseEvent ; . BitmapData ; import flash.display. BitmapData ; . Bitmap ; la importación flash.display. mapa de bits ; . GradientType ; import flash.display. GradientType ; / / . Matrix ; . flash.geom importación Matrix ; / / Boolean = false ; var md: Boolean = false; / / Sprite = new Sprite ( ) ; var event_spr: Sprite = new Sprite (); event_spr ) ; addChild (event_spr); / / Number = event_spr . stage . stageWidth ; area_width var: Número .. = event_spr prácticas stageWidth; Number = event_spr . stage . stageHeight - 32 ; area_height var: Número .. = event_spr prácticas stageHeight - 32; / / String = GradientType . LINEAR ; fillType var: Cadena = GradientType LINEAL;. : Array = [ 0xFF0000 , 0x00FF00 , 0x0000ff ] ; var colores: matriz = [0xFF0000, 0x00FF00 0x0000FF]; : Array = [ 1 , 1 , 1 ] ; alfas var: matriz = [1, 1, 1]; : Array = [ 0 , 128 , 255 ] ; var relaciones: matriz = [0, 128, 255]; String = SpreadMethod . PAD ; spreadMethod var: Cadena = SpreadMethod PAD;. : Matrix = new Matrix ( ) ; var matriz: matriz = new Matrix (); createGradientBox ( area_width , area_height , 1 , 0 , 0 ) ; . matriz createGradientBox (area_width, area_height, 1, 0, 0); / / event_spr . graphics ) { con (event_spr. gráficos) { fillType , colors , alphas , ratios , matrix , spreadMethod ) ; beginGradientFill (fillType, colors, alphas y ratios, la matriz, spreadMethod); 0 , 0 , area_width , area_height ) ; drawRect (0, 0, area_width, area_height); ; endFill (); } / / Eventos Paint ( MouseEvent . MOUSE_DOWN , _onMouseDown ) ; . event_spr addEventListener ( MouseEvent MOUSE_DOWN, _onMouseDown.); ( MouseEvent . MOUSE_MOVE , _onMouseMove ) ; . event_spr addEventListener ( MouseEvent MOUSE_MOVE, _onMouseMove.); ( MouseEvent . MOUSE_UP , _onMouseUp ) ; . event_spr addEventListener ( MouseEvent MOUSE_UP, _onMouseUp.); ( MouseEvent . MOUSE_OUT , _onMouseUp ) ; . event_spr addEventListener ( MouseEvent MOUSE_OUT, _onMouseUp.); / / BitmapData = new BitmapData ( event_spr . width , event_spr . height , true , 0 ) ; var bmpd: BitmapData = new BitmapData (ancho event_spr., event_spr altura, verdadero, 0.); Bitmap = new Bitmap ( bmpd ) ; var bmp: Bitmap = new Bitmap (bmpd); bmp ) ; addChild (bmp); / / Forma / / Temporal Shape = new Shape ( ) ; draw_shape var: Shape = new Shape (); draw_shape ) ; addChild (draw_shape); / / / / Forma, no se muestra, que se utiliza para la "cancelación" Shape = new Shape ( ) ; erase_shape var: Shape = new Shape (); / / e : MouseEvent ) : void { función de _onMouseDown (e: MouseEvent ): void { ) ; debug ("_onMouseDown"); . lineStyle ( 10 , 0xffffff , 1 ) ; .. draw_shape gráficos lineStyle (10, 0xffffff, 1); . lineStyle ( 20 , 0xffffff , 1 ) ; .. erase_shape gráficos lineStyle (20, 0xffffff, 1); . moveTo ( e . localX , e . localY ) ; .. draw_shape gráficos moveTo (and. localX y localY.); . moveTo ( e . localX , e . localY ) ; .. erase_shape gráficos moveTo (and. localX y localY.); md = true; } / / e : MouseEvent ) : void { _onMouseUp function (e: MouseEvent ): void { md = false; . draw ( draw_shape ) ; .. bmp bitmapData empate (draw_shape); . clear ( ) ; draw_shape gráficos claros ()..; . clear ( ) ; erase_shape gráficos claros ()..; } / / e : MouseEvent ) : void { _onMouseMove function (e: MouseEvent ): void { ) ; debug ("_onMouseMove"); md && ! e . ctrlKey ) { if (md &&! y. ctrlKey) { . lineTo ( e . localX , e . localY ) ; .. draw_shape gráficos lineTo (and. localX y localY.); ( md && e . ctrlKey ) { } Else if (&& md correo. CtrlKey) { . lineTo ( e . localX , e . localY ) ; .. erase_shape gráficos lineTo (and. localX y localY.); . draw ( erase_shape , null , null , "erase" ) ; bmp bitmapData draw (erase_shape, null, null, "borrar")..; } } / / v : String ) : void { depuración de la función (v: Cadena ): void { : Date = new Date ( ) ; var d: Fecha = new Date (); d . getMinutes ( ) + ":" + d . getSeconds ( ) + ":" + d . getMilliseconds ( ) + ": " + v ) ; trace (m. getMinutes () + "" + d getSeconds () + "." + d getMilliseconds () + "" + v.); } |
): Hemos añadido una nueva forma, erase_shape no visible (que no se hizo ningún addChild() ):
1 2 3 |
En el código que se encarga de dibujo se ha introducido para la tecla de control y, si se pulsa, se refiere precisamente la forma erase_shape y se copian en el mapa de bits:
1 2 3 | .... . lineTo ( e . localX , e . localY ) ; .. erase_shape gráficos lineTo (and. localX y localY.); . draw ( erase_shape , null , null , "erase" ) ; bmp bitmapData draw (erase_shape, null, null, "borrar")..; |
Como se discutió en flash concurso de ActionScript: herramienta de borrado no se puede "borrar" un área en particular de un Sprite, MovieClip o la forma en que líneas fueron dibujadas a través de los gráficos de puntero o rectángulos. Hay, de hecho, el único método clear() que, sin embargo, no tiene efecto sobre toda el área de nuestro objeto. La solución al problema radica en la posibilidad de utilizar el mapa de bits y objetos BitmapData. Como veremos más adelante podemos acceder directamente y manipular mapas de bits con el fin de "borrar" golpes con un instrumento real "borrador".
Presentar dos métodos diferentes para lograr la "puerta". per esempio. El primer "draw" (borrar) los datos directamente en el BitmapData, utilizando el método fillRect() - también se puede utilizar setPixel() por ejemplo. El segundo método, la que yo prefiero, utiliza los métodos de las fusiones (blendMode).
En primer lugar vamos a ver qué tipo de organización es necesaria para alcanzar un mínimo de un pintor sencillo en Flash. En el diagrama siguiente se aplica a ambas propuestas, la "puerta":
He creado tres capas: la primera MovieClip o Sprite, y funciona como un controlador de eventos de fondo (MouseDown, MouseMove y MouseUp). El mapa de bits en segundo lugar, es nuestras capas principales, uno que realmente dibujado de gráficos se aplicarán y en el que la "puerta". , ecc…). La capa de la tercera y última, la forma, aborda dos cuestiones: la primera es que permite el uso directo de las funciones proporcionadas por el cursor de gráficos (como lineStyle , drawRect() , etc ...). También aumenta el rendimiento durante el gráfico de seguimiento, tal como se explica en detalle a continuación.
Para completar, en relación con la pintura de Flash CS3: Matriz de efectos con matrices quiero hacer hincapié en que la Matrix no son necesarios para el comportamiento mostrado en el post anterior. De hecho vemos en el ejemplo siguiente:
El código es ligeramente diferente de la anterior, es como sigue:
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 | / * Código de ActionScript 2.0 ** * / . MouseEvent ; flash.events de importación. MouseEvent ; . Matrix ; . flash.geom importación Matrix ; / / Bandera para detectar la mousedown Boolean = false ; var md: Boolean = false; / / Crear un frente de la pizarra Sprite = new Sprite ( ) ; var lvg1: Sprite = new Sprite (); . lineStyle ( 0 , 0xffffff ) ; lvg1 gráficos. LineStyle (0, 0xFFFFFF).; . beginFill ( 0x666666 ) ; .. lvg1 gráficos beginFill (0x666666); . drawRect ( 0 , 0 , 199 , 199 ) ; .. lvg1 gráficos drawRect (0, 0, 199, 199); . endFill ( ) ; lvg1 gráficos. endFill ().; lvg1 ) ; addChild (lvg1); = lvg1 . y = 30 ; lvg1 x = lvg1 y = 30..; / / Crear la pizarra inclinada Sprite = new Sprite ( ) ; var lvg2: Sprite = new Sprite (); . lineStyle ( 0 , 0xffffff ) ; lvg2 gráficos. LineStyle (0, 0xFFFFFF).; . beginFill ( 0x666666 ) ; .. lvg2 gráficos beginFill (0x666666); . drawRect ( 0 , 0 , 199 , 199 ) ; .. lvg2 gráficos drawRect (0, 0, 199, 199); . endFill ( ) ; lvg2 gráficos. endFill ().; = 400 ; lvg2 x = 400.; = lvg1 . y ; lvg2 y = y lvg1..; = 45 ; . lvg2 rotación = 45; = lvg2 . scaleY = . 6 ; lvg2 scaleX lvg2 scaleY = 6...; lvg2 ) ; addChild (lvg2); / / / / Eventos Paint ( MouseEvent . MOUSE_DOWN , _onMouseDown ) ; . lvg1 addEventListener ( MouseEvent MOUSE_DOWN, _onMouseDown.); ( MouseEvent . MOUSE_MOVE , _onMouseMove ) ; . lvg1 addEventListener ( MouseEvent MOUSE_MOVE, _onMouseMove.); ( MouseEvent . MOUSE_UP , _onMouseUp ) ; . lvg1 addEventListener ( MouseEvent MOUSE_UP, _onMouseUp.); / / e : MouseEvent ) : void { función de _onMouseDown (e: MouseEvent ): void { "_onMouseDown" ) ; trace ("_onMouseDown"); : uint = 0xffffff ; var c: uint = 0xFFFFFF; . graphics . lineStyle ( 10 , c , 1 ) ; ... y objetivo gráficos lineStyle (10, c, 1); . lineStyle ( 10 , c , 1 ) ; .. lvg2 gráficos lineStyle (10, c, 1); . graphics . moveTo ( e . localX , e . localY ) ; ... y el objetivo de gráficos moveTo (and. localX y localY.); . moveTo ( e . localX , e . localY ) ; .. lvg2 gráficos moveTo (and. localX y localY.); md = true; } / / e : MouseEvent ) : void { md = false ; } _onMouseUp function (e: MouseEvent ): void {md = false;} / / e : MouseEvent ) : void { _onMouseMove function (e: MouseEvent ): void { "_onMouseMove" ) ; trace ("_onMouseMove"); md ) { if (md) { . graphics . lineTo ( e . localX , e . localY ) ; ... y el objetivo de gráficos lineTo (and. localX y localY.); . lineTo ( e . localX , e . localY ) ; .. lvg2 gráficos lineTo (and. localX y localY.); } } |
En este caso, las líneas 22 a 25 muestran que incluso con una simple rotación y desplazamiento efecto se repite.
Jugando con el objeto de gran alcance y versátil Matrix (matriz), vinculado a las transformaciones, que puede hacer cosas raras. Estas herramientas se utilizan para aplicar transformaciones particulares para un objeto visual, tal como un sprite. Puede, por ejemplo, escalar, rotar, o giro (inclinación) un Sprite. e rotation ), per l'effetto Skew bisogna ricorrere direttamente alle matrici. Mientras que las dos primeras funciones (escala y rotación) los objetos Sprite (y otros) ofrecen directamente las propiedades ( scaleX / scaleY , y rotation ), el efecto de sesgo debe apelar directamente a las matrices. Lo que me gustaría destacar aquí es que cuando se modifica un objeto gráfico todas sus coordenadas internas se desplazan:
Algunos, con razón, discutir acerca de la Adobe AIR, Adobe Integrated Runtime (antes Apollo) ofrecido por Adobe. ¿De qué estamos hablando? Después de todo el aire es todavía una versión beta ( la última versión es 12/12/2007 - la beta 3 ) y su éxito, incluyendo, queramos o no, depende de muchos factores.
Que decirlo ahora: no se gana nada! Aparte de la soberbia - si algo - que han resuelto el problema.
Cómo crear una herramienta para borrar, eliminar, borrar, una "porción" de los gráficos dibujados con la API de ActionScript 3.0?
, espongono la proprietà graphics , un puntatore ad un altro oggetto che “serve” tutte le funzioni grafiche di disegno runtime. Con ActionScript 3.0 Algunos de los objetos visuales, como el MovieClip o de Shape , mostrando las propiedades de graphics , un puntero a otro objeto que "sirve" todas las características gráficas de tiempo de ejecución de los dibujos. Por ejemplo, usted puede desarrollar una aplicación de dibujo sencillo. , in modo semplice e rapido. Este objeto graphics permite dibujar cualquier cosa, por ejemplo en un objeto de Shape , de una forma sencilla y rápida. El problema es que algo una vez que se extrae puede limpiar todo, pero no una sola parte.
Dibuja una línea es fácil:
1 2 3 4 5 6 |
Dibujado algo que se puede limpiar todo con la simple llamada a clear() :
1 | . clear ( ) ; myShape gráficos claros ()..; |
Pero si quiero "eliminar" un solo punto? O de las coordenadas 50,50 hasta 100.100?
Buscando en Internet he encontrado varios ejemplos de "aplicaciones de diseño" y, de hecho, la herramienta no ofrece ningún apoyo o "Eliminar".
¿Tiene alguna solución?
Yahoo! acaba de lanzar el ASTRA , una suite de componentes para Flash y Flex . Tengo que decir que, al menos en lo que respecta a los componentes de Flash, tuve una decepción de la mitad (si no total). Lo más interesante, quizás, es el TabBar ... el resto deja mucho que desear. Buscan algunos componentes desarrollaron su proyecto - interno - y ahora lanzado como producto abierto! Tal vez, en Yahoo!, ya estamos alineados con las políticas de Microsoft ... ya que hoy la compañía de software fundada por Bill ofreció 44,6 millones de dólares para comprar Yahoo!! 44,6 mil millones, no he escrito mal!
Pero hacer un viaje en el sitio donde usted puede encontrar varios recursos útiles. Esperamos en un futuro próximo.
. De nuevo en el "uniforme", como ocurrió con los eventos (ver el nuevo evento el manejo de Flash CS3 y Flash CS3: La nueva gestión de eventos ), una de las muchas nuevas características de ActionScript 3.0 es la desaparición de todos los ad hoc de métodos dedicados a la creación de objetos particulares, como por ejemplo: createEmptyMovieClip() o el famoso attachMovie() . Con ActionScript 3.0 que el operador new es suficiente para llevar a cabo todo el edificio de operaciones. Un nuevo clip de película, por ejemplo, se crea (en tiempo de ejecución) con el siguiente código:
1 2 |
Pero vamos! Si tengo un símbolo de la biblioteca y cómo puedo ir si quiero añadir tiempo de ejecución de attachMovie() se ha ido? La solución no es muy diferente de lo que sucedió en ActionScript 2.0. En primer lugar tienes que ir a la biblioteca, seleccione el símbolo y abra la ventana de propiedades. A continuación, marque la casilla Exportar para encadenar ActionScript - como sucedió en Flash 8. Una biblioteca de símbolos como una clase base siempre ha flash.display.MovieClip , pero esto no nos interesa mucho. Lo interesante, sin embargo, es la clase de parámetro que se establece por defecto (cuando te registras Exportar para ActionScript) con el nombre del símbolo. Lo importante a destacar es que esta es una nueva forma en Flash CS3 (y ActionScript 3.0). El símbolo a la exportación debe tener una referencia de clase. La curiosidad es que no estamos obligados a crear nuestra propia fuerza a la clase (se extendió desde flash.display.MovieClip ), a pesar de que podía hacerlo.
Yo ya había hablado en Flash CS3: La nueva gestión de eventos . Vuelvo a la pregunta de sottolieare la diferencia de este nuevo enfoque en comparación con versiones anteriores de ActionScript. Esquemáticamente, tenemos una situación general de este tipo:
Cualquier objeto que admite eventos, en última instancia, siempre se expone el método addEventListener (). En la documentación, entre otras cosas, decía:
¿Qué hay de nuevo para los detectores de eventos en ActionScript 3.0
[...] Para añadir detectores de eventos en ActionScript 2.0 es a veces se utiliza addListener () y, a veces a addEventListener (), mientras que en ActionScript 3.0 mediante addEventListener () en todas las situaciones.
[..]
La gestión de eventos, entonces, está normalizado en el nivel de escucha real. Todas las "características" de escuchar, de hecho, tienen la siguiente estructura:
1 2 3 | eventObject : EventType ) : void { eventResponse function (eventObject: EventType): void { / / Las acciones en respuesta a los eventos se definen aquí. } |
o una sua sottoclasse. EvenType es siempre un objeto de clase Event o una subclase. . Esto permite obtener siempre información específicas para el caso particular, además de la manipulación de las propiedades estándar, como target o currentTarget .
Una diferencia importante con las versiones anteriores de ActionScript, con respecto al oyente, es que:
En ActionScript 2.0, los detectores de eventos pueden ser funciones, métodos y objetos, mientras que en ActionScript 3.0 pueden ser detectores de eventos sólo funciones o métodos.
Así que, después de haber utilizado para algún tipo de estructura el tiempo "a los acontecimientos de las versiones anteriores de Flash, debo decir que este nuevo enfoque es realmente agradable. Es un poco 'que el desarrollo con ActionScript 3.0 y, después de una pequeña pérdida inicial (sólo para recuperar lo que se suponía anteriormente) ahora no puedo comprender cómo podía soportar el "viejo" método de los acontecimientos de las versiones anteriores.
Últimos Comentarios
kOoLiNuS : @ Giovambattista Fazioli: ¡gracias! más que dispuesto!
Giovambattista Fazioli : @ kOoLiNuS: Calma, es probable que pueda anticipar que WPX Cleanfix será gratuito, y ...
kOoLiNuS : @ kOoLiNuS: una falta
y un 
kOoLiNuS : @ Giovambattista Fazioli: me suscribí, pero cuando yo tenía mi uso de la plataforma de aficionados ...
Giovambattista Fazioli : @ kOoLiNuS: Sí, este es un problema conocido. Se produce cuando las tablas en cuestión son ...