Subscribe to GameFromScratch on YouTube Support GameFromScratch on Patreon

22. February 2017

 

Yoyo Games have released GameMaker 2.0.5.72.  Primarily focused on IDE stability and exporting, there are several fixes and some solid new features in this release.  Perhaps the biggest new feature is the addition of gesture support such as taps, drags and swipes, with the mouse acting as a single finger on desktop builds.

 

From the release notes:

 

Release Notes

  1. Lots of fixes throughout, especially in the new modules
  2. A new gesture event system has been added - Tap, Drag, Flick
  3. Colour picker sliders should now work properly, regardless of language settings
  4. When copying frames in the image editor, layer-hiding should now work properly
  5. The Preference for overriding DPI now has a percentage slider for ease of setting and increased clarity
  6. Code windows should now open and fit inside the available space
  7. Maximised code window tabs can now be dragged back onto their object to re-dock them
  8. Maximised code windows have a new context menu item for "Go to Object"
  9. We now validate that the user is not picking a project folder inside the GMS2 folder space as these are deleted on update
  10. HTML5 can now build to a folder ("Loose Files") as well as a zip
  11. To avoid confusion, the Test target is removed if you have purchased Desktop and therefore have Windows also
  12. Deleting an object that is used in a collision event now propts that it will delete all redundent events
  13. UWP packaging has been fixed to provide an .appxupload as the file written out
    Known Issues
  14. Still investigating an issue stopping some users from updating their runtimes since 2.0.3
  15. Dragging a gmz onto the IDE when another project has unsaved changes and saying no to saving, can cause import issues
  16. Building with extensions on YYC platforms can include extensions not marked for that target
  17. Pressing F1 on DnD nodes doesn't open the correct page of the manual
  18. You can find more info about known issues at https://account.yoyogames.com/report-bug

GameDev News

21. February 2017

 

Somewhat delayed from the rest of the Defold Engine tutorial series, I realized there was a major gap in subjects we covered... GUI programming.  Defold actually has some really solid UI functionality built in, and in this tutorial we are going to look at the basics of handling a UI in Defold. Well very conventional in it’s approach, if you’ve gotten accustomed to the Defold way of doing things, you will find Defold’s approach to handling UI remarkably consistent to the way you do just about everything else using the Defold game engine.

 

As always, there is an HD video version of this tutorial available here.

 

In this tutorial we are going to implement the simplest of UI, but all of the concepts of a much more complicated interface can easily be extrapolated from what we cover here. We are going to create a UI that pops up when the user hits the ESC key, dimming the existing screen, showing the UI, handling input, then un-dimming the UI.  There is a ton more UI functionality available in Defold, but it should be fairly easy to pick it up once you’ve got the basics down.  So without further ado, lets jump right in.

 

A UI in Defold consists of two different file types, a .gui and a .gui_script file.  A gui_script file is just a traditional lua script file, but has access to the gui namespace.    Let’s take a step by step look at creating a UI that appears when you hit the ESC key and handles a simple button being clicked.

 

First we need a font, drag any applicable TTF file to your project.  I personally created a folder called MyFont and dragged it there.  Next I created a Font file in the same folder.

image

 

Next open the newly created Font file and select the ttf file you just imported.  Please note that the filter is broken and you should manually type *.ttf to locate your font.

image

After selecting the font I also increased the size to 30pts.  This is aesthetic and purely optional.

 

Now that we have a font selected, we need to define an Input map.  I fully describe the process here for more information on how Input Maps work in Defold.  This are the bindings I created:

image

 

Next we create our gui file.  Simply select Gui File:

image

 

We can use the Gui File to arrange the controls that make up our UI.  Here are the options:

image

 

In this simple UI we are simply going to create a button by creating a box then adding a text label to it.  We will also create a label telling the user to click the button.  First we need to set up our font that we created earlier.  In the GUI editor, right click Fonts and select Add Font:

image

 

When prompted, select the font you just created:

image

 

Now right click Nodes and add a Box.  Once created it can be positioned by hitting W then moving manually.

TransformBox

 

Next right click the newly created box node and create a child Text field:

image

 

Child nodes automatically inherit the position of their parents.  With the Text node selected, lets set it’s font and text, like so:

image

 

I also created another Text field telling the user to click the button.  This one in the root of the GUI hierarchy and not parented to the box.  You’re outline should look something like:

image

 

While your Gui layout should look something like:

image

 

Now that we have a gui file, let’s right a script that will display it.  In our main.collection I simply create a new script and attach it to the default logo objecct.

image

 

Now of course we need to add the UI to our game object.  Create a new root level GameObject named UI, then add component from file and select our gui file:

image

 

So now you main.collection should look something like:

image

Now we enter the following code for main.script:

function init(self)
	-- we want focus and to hide our UI until needed
    msg.post(".", "acquire_input_focus")
    msg.post("UI","disable");
end


function on_message(self, message_id, message, sender)
	-- Wait for a message from the UI layer that the UI has been dismissed
	-- un-dim our sprite
    if(message_id == hash("DONE_UI")) then
    	go.set("#sprite","tint.w",1.0)
    end
end

function on_input(self, action_id, action)
	-- If the user hits the ESC show the UI and dim our sprite
    if(action_id == hash("ESC") and action.released) then
    	-- UI needed now, reenable
    	msg.post("UI","enable")
    	go.set("#sprite","tint.w",0.2)
	end
end

 

This code does a couple things, first on input it tells Defold we want to get input messages.  We also start out by disabling the UI, by sending it the built-in message disable.  When the user actually hits the escape key, we send a message to re-enable the UI layer.  We also dim the logo sprite so it’s not visually in focus when the UI is active.  Also note we wait for the DONE_UI message to undim our sprite.  This is sent by the UI script, which we will create now.

 

If you select your .gui file, in the properties you will notice there is a setting for Script.

image

 

There is a special kind of script, .gui_script, that is used to control gui objects, the Gui Script File.  Let’s create one in the same folder as our .gui file:

image

 

This is a standard lua script, but it has access to the gui namespace.  Once you’ve created your gui_script, set it as the script for your gui file.  Now enter the following script:

function init(self)
	-- We want input control.  AKA, pump input to the UI
    msg.post(".", "acquire_input_focus")
    
end

function on_message(self, message_id, message, sender)
	-- Expect to be enabled by main when needed.  Acquire focus and set text back to click me
	if(message_id == hash("enable")) then 
		msg.post(".", "acquire_input_focus")
		gui.set_text(gui.get_node("text"),"Click Me")
	end
end

function on_input(self, action_id, action)
	-- handle left clicks.  On left click, see if click was within box
	-- if so change our text (this wont actually be seen), disable ourself and pass a message back
	-- to logo that we are done so it can undim itself
	if(action_id == hash("LEFT_CLICK") and action.released == true) then
		local box = gui.get_node("box")
		if(gui.pick_node(box,action.x,action.y)) then
			local text = gui.get_node("text")
			gui.set_text(text,"Clicked")
			msg.post(".","disable")
			msg.post(".","release_input_focus")
			msg.post("/logo",hash("DONE_UI"))
			
		end
	end
end

 

This code waits for the enable message then sets input focus so the gui can receive input messages from Defold.  It also illustrates how you could change the text of a component within the gui.  The most important logic is in the on_input event handler.  We wait for the LEFT_CLICK input.  We then check to see if the click was within our box, if so we set the text of our control ( which is somewhat pointless as it’s about to be hidden! ) to “Clicked”, disable our self, release input focus then send the message DONE_UI back to main.script.  Now if you run the code:

GIF

 

Of course we only scratched the surface of what you can do in a Defold gui, but that should certainly get you started!

 

The Video

Programming , ,

21. February 2017

 

The Atomic Game Engine, an open source 2D/3D game engine ( featured here, pre open sourcing ) just gained UWP and XBox One support.  UWP, or Universal Windows Platform, is Microsoft’s successor to the unpopular Windows RT, that enables you to target several platforms using a single code base.  From the announcement:

We’re pleased to announce that Universal Windows Platform support is coming to the Atomic Game Engine! Development builds of Atomic’s UWP technology already run great on Windows 10 and Xbox One. We also look forward to supporting innovative UWP powered devices like the HoloLens and Surface Hub!

Atomic’s powerful API can be leveraged in UWP apps using standard tooling and languages, such as JavaScript, TypeScript, C#, and C++ with full source debugging and profiling.

Atomic’s UWP support is integrated with Visual Studio and joins the existing Xamarin and native Windows, macOS, Linux, Android, iOS, and WebGL platforms.

 

You can see the new platform support in action in the video below.

GameDev News

19. February 2017

 

Inkscape is a popular open source vector based graphics package available here.  Inkscape 0.92.1 was just released with several fixes, improvements, documentation and some new known issues.

Details from the release notes:

 

Regression Fixes
  • Text: baseline-spacing related issues with regular and flowed text in legacy Inkscape SVG files (Bug #1655483 and others).
  • Text: Default baseline spacing stored in relative units is always converted to document units (Bug #1645016)
  • Path effects: Crash on ungroup if group contains elements with path effects (Bug #1657591)
  • Clipboard: Pasting a path effect from clipboard fails (Bug #1656093)
  • Clipboard: Fix copy&pasting of groups which contain elements with path effects (Bug #1656527)
  • Selection: Node tool can select objects on locked layers (Bug #1656141)
  • Clones: Critical warnings with clones and symbols (Bug #1653184)
  • About screen missing for several UI languages (Bug #1659426)
  • Selection: Missing transformation handles after reset of rotation center (Bug #1657874)
Important bugfixes
  • Bitmap images: Crash when opening files with invalid image links (Bug #1660142)
  • Bitmap images: Fix path separators in relative image links (Windows) (Bug #1659347)
  • File import: Failure to open CDR/Visio/WPG files from paths with special characters (Windows) (Bug #1656763)
Translations
  • Catalan: Tutorial translation ("Basic") added
  • Czech: UI translation updated
  • English (GB): UI translation updated
  • French: UI translation updated
  • French: Man page, Readme and Keys & mouse reference updated
  • German: Man page and Keys & mouse reference updated
  • Icelandic: UI translation updated
  • Italian: UI translation updated
  • Latvian: UI translation updated
  • Russian: Tutorial translation ("Tracing Pixel Art") added
  • Russian: UI translation updated
  • Spanish: UI translation updated
  • Slovak: Tutorial translation ("Tracing Pixel Art") added
  • Slovak: UI translation updated
  • Ukrainian: UI translation updated
Documentation
  • Shortcuts: Add shortcut '7' for cycling through path effect parameters in node tool (Bug #1656713)
  • Shortcuts: Add new Shift+I shortcut to keys and mouse reference (Bug #1644609)
  • Man page: Add new --no-convert-text-baseline-spacing command line option (Bug #1661811)
Known issues
  • DPI Change: Dialog needs better explanation of available options (Bug #1659229)
  • DPI Change: Provide command line options for batch-processing legacy files (Bug #1659489)
  • DPI Change: known issues with 'Scale elements' option (Bugs #1653230, #1653230, #1653236, #1654342, #1654796, #1654880, #1654903, #1655005, #1655053, #1660228)
  • DPI Change: Default grids in documents created with Inkscape 0.91 don't scale correctly (Bug #1653893)
  • Renderer: Artifacts in Gaussian blur effects with default quality settings (Bug #1656383)
  • Node tool: Deselecting selected nodes of complex paths takes a long time (Bug #1652100)
  • Fill and Stroke: HSL color selector may show corrupted colors, defunct 5th slider (Bug #1635982)

GameDev News

19. February 2017

 

The Cocos2d-x foundation just released Cocos Creator 1.4.  Cocos Creator is built on top of Cocos2d-x stack using the JavaScript language.  I took a hands-on look at Cocos Creator shortly after it was released if you want a better idea how Cocos Creator works.  The 1.4 release brings several new features including Spine and DragonBones mesh rendering, UI text improvements and more.

 

From the release notes:

 

HighlightsspineDBCocos

The most concerning issues and improvements from the community have been addressed, including:

  • Node instantiation performance enhancement
  • Spine and DragonBones animation supports mesh rendering
  • UI label enhancement, including LabelAtlas support, bitmap font batch rendering (batch with other sprites!), rich text strokes, etc.
  • Extension store is online, more editor extension interface is supported
  • Include a lot of hot update issue fix and interface improvements
  • Add third party library to handle audio soft decoding on android, to improve compatibility and performance
  • Added VS Code debugging web platform workflow support

 

The full announcement goes into a great deal more detail about the new functionality in this release.

GameDev News

Month List

Popular Comments