LogoLogo
  • Home
  • Projects
  • About
  • Contact

PV3D Image Extrusion

Devon O. · September 07, 2009 · Actionscript · 6 comments
3

You know, you’d think with all the 3D crap I’ve been playing with lately that I actually like the stuff. I’m really not that into 3D work in Flash. I just had to try out Augmented reality when it first came around and seemed to get sucked into it all. I guess it really is interesting. Just wish I understood it all beyond utilizing libraries written by others. Ah well. That bit of rambling aside, I was looking around the other day for a way to extrude text with Papervision3D, when a bit of googling led me to Den Ivanov’s awesome ExtrudedBitmap class. This seemed like it would do just what I needed. My first thought was to put the text I wanted into a .png file and load it using Ivanov’s class. But poking through the code a bit, I thought, why bother loading something – why not simply pass the class an image directly and let it do its thing? So, I played around a little bit and came up with this ExtrudedImage class (still 98.23% Ivanov’s work, but still)…

C#
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
package {
    
    import flash.display.Bitmap;
    import flash.display.BitmapData;
    import flash.display.DisplayObject;
    import flash.display.Loader;
    import flash.display.MovieClip;
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.net.URLRequest;
 
    import org.papervision3d.core.proto.MaterialObject3D;
    import org.papervision3d.materials.BitmapMaterial;
    import org.papervision3d.materials.ColorMaterial;
    import org.papervision3d.objects.DisplayObject3D;
    import org.papervision3d.objects.primitives.Plane;    
 
    /**
     * @author den ivanov
     *            www.cleoag.ru
     *            den [at] cleoag.ru
     *
     * slightly modified by devon wolfgang
     *             www.onebyonedesign.com
     *
     */
    public class ExtrudedImage extends DisplayObject3D {
 
        private var front:Plane;
        private var back:Plane;
        private var sides:ExtrudedBitmapSides;
        private var zoom:int;
        private var image:BitmapData;
        private var depth:Number;
        private var loader:Loader;
        private var useSmooth:Boolean;
 
        public function ExtrudedImage(img:DisplayObject, useSmooth:Boolean = false, zoomRatio:int = 20, depth:Number = 100) {
            super();
            this.zoom = zoomRatio;
            this.depth = depth * .5;
            this.useSmooth = useSmooth;
            extrudeImage(img);
        }
        
        private function extrudeImage(img:DisplayObject):void {
            clear();
            image = new BitmapData(img.width, img.height, true, 0x00000000);
            image.draw(img);
            
            var m1:BitmapMaterial = new BitmapMaterial(image);
            m1.smooth = useSmooth;
            front = new Plane(m1, image.width * zoom, image.height * zoom, Math.floor(image.width * .25), Math.floor(image.height * .25));
            front.name = "front";
            
            var m2:BitmapMaterial = new BitmapMaterial(image);
            m2.smooth = useSmooth;
            m2.opposite = true;
            back = new Plane(m2, image.width * zoom, image.height * zoom, Math.floor(image.width * .25), Math.floor(image.height * .25));
            back.name = "back";
            
            front.z = -depth;
            back.z = depth;
            
            addChild(front);
            addChild(back);
            
            var m3:BitmapMaterial = new BitmapMaterial(image);
            m3.smooth = useSmooth;
            sides = new ExtrudedBitmapSides(m3, image, zoom, depth);
            sides.name = "sides";
            addChild(sides);
        }
        
        override public function get material():MaterialObject3D { return front.material }
        
        override public function set material(value:MaterialObject3D):void {
            front.material = value;
            back.material = value;
            sides.material = value;
        }
        
        public function clear() : void {
            if (image != null) {
                removeChild(sides);
                removeChild(front);
                removeChild(back);
                sides = null;
                front = null;
                back = null;
                image.dispose();
            }
        }
    }
}

With these changes, now intstead of passing the class a url to an image file, you just pass it an image (DisplayObject instance, that is) directly. This means you can create DisplayObjects on the fly (including those with text) and make 3D extrusions of them. Also, by giving the PV3D items inside the ExtrudedImage class names (“front”, “back”, and “sides”) you can reference those items and swap out their materials (or add a shader to them or what have you). Sort of like this:

C#
1
2
3
4
5
var extrudedImage = new ExtrudedImage(someSprite, true, 4);
var shader:GouraudShader = new GouraudShader(_light);
var shadeMat:ShadedMaterial = new ShadedMaterial((extrudedImage.material) as BitmapMaterial, shader);
shadeMat.smooth = true;
extrudedImage.getChildByName("front").material = shadeMat;

So, after coming up with text effect I was looking for in the first place, I played around a bit more and came up with little example app. Use the drawing tool to the left to create a work of art (click the top black square to change the color, the black circle to change the brush shape, the slider to change the brush size, and draw on the graph paper). When finished, click “save”, give it a span of time or two, then check out your creation in glorious 3D to the right (use the mouse to hover around a bit and mousewheel to zoom in/out). Pretty freaking nifty. Of course all the credit really goes to Den Ivanov. I have next to no idea how it works. :)

Get Adobe Flash player

  Facebook   Pinterest   Twitter   Google+
papervision3d
  • Saving Files Directly from Flash Player 10
    May 23, 2008 · 1 comments
    2932
    3
    Read more
  • AIR Cookbook Beta hits the Cyberstreets
    June 18, 2008 · 0 comments
    2364
    2
    Read more
  • Liquid On Screen Effect
    February 24, 2019 · 0 comments
    I really wasn't sure what to call this Unity3D post processing effect, but it's
    2783
    16
    Read more
6 Comments:
  1. would it be possible to see your source? I can’t quite seem to get mine up and running.

    Marissa · March 08, 2010
  2. I had issues with this but was wondering why you didn’t type the var in the example code?
    var extrudedImage = new ExtrudedImage(someSprite, true, 4);

    I couldn’t get my image to extrude.

    Gerry · April 20, 2010
  3. Nevermind that last comment, I did get it to extrude. Now I’ll be working on using a different back image.

    Gerry · April 20, 2010
  4. Glad you got it working. Why I didn’t type the var – I don’t know. Maybe I was just testing to see if anyone noticed.. :)

    Devon O. · April 20, 2010

Leave a Comment! Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Devon O. Wolfgang

AIR | Unity3D | AR/VR

Unity Certified Developer

Technical Reviewer of “The Essential Guide to Flash CS4 AIR Development” and “Starling Game Development Essentials”

Reviewer of “The Starling Handbook”

Unity Engineer at Touch Press.

Categories
  • Actionscript (95)
  • AIR (16)
  • Flash (99)
  • Games (7)
  • Liberty (13)
  • Life (53)
  • Shaders (20)
  • Unity3D (21)
Recent Comments
  • MainDepth on Unity Ripple or Shock Wave Effect
  • Devon O. on Unity Ripple or Shock Wave Effect
  • Feral_Pug on Unity Ripple or Shock Wave Effect
  • bavvireal on Unity3D Endless Runner Part I – Curved Worlds
  • Danielius Vargonas on Custom Post Processing with the LWRP
Archives
  • December 2020 (1)
  • December 2019 (1)
  • September 2019 (1)
  • February 2019 (2)
  • December 2018 (1)
  • July 2018 (1)
  • June 2018 (1)
  • May 2018 (2)
  • January 2018 (1)
  • December 2017 (2)
  • October 2017 (1)
  • September 2017 (2)
  • January 2017 (1)
  • July 2016 (1)
  • December 2015 (2)
  • March 2015 (1)
  • September 2014 (1)
  • January 2014 (1)
  • August 2013 (1)
  • July 2013 (1)
  • May 2013 (1)
  • March 2013 (2)
  • December 2012 (1)
  • November 2012 (1)
  • September 2012 (3)
  • June 2012 (2)
  • May 2012 (1)
  • April 2012 (1)
  • December 2011 (2)
  • October 2011 (3)
  • September 2011 (1)
  • August 2011 (1)
  • July 2011 (1)
  • May 2011 (2)
  • April 2011 (2)
  • March 2011 (1)
  • February 2011 (1)
  • January 2011 (2)
  • December 2010 (3)
  • October 2010 (5)
  • September 2010 (1)
  • July 2010 (2)
  • May 2010 (5)
  • April 2010 (2)
  • March 2010 (7)
  • February 2010 (5)
  • January 2010 (5)
  • December 2009 (3)
  • November 2009 (1)
  • October 2009 (5)
  • September 2009 (5)
  • August 2009 (1)
  • July 2009 (1)
  • June 2009 (2)
  • May 2009 (6)
  • April 2009 (4)
  • March 2009 (2)
  • February 2009 (4)
  • January 2009 (1)
  • December 2008 (5)
  • November 2008 (2)
  • September 2008 (1)
  • August 2008 (6)
  • July 2008 (6)
  • June 2008 (9)
  • May 2008 (4)
  • April 2008 (3)
  • March 2008 (4)
  • February 2008 (9)
  • January 2008 (7)
  • December 2007 (6)
Copyright © 2021 Devon O. Wolfgang