PushButton Engine Lesson # 1: Configuring FlashDevelop

introduction

During Flash development, you often have to perform the same tasks. The development of Flash games is no exception, so I wanted to find some kind of framework or set of classes that would help me simplify and speed up the development process. Having studied a little the current “market” of game frameworks, I turned my attention to the PushButton Engine (PBE) .

Everyone who wants to learn the PushButton Engine will be helped by 5 official lessons that describe working with PBE from the very basics (setting up the development environment), and ending with embedding graphics in your projects using the flexible functionality from PBE .

Having started learning the lessons, I immediately thought that perhaps these lessons will be interesting not only to me alone, but also to other Flash developers who would like to “improve” their life.

Next will be the translation text of the first lesson.

PushButton Engine Lesson # 1: Configuring FlashDevelop

Hi, in this tutorial you will learn how to use the PushButton Engine with FlashDevelop .

Contents:
- Lesson requirements
- Setting up FlashDevelop
- Creating a new project
- Library
- Sources
- Hello, World
- Overview
- Conclusion
- Files

Lesson requirements

In order to complete this lesson, you need to download and install several programs:
- Adobe Flash 10 Project Content Debugger: Download
- Adobe Flash 10 Debug Player: Download | Installation
- Adobe Flex 3 SDK: Download - To install, simply unzip the archive into the desired directory.
- FlashDevelop: Download | Installation
- PushButton Engine: Download - To install, simply unzip the archive into the desired directory.

Configure FlashDevelop

When you launch FlashDevelop for the first time after installation, you will need to specify the path to the Flex SDK . In order to do this you need to go to the menu Tools-> Program Settings , in the window that opens, you will need to select the AS3Context item and click on it. In the list of parameters (near the end of the list) you will need to find the Flex SDK Location item (see screenshot). Here you will need to enter the path or select the desired folder with the Flex SDK in the explorer window (the folder where you unpacked the Flex SDK archive). FlashDevelop is



now ready to develop AS or Flex applications.

Create a new project

Now we need to configure the project for the lesson. Click on the menu item Project-> New Project . You will see a window with various types of projects for FlashDevelop . For this tutorial we need to create AS3 Projec t (select this item in the list of project types). Name it Lesson1FlashDevelop and specify the desired folder. You can click OK and move on =)



Now we have to ask ourselves: “are we planning to use the PushButton Engine as is or will we change the source code of the PushButton Engine ”.

If you plan to use the PushButton Engine as is, skip the Sources section and go to the Library section.

Translator's note: “in principle, if you are not familiar with the basics of FlashDevelop , then there’s nothing wrong with reading the“ Sources ”section anyway, even if you plan to edit the sources of the PushButton Engine .”

If you plan to work with the source code of PushButton Engine , skip the "Library" section and go to the "Sources" section.

Translator's note: “as in the previous case, if you are not very familiar with FlashDevelop , then it will only be useful for you to read the section“ Library “”.

Library

With our current settings, we can begin to develop a “clean” ActionScript or Flex , to choose from. In this tutorial we will create a “clean” ActionScript project, but nothing prevents you from creating a Flex project. To use the PushButton Engine we need to specify a link to the PBEngine.swc file in our project. So let's do it now!

Open the folder where you unzipped the PushButton Engine . Find the Bin folder , in it you need to find the PBEngin.swc file and copy it to the lib folder inside the project created by FlashDevelop .



Next, you will need to open the FlashDevelop window , in the right part of the window you will need to switch to the Project tab , find the lib folder in this tab , and inside it the copied FBEngine.swc file , right-click on it and select Add To Library . With this action, we are somehow telling FlashDevelop that we want to use this .swc library in our project.

Source code

In order for our FlashDevelop project to work with the sources of the PushButton Engine , you need to specify the path to the source files of the PushButton Engine . Right-click on the name of your project in the Project tab , usually the name is at the very top, and select Properties. In the open window, you need to go to the Classpath tab , in it you will need to click on the Add Classpath ... button and in the dialog box specify the path to the src folder , which is located in the folder with the unzipped PushButton Engine files .



Now we need to set some compiler settings for working with PushButton Engine. To do this, right-click on the name of your project in the Project tab , select "Properties" and go to the "Compiler Options" tab . Next, in the line “Additional Compiler Options” , add the line “--keep-as3-metadata + = TypeHint, EditorData, Embed” (without quotes) and click OK .

Hello world

Everything is cool =) Now it's time to write the code!

In the FlashDevelop window, click on the Project tab , if it is not already open. The src folder will contain the Main.as file (it is automatically created by FlashDevelop ). Right-click on it and rename it to Lesson1FlashDevelop.as



Next, you will need to open the renamed file and delete all its text content, replacing it with:

// ...
package
{
    // Flash Imports
    import flash.display.Sprite;

    // PushButton Engine Imports
    import com.pblabs.engine.PBE;
    import com.pblabs.engine.debug.Logger;

    public class Lesson1FlashDevelop extends Sprite
    {
        public function Lesson1FlashDevelop():void
        {
            PBE.startup(this);
            Logger.print(this, "Hello, World!");
        }
    }
}

* This source code was highlighted with Source Code Highlighter.

This code is a minimal application for PushButton Engine . When we compile the application ( Ctrl + Enter ), the following message should appear in the “Output” panel :

INFO: Lesson1FlashDevelop - Hello, World!

* This source code was highlighted with Source Code Highlighter.

So let's compile the flash drive and test everything. Click on the menu item Project-> Test movie (or Cntr + Enter ) and, if we made no mistakes, we should see a message in the “Output” tab .

Overview

So, we briefly list the necessary steps to create a minimal application:
1) Create a new FlashDevelop project ( Project-> New Project ).
2) AS3 Project must be specified as the project type .
3.a) To get started with the .swc library of PushButton Engine , you need to copy the PBEngine.swc file to the lib folder of your project. After that, you will need to right-click on the .swc file and select "Add To Library" .
3.b) To start working with the sources of PushButton Engine , you must specify the path to the foldersrc , inside the folder where you unzipped the PushButton Engine , as well as set the compiler settings in the FlashDevelop project settings .

Conclusion

Congratulations! You have just completed lesson # 1 and know how to create projects for working with PushButton Engine .

The knowledge gained in this lesson will help you complete future lessons.

Files

You can download all the files that were used in the lesson from the link below.

Archive with lesson sources

From translator

So the first lesson ended. I hope this will be a good start to learning the PushButton Engine . If you still do not have experience with FlashDevelop , then I think that it will be useful for you to read the article about creating Flash applications in FlashDevelop .

PS:

If the article is interesting, then in the future I will publish translations of the other 4 basic lessons.

Links to all lessons (will be updated as lessons are laid out):

1) PushButton Engine Lesson # 1: setting up FlashDevelop
2) PushButton Engine Lesson # 2: adding a simple figure
3) PushButton Engine Lesson # 3: adding control to a user component