LogoLogo
  • Home
  • Projects
  • About
  • Contact

Gone Bowling

Devon O. · June 21, 2009 · Actionscript, Flash · 0 comments
4

Just finished work on a simple little bowling game using the JiglibFlash physics engine and Papervision3D. It’s not a fully functional game as there are no frames or score keeping, but it was made as an example file for a tutorial so was deliberately kept simple. To play, first click on the little green rectangle to position the ball horizontally. Then, to roll, click the red square. The higher up on the square you click, the more forward power the ball will have. The angular power of the ball is determined by the horizontal location of your mouse click. Just play around, you’ll see what I’m talking about. And, just because it’s 3D, you can move the camera around using the arrow keys and your mousewheel.

Get Adobe Flash player

For anyone interested on how to build something like that, I just submitted the full and rather lengthy tutorial to The TechLabs. Hopefully they’ll use it. If not, I’ll publish it myself. So, if interested, it’s coming out one way or another, just keep your eyes peeled.

On an unrelated note, in my Twisty Cubes post, I mentioned in a comment that once I used that code for myself, I’d go ahead and make it public (though it ain’t that complex and you’ll probably be pretty disappointed). Well, I went ahead and used it in an updated version of my portfolio, so true to my word, here is the source for anyone who wants to play around with it (just to make it abundantly clear, the script below produces the effect seen here):

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
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
package {
    
    import com.as3dmod.modifiers.Twist;
    import com.as3dmod.ModifierStack;
    import com.as3dmod.plugins.pv3d.LibraryPv3d;
    
    import flash.text.AntiAliasType;
    import flash.text.TextField;
    import flash.text.TextFieldAutoSize;
    import flash.text.TextFormat;
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.events.MouseEvent;
    import flash.filters.DropShadowFilter;
    
    import net.hires.debug.Stats;
    
    import gs.easing.Back;
    import gs.easing.Quad;
    import gs.TweenLite;
    
    import org.papervision3d.cameras.Camera3D;
    import org.papervision3d.lights.PointLight3D;
    import org.papervision3d.materials.BitmapMaterial;
    import org.papervision3d.materials.shadematerials.FlatShadeMaterial;
    import org.papervision3d.materials.shaders.PhongShader;
    import org.papervision3d.materials.shaders.ShadedMaterial;
    import org.papervision3d.materials.utils.MaterialsList;
    import org.papervision3d.render.BasicRenderEngine;
    import org.papervision3d.scenes.Scene3D;
    import org.papervision3d.view.Viewport3D;
    import org.papervision3d.objects.primitives.Cube;
    
    /**
     * Mmmmmm... Twisty Cubes...
     * @author Devon O Wolfgang
     */
    
    [SWF(width="500", height="400", frameRate="60", backgroundColor="#222222")]
    public class Main extends Sprite {
        
        [Embed(source = "../assets/be_1.jpg")]
        private var Image1:Class;
        [Embed(source = "../assets/bf_1.jpg")]
        private var Image2:Class;
        [Embed(source = "../assets/hrr_1.jpg")]
        private var Image3:Class;
        [Embed(source = "../assets/zs_1.jpg")]
        private var Image4:Class;
        
        private var _view:Viewport3D;
        private var _cam:Camera3D;
        private var _light:PointLight3D;
        private var _scene:Scene3D;
        private var _engine:BasicRenderEngine;
        
        private var _cube:Cube;
        
        private var _twist:Twist;
        private var _stack:ModifierStack;
        
        public function Main():void {
            if (stage) init();
            else addEventListener(Event.ADDED_TO_STAGE, init);
        }
        
        private function init(e:Event = null):void {
            removeEventListener(Event.ADDED_TO_STAGE, init);
            // entry point
            
            init3d();
            initText();
            initScene();
            startRender();
            
            //addChild(new Stats());
        }
        
        private function init3d():void {
            _view = new Viewport3D(500, 400);
            _scene = new Scene3D();
            _engine = new BasicRenderEngine();
            _cam = new Camera3D();
            _cam.y = 400;
            _cam.z = -850;
            
            _view.filters = [ new DropShadowFilter(40, 90, 0x000000, .6, 24, 24) ];
            
            addChild(_view);
        }
        
        private function initText():void {
            var tf:TextField = new TextField();
            var fmt:TextFormat = new TextFormat("_sans", 12, 0xDDDDDD);
            tf.defaultTextFormat = fmt;
            tf.autoSize = TextFieldAutoSize.LEFT;
            tf.selectable = false;
            tf.mouseEnabled = false;
            tf.antiAliasType = AntiAliasType.ADVANCED;
            tf.text = "Click anywhere to rotate cube.";
            tf.x = int((250) - (tf.textWidth * .5));
            tf.y = int(400 - tf.height);
            addChild(tf);
        }
        
        private function initScene():void {
            _light = new PointLight3D();
            _light.y = 400;
            _light.x = 50;
            _light.z = -600;
            
            var flatMat:FlatShadeMaterial = new FlatShadeMaterial(_light, 0x666666);
            
            var img1:BitmapMaterial = new BitmapMaterial(new Image1().bitmapData);
            var img1Mat:ShadedMaterial = new ShadedMaterial(img1, new PhongShader(_light, 0xFFFFFF));    
            var img2:BitmapMaterial = new BitmapMaterial(new Image2().bitmapData);
            var img2Mat:ShadedMaterial = new ShadedMaterial(img2, new PhongShader(_light, 0xFFFFFF));
            var img3:BitmapMaterial = new BitmapMaterial(new Image3().bitmapData);
            var img3Mat:ShadedMaterial = new ShadedMaterial(img3, new PhongShader(_light, 0xFFFFFF));
            var img4:BitmapMaterial = new BitmapMaterial(new Image4().bitmapData);
            var img4Mat:ShadedMaterial = new ShadedMaterial(img4, new PhongShader(_light, 0xFFFFFF));
            
            
            var matList:MaterialsList = new MaterialsList( { top:flatMat, bottom:flatMat, left:img1Mat, right:img2Mat, front:img3Mat, back:img4Mat } );
            _cube = new Cube(matList, 500, 500, 500, 5, 5, 5);
            _cam.target = _cube;
            
            _stack = new ModifierStack(new LibraryPv3d(), _cube);
            
            _twist = new Twist(0);
            
            _stack.addModifier(_twist);
            
            _scene.addChild(_cube);
            
            stage.addEventListener(MouseEvent.CLICK, doTwist);
        }
        
        private function doTwist(event:MouseEvent):void {
            TweenLite.to(_twist, .25, { angle:.6, ease:Quad.easeOut, onComplete:untwist } );
            TweenLite.to(_cube, .5, { rotationY:_cube.rotationY + 90 } );
        }
        
        private function untwist():void {
            TweenLite.to(_twist, .3, { angle:0, ease:Back.easeOut } );
        }
        
        private function startRender():void {
            addEventListener(Event.ENTER_FRAME, render);
        }
        
        private function render(event:Event):void {
            var ratio:Number = ((stage.mouseY / 400) - .5 ) * 2;
            var targetPos:Number = ratio * 600;
            var ang:Number = ratio * 90;
            _cam.y += (targetPos - _cam.y) / 20;
            _light.y = _cam.y;
            
            var shadow:DropShadowFilter = _view.filters[0];
            shadow.angle += (ang - shadow.angle) / 20;
            _view.filters = [shadow];
            _stack.apply();
            _engine.renderScene(_scene, _cam, _view);
        }
    }
}

Of course you’ll have to get a hold of AS3DMod if you don’t already have it. Have fun…

Incidentally, you may have noticed I have, once again, changed blog themes and added some google ads. I know, I just can’t leave well enough alone. And the ads are looking like a temporary experiment. I was more interested in how they worked from a developer/API viewpoint than anything. Of course, I figured if I made a few shekels in the process, what the hell? So far I’ve earned a whopping 43 cents. Look out…

  Facebook   Pinterest   Twitter   Google+
jiglibflashpapervision3d
  • Adventures in Playbook Land
    April 09, 2011 · 9 comments
    28636
    9
    Read more
  • Rockin and Rollin with the JiglibFlash Terrain
    March 16, 2010 · 8 comments
    2493
    6
    Read more
  • Adding Flash/Actionscript Content to a Flex Project
    March 29, 2008 · 0 comments
    1831
    1
    Read more

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