Fading a un punto de fuga en Flash, Programatically (por supuesto)

Question

Estoy tratando de hacer un tipo Star Wars cosa desaparición como esta , pero programáticamente.

La mayor parte de lo que han hecho es fácil de programar (hacer una interpolación de movimiento), pero me gustaría para generar el gráfico basado texto mediante programación, así (de texto utilizando un obj texto dinámico, por ejemplo).

La pregunta, tal como lo veo (pero estoy abierto a otras formas de ver, por supuesto) es: ¿hay alguna manera de conseguir un rectángulo rasgados unilateral de mi-texto dinámico objeto? El scale9Grid mencionado aquí no lo hará, estoy completamente seguro. Quiero especificar cuatro puntos para obtener un rombo (si eso es lo que se llama).

Answer 1

Si está compilando para el reproductor de flash de 10 (que requiere CS4 o un SDK de Flex reciente), que sólo puede girar el campo de texto en 3D:

text.rotateX = -45;

Existen algunas cuestiones más con esto, como es necesario utilizar la incrustación de fuentes, y conseguir el punto de fuga en el centro del campo.

Hacer esto en el reproductor de flash de <10 con mapas de bits es también posible, si usted es masoquista, y no les importa un poco de aliasing vertical. La idea sería utilizar BitmapData.draw () para dibujar cada línea con un recorte rect altura de 1 y una transformación para hacer la división perspectiva. Por ejemplo (en flexión):

class Main extends Sprite
{
    [Embed(systemFont="Arial", fontName="embedFont", mimeType="application/x-font")]
    var embedFont:Class;

    public function Main()
    {
        var text:TextField = new TextField();
        text.defaultTextFormat = new TextFormat("embedFont", 30);
        text.embedFonts = true;
        text.autoSize = TextFieldAutoSize.LEFT;
        text.text = "Hello, world\nHow nice\nto have\nmultiple\nlines!";
        var bmp:BitmapData = new BitmapData(150, 100);

        for (var i:int = 0; i != bmp.height; ++i) {
            var m:Matrix = new Matrix();
            // x-division, change 0.8, 0.2 to change scale increase, scale at top
            m.a = i*(0.8/bmp.height)+0.2;
            // horizontal center
            m.tx = bmp.width * (1-m.a) / 2;
            // y-division, and align text to bottom
            m.ty = (bmp.height-i)/m.a - bmp.height; 
            bmp.draw(text, m, null, null, new Rectangle(0, i, bmp.width, 1));
        }

        addChild(new Bitmap(bmp));
    }
}

No he hecho las matemáticas, así que no sé si eso es físicamente exacta, pero debe darle una idea.

Answer 2

Es posible considerar la conversión del objeto de texto a una imagen, y luego hacer que a la imagen.

-Adán

Answer 3

Realmente no se puede hacer esto de una manera sencilla en Flash Player 9 y versiones anteriores.
Flash player 10 y Flash CS4 introduce algunas soporte básico para transformaciones 3D, pero estos son muy simples, y supongo que esta perspectiva "extrema" podría ser difícil de hacerlo bien. Yo sin embargo no he utilizado la herramienta de edición CS4, por lo que podría ser más fácil en ese país.

También están los motores 3D completos como papervision y away3d aunque son un poco excesivo.

Lo que creo que podría ser mejor es utilizar un DisplacementMapFilter , tuve algunos problemas para encontrar ningún buenos ejemplos de esta línea, y en realidad nunca lo he hecho, pero creo que la ejemplo, en los documentos servirán para iniciar bien.

Si usted se siente por ello que puede también acaba de sacar todos los píxeles de un mapa de bits y tener al uno por uno, que podría ser la cosa más divertida de código, pero es probable que sea bastante lento y no parece tan bueno;)