Jump to content

Torque 2D Editor Work


Recommended Posts

EDIT: Changing this first post to have the link to the Editors github


So for anyone interested the EditorToy is ready for download and testing from anyone that is willing to.


You can find it here: https://github.com/marauder2k7/EditorToy


Just download it and put the EditorToy folder into your modules directory.


So all that is available in this version is:-


Module Creation

Scene Creation

ImageAsset Import

AnimationAsset Creation

SpriteAsset creation

Scroller Creation

CompositeSpriteAsset Creation

CollisionShape Creation


Other features are ready but not released as they are quite unstable features such as:

ParticleAsset Creation

Emitter Creation

TextSprite Creation

ShapeVector Creation

Link to post
Share on other sites
  • Replies 69
  • Created
  • Last Reply

Top Posters In This Topic

I figured it out. Now i have the simple functionality of creating ImageAssets.


When you load up the EditorToy you are presented with this screen


n3YlvRk.png


At the moment the only button that works is the Import Image button which loads up an ImageAsset that you choose, takes it into the engine as a private asset and presents it on the screen. After which you can choose and modify some of the options associated with image assets


FilterMode

CellCountX

CellCountY

CellWidth

CellHeight

CellRowOrder

Force16bit


These are then output to a asset.taml file that includes these changes.


For the moment i haven't figured out how to add a simpler method of creating Explicit Cells as i am creating a representation of the image in the center of the screen i need to figure out the math on how to calculate the top left corner as being 0 0 instead of it being -(half image asset width) -(half image asset height). I could possibly put the images top left corner at 0 0 then all the x positions would be correct but the Y would need to be flipped to a positive by multiplying by -1 or something

Link to post
Share on other sites

A brief video showing the ImageAsset creation with cell width cell height cell number x and cell number y selections. When this is finished it writes out a TAML file with all the options set in the guis


The grid overlay will eventually have thicker lines once i figure out how to do it lol


Other gui elements being added now for the further options. Sprite creation is next


FSZAtfJs0Ms

Link to post
Share on other sites

Taml file output from imageasset importer

 


	AssetName="Blocks"
	ImageFile="Blocks.png"
	FilterMode="Nearest"
	CellCountX="8"
	CellCountY="7"
	CellWidth="64"
	CellHeight="64"
/>

 

now has the button to export the image taml and removes all objects involved in its creation from the scene.

Link to post
Share on other sites

Initial Commit of the editor toy is pushed to my github,


https://github.com/marauder2k7/Torque2D/tree/EditorToy


The editor toy is heavily reliant on sandbox for the moment for gui elements and inputcallbacks.


Everything for the imageasset creation is in the main.cs file, everything i do for the editor will be in one file for the time being until i get everything working for imageasset i will keep it this way then when each feature is sorted out the imageasset scripts will be moved to their own file. This upload atm does not have any functionality in the other buttons only import image works.


For the moment images and their respective taml file get added directly into the assets/images folder. This output path will be changed when the user creates a new module and then the output path will be used instead


the file output paths then will be /output/{MODULENAME}/1/assets/{ASSETTYPE}


I have decided that adding other functions is possible sure but may be stupid without level editor being in place first because the size of the sprites decides the physics bodies sizes and such and these need to be on a per object instance basis usually.


So if you were to create sprites outside of a level say a sprite with size 2 2 and you create a boxbody of the same size and save this out when you import it into a level and resize the sprite to 5 5 then boxbody will still be 2 2 and would be too small. Creating sprites on the fly will be a lot easier. So far i have got a basic level editor in place where you can load in a sprite for image assets you have imported already and move them around to different positions, each sprite that gets selected will load up a gui menu much like the image importer menu where you get to select the sprite size, sprite frame whether it is flipped etc very basic functionality atm but while you can load sprites in and place them and all i have to figure out the saving function this is why i am not releasing this yet because itd be pretty stupid if people make and design a level that they cant save. Simple physics options can be added for box and circle shapes.


Eventually what i am planning to add is a section for adding physics bodies to the sprite, box and circle collision shapes are fairly straight forward and functionality for custom polygon shapes is possible and this is what i am testing out atm.

Link to post
Share on other sites

New commit pushed for further options to the ImageAsset menu.


Now an overlay appears displaying frame numbers and a gui option for changing the frame numbering from row order to column order. Also fixed the offset settings. Video showing functionality


d5W7xS_Yc04


Uploaded to the github this version of the editor toy


The output from this was this taml file

 


	AssetName="Blocks"
	ImageFile="Blocks.png"
	FilterMode="Nearest"
	CellRowOrder="false"
	CellCountX="8"
	CellCountY="7"
	CellWidth="64"
	CellHeight="64"
/>
Link to post
Share on other sites

Update:-


Quick video showing basic sprite operations for loading in sprites and moving it around a scene for placement.


JuzSaFb7imQ


The gui for sprites has been disabled in this video for the time being until i finish all the hooks and callbacks.


At the moment, each object added to the level editor is added to a simset, this simset is then output as a taml file which when read back in should load up all the objects with their saved properties so its basically a way to block out a level without the need of guessing where objects go.

Link to post
Share on other sites

Basic functionality is there and you can now build a level quite easily. Write it out to taml and then read it back into whatever module you want really easily.


Unfortunately the actual nitty gritty of the physics system is presenting a few problems.


With some extensive work on the gui system over the past few weeks i cant seem to get a list of objects to populate the gui. This was going to be paramount for the polygon collision shape but also for creating shapevectors. The same idea would of been used also for creating a list of objects that are in the scene so you can find them quickly and be able to select them from the menu and modify their values. without having to hunt through the scene for them.


But with all my searching i cannot seem to find out how the hell to do this lol


My idea for the pollygon shape collision was to show a separate subwindow with a subscene that has the selected object with the correct size inside the window. This i can do pretty easily, even have some input callbacks so you can zoom in and out and pan around if need me. But i wanted to have a gui list of the points created on the right hand side. These points would be just simple circular sprites with a line segment joining them together


cant seem to get a list to populate.


Working through the customtoolbox.cs file i have seen how to dynamically build a gui and i seem to have everything linked up properly but it just doesnt seem to want to work

Link to post
Share on other sites

Finally!!! YES!! i got it to work. This video shows the basic functionality of creating a list of touch events. At the moment the buttons are displaying on the screen soon it is going to be inside a guiscroll control container that is linked to a separate scenewindow. With this separate scene window in place you can draw shapes and output the list selection as a shape in a constructor on your main scenewindow. Furthermore it can be used to design and modify edge and poly list collision shapes.


jKQD3wXjy6s


The tricky part left now is to link everything up.

Link to post
Share on other sites

And here we go kinks worked out :D


hJXDsjutBH4


This version can be downloaded here

https://github.com/marauder2k7/Torque2D/tree/EditorToy


Again it downloads the full engine but the only folder you need is the EditorToy window just drop it into a clean toque2d download and it should work. Would really value some feedback on features that need to be implemented. Features that don't feel right etc.


So far features include


ImageAsset import

ImageAsset setup for cells

Sprite Create

Sprite setup size position

Sprite Collision Shape Custom

ShapeVector drawing


To be added (Soon)

Water Simulation - almost done but very buggy and very unstable.

Scene saving and loading - almost done.

Module saving and loading - this will include exporting finished product.

ParticleEditor

Trigger creation

AnimationEditor

Gui Editor - Torque2D already has most of the functions needed for a gui editor built into the source.

CompositeSprite Import

CompositeSprite Editor

Linking objects to events in the editor without script

Physics Joints editing


To be added (later)

Scene events (for timing a scene)

Pathfinding

Skeleton animation (unfortunately will require 3rd party Spine)

Lighting effects

Shadow generation

Dynamic fields

LiquidFun stable integration - the one so far is a little unstable

Link to post
Share on other sites

Tonights video shows another addition, the collision shape editor loading collision shapes in for individual editing of restitution, density and friction.


Menu items are a little buggy because at the moment each rollout control is made on the fly and because it is collision shapes they need to be deleted and re-made each time a value is changed and so the menu is re-creating each input any time anything is changed. this isnt good i know but unfortunately its either this or creating the rollout menus before hand which means imposing a limit on the amount of collision shapes allowed.


Z0cA-S4Cdhs

Link to post
Share on other sites

Okay so its been a couple of days since an update, bit off since ive been putting an update up here almost every day for the past week lol


What i am doing now:-


I think the most important thing at the moment is to be able to create modules inside the editor and to present the tools in a user-friendly way. Figuring out this loading and saving is becoming a bit of a challenge.


What is happening at the moment is every object added to the scene is put into its own simset, animations,sprites etc. Because the EditorToy is a module itself it looks for images in its own module. Loading another module inside the editortoy as far as i know is possible but at the moment because the objects are being created in one module and then added to a simset within that module, when it gets saved out and loaded back into the editor, the simset for the objects already exists and so it will not add them to it. Now i am working to fix this atm im almost certain its just a problem in my code.


But for exporting your projects and levels out i plan to do it the CS file route.


With the cs file route you can write out line by line the file that you want to put out. So for example if you have 10 sprites with a particular image asset, u you only have to have your constructor for that object in place once and have a create function in your reset script with different variables like so:

 

function MyToy::reset(%this)
{
%this.createBackground( static,10,10,1,1,1,31,"blue");
%this.createBackground( static,10,10,1,1,1,31,"red");
%this.createBackground( static,10,10,1,1,1,31,"green");
}
 
function MyToy::createBackground( %this, %bType, %posX, %posY, %sizeX, %sizeY,%pBool,%sLayer,%blndColor )
{    
    // Create the scroller.
    %object = new Sprite();
 
    // Set the sprite as "static" so it is not affected by gravity.
    %object.setBodyType( %bType);
 
    // Always try to configure a scene-object prior to adding it to a scene for best performance.
 
    // Set the position.
    %object.Position = %posX SPC %posY;
 
    // Set the size.        
    %object.Size =%sizeX SPC %sizeY;
    %object.PickingAllowed = %pBool;
    // Set to the furthest background layer.
    %object.SceneLayer = %sLayer;
    // Set an image.
    %object.Image = "ToyAssets:checkered";
    // Set the blend color.
    %object.BlendColor = %blndColor;
    // Add the sprite to the scene.
    SandboxScene.add( %object );    
}

 

The above code is just an example for sprites using one imageasset. So if u have this sprite in your code 50 times it will create 50 create functions at the top to build the level. As far as i know this should be the best way to do it and it will mean an export with 20 lines of code for that 1 item instead of 1000 so if u do have to do any edits after export you wont have to delv through all that code to find the one object that isnt correct, you shouldn't have to do this anyway as long as you keep your modules save file, but for quick fixes sometimes we just like to jump into the script file and modify a single value while loading the module itself.


The old torque 2d (TGB) used to have different levels as different scenes and so this is the way i think i will do it with this editor too. Each level will be a different scene file that is loaded. This will in turn clear the previous scene removing it from memory and add another scene to the game that has function mentioned above added to it. Each scene will have its own settings too for camera size, gravity etc. each scene again will be saved as a taml file for the editor but exported as a cs file upon export for gameplay.


Each module will be saved for editing as a cs file, which will include a list of scenes which will in turn be linked to its respective objects taml files.

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...