Shootorials #0, #1, and #2 with Free Tools - mtasc and swfmill page 3

84 posts

Flag Post

Thanks Erasmus_Darwin! After some tweaking, things are running smoothly.

 
Flag Post

Thanks exploding_ferret!

I too don’t have the resources to buy adobe.

Also, thanks for putting this tutorial together in a cross platform way. I code on all 3 systems(linux, Windows, Mac) , so not having to completely change my methods and tools between them is nice!

Thanks!

 
Flag Post

Very nice, works like a charm.

 
Flag Post

Does anyone know how to import a drawn movieclip from a swf into the library?

 
Flag Post

You import the swf like I have the Classes.swf in the XML I have, and whatever IDs there were in that SWF suddenly start being available in the ActionScript to do attachMovie, etc. You don’t even have to put the import in the <library/> section, because the IDs in that SWF have already had the linkage IDs named and exported.

There’s no way to access those from within the XML though, so you can’t in a single XML file: import a SWF and place a movieclip from it.

If you need to do that you’ll have to place it in you ActionScript instead.

 
Flag Post

Being too lazy to create a class that places my clips, I exported each movie clip as its own swf and imported all of them in the xml. Thanks for introducing these programs to me. I can finally work on my game at school directly from my flash drive.

 
Flag Post

Huh….Well….To confusing. Or maybe its just me….? Hm….Oh well, I’m not aloud to download anything anyway.

 
Flag Post

how do i make a game with sothing swf?

 
Flag Post

I have CS2, will that be ok?

 
Flag Post

I do not know how the shootorials would work with CS2. To follow these guides, I can’t see how CS2 would be helpful, it would be more like doing the shootorials than like using CS2.

 
Flag Post

Um. CS2 doesn’t HAVE Flash. It was still a Macromedia application when CS2 came out.

Flash 5, Flash MX, Flash MX2004, Flash 8, Flash CS3.

 
Flag Post

ok, I obviously know nothing about CS2 then, lol—I guess I was assuming it was just an earlier version of what I trialed for the shootorials. But then I would say to try using these guides. Some things are more cumbersome, but not being a programmer and trying both Flash CS3 and these guides, it is much clearer what you are doing in these guides. My husband is a programmer who briefly tried the shootorials, and when I showed him these guides said, “This is so much better, no spending half an hour looking for the right thing to click on.”

 
Flag Post

Um. CS2 doesn’t HAVE Flash. It was still a Macromedia application when CS2 came out.

Does that mean I can’t use it?

 
Flag Post

Thanks for this! I’m using ActionScript Development Kit (ASDT) for Eclipse, which makes Flash AS2 apps nicely, although to incorporate swfmill you’ll need to call it on the command line before the compilation to make the swf file with the library assets you’ve chosen. Eventually I’ll figure out how to get it all in one smooth click….

 
Flag Post

i got bored and decided to refine your batch file for windows

@echo off
title Create A Flash Movie
set /p file1=Class Filename:
set /p file2=Game Filename:
cls
IF EXIST .\output\%file1%.swf (del .\output\%file1%.swf)
IF EXIST .\output\%file2%.swf (del .\output\%file2%.swf)
echo mtasc:
./mtasc.exe .\source\*.as -version 8 -wimp -swf .\output\%file1%.swf -header 1:1:30
echo swfmill:
./swfmill.exe simple .\source\%file2%.xml .\output\%file2%.swf
echo.
echo Check the above for errors then press any key to exit
pause > nul
exit

on windows nt+ that will prompt for for the class file name and the game filename (the name of the xml; the swf will have the name)
it assumes that mtasc and swfmill are in the same folder, and that all your classes and the xml file are in /sources
the swfs will be in /output if /output doesn’t exist then it will fail

 
Flag Post

Many thanks for posting this :) I’ve been working in C# and XNA which aren’t usable here on Kong (or so I was told – if I ever get finished I’ll really go and look that up). I’ve been a VB, ASP, SQL and .NET business ap developer for about 15 years. I thought it would be fun to do a game to get more into C#. Checking out action script sounds like my next fun mission now. Your 2 articles on developing a tower defense looked cool too!

 
Flag Post

The tower defence articles are by the user called BobJanova, not me. ;p

I hope this stuff is helpful for getting started though. Actionscript isn’t as refined as the languages you are used to, but you’ll get the hang of it.

 
Flag Post

cool

 
Flag Post

if u dont post ur favourate cheese on cheese in games ur a gay lord

 
Flag Post

Thanks so much for the info for all of us poor hacker types. :)
I just got this working with FlashDevelop using As2, MTASC and Swfmill, thanks to the demo project here:
http://www.flashdevelop.org/wikidocs/index.php?title=AS2:MTASCAndSwfmillWorkflow

The trickiest part was figuring out how to customize the Swfmill library so that I could attach classes to clips as it says to do in the tutorial.

I found a solution here:
http://www.flashdevelop.org/community/viewtopic.php?f=13&amp;t=173&amp;hilit=swfmill+class+clip

Where you create a custom xml file which gets appended to the SWF after it is initially built.
After I got rid of the object tags and got the file paths sorted out, it worked like a charm.

I can post more info/a sample project here if people are interested.

 
Flag Post

we need more Multplayer/strategy

 
Flag Post

I don’t get it, I still can’t make games with it…

 
Flag Post

]

 
Flag Post
Originally posted by Rauliito90:

i like this game is cool!

luigi!

 
Flag Post
INTRODUCTION •swfmill and mtasc are free, open-source tools you can use to create SWFs. •mtasc is the Motion Twin ActionScript 2.0 compiler, which is an extremely fast compiler with some nice features. If you want the benefits of AS3, you could use haXe or the flex sdk from adobe instead (but I heavily recommend you use mtasc and AS2 first, it's easier). •swfmill is a tool that, among other things, allows you to set up library resources and place clips that you can then access from ActionScript, using a simple XMLish format. •There are other ways to use Flash for free (FlashDevelop etc.) and other ways to use mtasc and swfmill (the Eclipse IDE etc.) that may suit you better. I cannot advise you in these because I haven't tried them. INSTALLATION •For Linux, use your package manager as usual. On Debian GNU/Linux or Ubuntu this means you can apt-get install mtasc swfmill. On Gentoo Linux you need to set up the sunrise overlay and then emerge -av mtasc swfmill. If you're doing this on a shell account, ask your administrator to install mtasc and swfmill for you, or you can try extracting the binaries or compiling the source from the sites in your home directory. •For Windows, you can either download from the site URLs above and extract them to a folder, and put your game in the same folder, so this folder contains three items: your game folder; the mtasc folder; and the swfmill folder. This is so the build.bat file below will work. Or, if you're lazy, just download this zip file. Also, some people seem to have problems with the release versions of swfmill, so there is a more recent version available here. •For Mac OS X, it's pretty much the same deal as on Windows; it's easier to dowload this tar file, extract it to somewhere, navigate to find the file called build, and double-click it. You'll have to click "Choose Application" and then find "Terminal". GUIDE I'm totally new to Flash animations. I've never made one before. Since I run Linux, I can't really use the Adobe Flash program, since it is not available for Linux; and in any case I cannot afford it. Luckily, there are free, open source tools available. Using them involves a little more typing and replacing WYSIWYG, dragging, dropping type things with code; but that's OK. Please follow these instructions VERY carefully. Neither mtasc nor swfmill will be particularly verbose if you screw something up, and you'll be very upset when, for the fiftieth time, you refresh your page and don't see your ship move. Once you actually have a skeleton in place and can get some ActionScript to execute, things get easier. At the very least you can do _root.insertTextField( ... ) and print some debug stuff in it. Firstly, assuming you're new to flash, watch the Shootorials carefully. Next, and this stage is optional but you probably want to do something like it, make a build script so you can easily recompile your flash project. Here is the Linux and Mac OS X version, which you should save to a file called build or something in your game directory, and chmod +x build so you can execute it with the command ./build: #!/bin/bash rm Shoot.swf Classes.swf 2>/dev/null mtasc *.as -version 8 -wimp -swf Classes.swf -header 1:1:30 || { echo "FAILED: mtasc"; exit; } swfmill simple Shoot.xml Shoot.swf || { echo "FAILED: swfmill"; exit; } echo "SUCCESS!" Here is the Windows version, which you should call build.bat and place in your game folder (where you'll also put the .as files, etc.): del Classes.swf del Shoot.swf ..\mtasc-1.14\mtasc.exe *.as -version 8 -wimp -swf Classes.swf -header 1:1:30 ..\swfmill-0.2.12-win32\swfmill.exe simple Shoot.xml Shoot.swf pause Note: When you use the Windows build.bat file you need to read the output very carefully for errors. Ignore any errors from del about not finding Classes.swf and Shoot.swf; only pay attention to errors from mtasc first, and then swfmill. We're using a method called "Natural Entry Point" here, where we create an intermediate swf file called Classes.swf contaning our compiled AS2 classes, then using swfmill to import this file and generate Shoot.swf. You can instead use swfmill first, then use mtasc to inject the AS2 code into that swf file, but I found this to be a major headache. Now, instead of the File->New in Flash as shown in Shootorial #0, we need to make an XML document. Just copy this skeleton: <?xml version="1.0" encoding="UTF-8" ?> <movie width="600" height="300"> <background /> <frame> <clip /> </frame> </movie> Save that in a file called Shoot.xml in your game directory (it is referenced by this name in the build scripts). Notice where we put the important values: the size, the framerate, the background colour. Note also that we set the version to 8 (we also passed -version 8 to mtasc). This is *important*. Some things won't work unless you do this. Don't set it to lower than 8 -- there are additional things in version 8 and it is backwards compatible so you never need lower. Don't set it to higher than 8 -- version 8 is the highest ActionScript 2.0 version, and mtasc only compiles AS2. Next, let's make an "empty" Ship.as file for mtasc to compile: class Ship { } OK, now run ./build, or for Windows double-click your build.bat. The output should hopefully look something like this (this is the OS X version's output): Andys-Macbook:~ andy$ /Users/andy/Downloads/shoot-macosx-0/Shoot0/build ; exit; SUCCESS! logout [Process completed] If you didn't make any typing errors, and mtasc, bash, and swfmill all work, then you should now have two swf files in your directory. We're almost ready to display that exciting blank animation! I've created an html file containing our animation: <html><head><title>Shoot game!</title></head> <body> </body> </html> Now visit the page. See a blank rectangle? Great! You've just made your first swf animation using free open source tools. ;) Now lets move on to Shootorial #1, adding the ship and making it move. Just make Ship.as exactly as is in that tutorial. We don't need to change the AS2 code. We do need to add it to the library, though, and place it in the starting frame, so edit Shoot.xml, and inside the <frame> tag after the <clip /> tag add this: <library> <clip class="Ship" /> </library> <place /> You'll need a ship image available at your_game_directory/source_assets/ship.png (that is, named ship.png in a directory called source_assets); make one or grab one from the source zip file on the main kongregate labs page. Please note that the win32 swfmill happily accepts forward slashes as folder separators. :) Now, notice the depth I have set. This is necessary because of a bug in something, probably swfmill. The actual depth the ship will have in the animation is 1. Just add 16384 to the depths and try not to think about it. ;p Another little explanation: the id attribute is the linkage id. If you've used AS2 before, this is the same as the string you pass to the first arguments of registerClass( ... ) and attachMovie( ... ) (which, in fact, is what swfmill will do under the hood for this code). It doesn't need to start with "__Packages.", swfmill takes care of that for you. The id attribute also lets you refer to the same thing in two places in the XML file. The class attribute is very important. This combined with the id forms the linkage which allows you to use library stuff from your ActionScript. If you don't add this you will get a ship picture which does nothing, because it has no code attached. The name attribute is the instance name for this clip (it's the second argument to attachMovie( ... ) if you cared to know). It will make this instance available as _root.ship. OK! So type in the Ship.as from Shootorial #1, ./build or double-click your build.bat, refresh browser, click on the flash animation to get focus, move the ship around with the arrow keys. I hope you're following me so far. Next is the background, Shootorial #2. Since setting it up initially is very unexciting (it's the same as setting up the ship but at a slightly lower depth), I'll skip straight to making it a nice proper joined-up background. Now, again you need the same exact code from the Shootorial: Background.as. We won't be making changes to it. The only changes to make are to Shoot.xml: <?xml version="1.0" encoding="UTF-8" ?> <movie width="600" height="300"> <background /> <frame> <clip /> <clip /> <library> <clip class="Ship" /> <clip class="Background"> <frame> <place /> <place /> </frame> </clip> </library> <place /> <place /> </frame> </movie> Don't forget you need a file your_game_directory/source_assets/scrollingBackground.jpg. I've placed the new clip with id "scrollingBackground.jpg" outside the library tag, since we won't be needing to touch it from our ActionScript. It's only being used as an image resource. I've also added another new clip, "Background", but this one doesn't import a file: it contains a frame. Since it is a MovieClip, that makes sense. All we need to do is place the "scrollingBackground.jpg" image clip twice in that frame, at the correct offsets. The depth for each needs to be different, otherwise one will overwrite the other. Since our clip with id "Background" containing the two images is now in the library, and it's linked to the Background class, we just need a place tag like the one for Ship. We've used a lower depth so the Ship will be on top. ./build or run the batch file, refresh. Hopefully, you should now have a movable ship on an infinitely scrolling background. There's one last little thing that needs doing. In the Adobe Flash program, you can set something called the "Registration point", which affects various calculations involving _x and _y, as well as scaling and rotating. Sadly swfmill doesn't have a Registration point feature: all clips are registered to top left corner. This may not (seem) to matter yet, but it will when we start making the game more complicated. Luckily, we can exactly duplicate the Registration point effect with some clever XML. Here is the (complete and hopefully last) Shoot.xml that does what we need: <?xml version="1.0" encoding="UTF-8"?> <movie width="600" height="300"> <background /> <frame> <clip /> <clip /> <clip /> <library> <clip class="Ship"> <frame> <place /> </frame> </clip> <clip class="Background"> <frame> <place /> <place /> </frame> </clip> </library> <place /> <place /> </frame> </movie> Note that the ship is now a clip containing a frame containing another image -- a bit like Background is. As it happens, this is actually a lot closer to the way Adobe Flash does it internally. To actually fix the registration issue, we simply move the image clip to be centred on the top left corner. We do this be setting x to negative half the width of the image, and y to negative half the height of the image. Since the default ship.png is 79 by 37, this means we've moved it to (-39.5, -18.5). Remember, we're moving ship.png, which is the id of the ship image clip, to a position within Ship, which is the "real" Ship movie clip that is associated with the Ship class. I hope that makes sense. If you have any problems, you can download all this stuff from my site, for linux and for Mac OS X and for Windows. Run build then open game.html in your web browser. Click here to go to the next guide, covering Shootorials #3 and #4.