AppEasy Sponsors Uni Jam 2012


Uni Jam 2012

AppEasy the cross platform mobile development system sponsors Uni Jam 2012

We are excited to announce that Nottingham Trent Development Society (DevSoc) at Nottingham Trent University (NTU) are hosting a 24 hour games programming contest between NTU and a number of other universities. 100 people, in teams of 3-5 members, will be invited to take part. It is hoped that this event will bring about a sense of friendly competition between universities, and create opportunities for further corroborative and competitive events in the future. The competition takes place at the NTU city campus in the Newton building

When the 24 hours are up the judges will choose a winning game for each of the following criteria:

  • Innovation
  • Gameplay
  • Accessibility
  • Graphics
  • Best Overall Game

AppEasy have donated 5 licenses and reserved spots in their closed beta for the winners of the most innovative game category.

For more information about joining the competition or donating prizes please visit the Devsoc website

To find out more about the AppEasy project please see http://www.appeasymobile.com

The Worlds first 100% XML Mark-up Driven Puzzle Game made with XOML

Well we finally cracked it, we’ve been aiming to create a game in 100% XOML mark-up and it finally happened. We created a small logic puzzle game called 10.

The game itself has simple rules. The screen is filled with cards, each card having a value of 0 to 9. The user selects 3 cards, who’s total value must total 10. When the user selects 3 cards that total 10 they are removed from play. To complete the round the user must eliminate all cards on the play field. The idea is simple but the game can be become incredibly difficult.

The game is 100% XOML based using only actions and variables to create the logic and no additional C/C++. We will be providing the project as an example project when we release IwGame 0.36.

Note that the game will not work with version 0.35 of IwGame.

We are getting closer to bringing cross platform mobile game and app development to the hands of none programmers :)

Oh and For the sake of clarity, we are not stating a worldwide claim over all mark-up languages as that would be ludicrous, only the XOML mark-up language.

A Windows build of the Game of 10 is available for download at http://www.drmop.com/wp-content/uploads/2012/06/Game-of-10.zip

<?xml version="1.0"?>
<xml>

    <Style Name="GenericSceneStyle">
        <Set Property="CanvasSize" Value="-100, -100" />
        <Set Property="CanvasFit" Value="none" />
        <Set Property="CanvasOrigin" Value="centre" />
        <Set Property="Colour" Value="255, 255, 255, 255" />
        <Set Property="AllowSuspend" Value="false" />
        <Set Property="Physics" Value="false" />
    </Style>

    <!-- Load a UI style to style the user interface  -->
    <LoadXOML File="UIStyle.xml" />

    <!-- Create a scene to hold or game -->
    <Scene Name="GameScene" Style="GenericSceneStyle" Camera="Cam" Extents="-1000, -400, 2000, 800" Current="true" Batch="false" ClipStatic="true">

        <!-- Create a camera -->
        <Camera Name="Cam" Position="0, 0" Angle="0" Scale="1.0" />

        <!-- Score / round variables -->
        <Variable Name="Score" Type="int" Value="0" />
        <Variable Name="RoundScore" Type="int" Value="0" />
        <Variable Name="CurrentRound" Type="int" Value="0" />
        <!-- TargetValue determines the valuue that all 3 user selections should add up to gain a correct answer -->
        <Variable Name="TargetValue" Type="int" Value="10" />
        <!-- TotalCardsValue is the current value of all selected cards -->
        <Variable Name="TotalCardsValue" Type="int" Value="0" />
        <!-- CardValues is an array that holds the value of each card -->
        <Variable Name="CardValues" Type="arrayint" Size="15" Value="0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0" />
        <!-- CardsCount is the total number of cards in play  -->
        <Variable Name="CardsCount" Type="int" Value="15" />
        <!-- CardsFoundCount is the total number of cards that the user has successfully found  -->
        <Variable Name="CardsFoundCount" Type="int" Value="0" />
        <!-- SelectedCardNames is an array that holds the names of the currently selected cards  -->
        <Variable Name="SelectedCardNames" Type="arraystring" Size="3" Value="none, none, none" />
        <!-- CardIndex is the current selection index  -->
        <Variable Name="CardIndex" Type="int" Value="0" />

        <!-- CardIndexIs are conditions used to determine the currently selected index  -->
        <Variable Name="CardIndexIs0" Type="condition" Value="CardIndex == 0"/>
        <Variable Name="CardIndexIs1" Type="condition" Value="CardIndex == 1"/>
        <Variable Name="CardIndexIs2" Type="condition" Value="CardIndex == 2"/>
        <Variable Name="CardIndexIs3" Type="condition" Value="CardIndex == 3"/>
        <!-- CardsMatch is a condition used to determine if the total of all currently selected cards add up to the the target value of 10 -->
        <Variable Name="CardsMatch" Type="condition" Value="TotalCardsValue == TargetValue"/>
        <!-- NoCardsLeft is a condition used to determine if there are any cards left in play -->
        <Variable Name="NoCardsLeft" Type="condition" Value="CardsCount == CardsFoundCount"/>

        <!-- IsRound is a condition used to determine the current round -->
        <Variable Name="IsRound0" Type="condition" Value="CurrentRound == 0"/>
        <Variable Name="IsRound1" Type="condition" Value="CurrentRound == 1"/>
        <Variable Name="IsRound2" Type="condition" Value="CurrentRound == 2"/>

        <!-- Load the first set of cards -->
        <File Name="RoundFile" Location="Round1.txt" FileType="text" Preload="true" Blocking="true" Variable="CardValues" />

        <!-- Action that resets the round -->
        <Actions Name="RestartRound">
            <Action Method="SetVar" Param1="RoundScore" Param2="0" />
            <Action Method="SetVar" Param1="TotalCardsValue" Param2="0" />
            <Action Method="SetVar" Param1="CardsFoundCount" Param2="0" />
            <Action Method="CallActions" Param1="ResetSelection" />
            <Action Method="ShowActor" Param1="Card0" />
            <Action Method="ShowActor" Param1="Card1" />
            <Action Method="ShowActor" Param1="Card2" />
            <Action Method="ShowActor" Param1="Card3" />
            <Action Method="ShowActor" Param1="Card4" />
            <Action Method="ShowActor" Param1="Card5" />
            <Action Method="ShowActor" Param1="Card6" />
            <Action Method="ShowActor" Param1="Card7" />
            <Action Method="ShowActor" Param1="Card8" />
            <Action Method="ShowActor" Param1="Card9" />
            <Action Method="ShowActor" Param1="Card10" />
            <Action Method="ShowActor" Param1="Card11" />
            <Action Method="ShowActor" Param1="Card12" />
            <Action Method="ShowActor" Param1="Card13" />
            <Action Method="ShowActor" Param1="Card14" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card0" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card1" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card2" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card3" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card4" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card5" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card6" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card7" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card8" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card9" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card10" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card11" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card12" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card13" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="Card14" />
        </Actions>

        <!-- Action that moves to the next round -->
        <Actions Name="NextRound">
            <Action Method="CallActions" Param1="RestartRound" />
            <Action Method="AddVar" Param1="CurrentRound" Param2="1" />
            <Action Method="LoadFile" Param1="RoundFile" Param2="true" Param3="Round1.txt" Condition="IsRound0" />
            <Action Method="LoadFile" Param1="RoundFile" Param2="true" Param3="Round2.txt" Condition="IsRound1" />
            <Action Method="LoadFile" Param1="RoundFile" Param2="true" Param3="Round3.txt" Condition="IsRound2" />
        </Actions>

        <!-- Action that is called when a correct answer is given -->
        <Actions Name="CorrectAnswer">
            <Action Method="AddVar" Param1="RoundScore" Param2="1" />
            <Action Method="HideActor" Param1="SelectedCardNames:0" />
            <Action Method="HideActor" Param1="SelectedCardNames:1" />
            <Action Method="HideActor" Param1="SelectedCardNames:2" />
            <Action Method="AddVar" Param1="CardsFoundCount" Param2="3" />
            <Action Method="SetProperty" Param1="Text" Param2="Correct, well done" Param3="AnswerNotification" />
            <Action Method="SetTimeline" Param1="AnswerNotificationAnim" Param2="AnswerNotification" />
        </Actions>

        <!-- Action that is called when an incorrect answer is given -->
        <Actions Name="WrongAnswer">
            <Action Method="SetProperty" Param1="Text" Param2="Incorrect, try again" Param3="AnswerNotification" />
            <Action Method="SetTimeline" Param1="AnswerNotificationAnim" Param2="AnswerNotification" />
        </Actions>

        <!-- Action that is called when the user has finished selecting 3 cards -->
        <Actions Name="ResetSelection">
            <Action Method="SetVar" Param1="CardIndex" Param2="0" />
            <Action Method="SetVar" Param1="TotalCardsValue" Param2="0" />
        </Actions>

        <!-- Action that is used to check the answer -->
        <Actions Name="CheckAnswer">
            <Action Method="CallActions" Param1="CorrectAnswer" Condition="CardsMatch" />
            <Action Method="CallActions" Param1="WrongAnswer" Condition="!CardsMatch" />
            <Action Method="CallActions" Param1="ResetSelection" />
            <Action Method="CallActions" Param1="RoundComplete" Condition="NoCardsLeft" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="SelectedCardNames:0" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="SelectedCardNames:1" />
            <Action Method="SetProperty" Param1="Timeline" Param2="StillAnim" Param3="SelectedCardNames:2" />
        </Actions>

        <!-- Action that is called when the round is complete -->
        <Actions Name="RoundComplete">
            <Action Method="AddVar" Param1="Score" Param2="RoundScore" />
            <Action Method="CallActions" Param1="NextRound" />
        </Actions>

        <!-- Create a grid cell actor template to represent our card -->
        <Template Name="CardTemplate">
            <Label Name="Card$index$" Size="-18, -28" Background="Button1Brush" BackgroundColour="255, 255, 200, 255" SelectedColour="200, 255, 200, 255" Font="font1" GridPos="$gridpos$" HitTest="true" SelectType="normal" Selected="false" OnTapped="CardSelected">
                <Timeline Name="FlashAnim" AutoPlay="true">
                    <Animation Anim="Flashing" Repeat="0" Target="Scale"/>
                </Timeline>
                <Actions Name="CardSelected">
                    <Action Method="SetVar" Param1="SelectedCardNames:0" Param2="Card$index$" Condition="CardIndexIs0" />
                    <Action Method="SetVar" Param1="SelectedCardNames:1" Param2="Card$index$" Condition="CardIndexIs1" />
                    <Action Method="SetVar" Param1="SelectedCardNames:2" Param2="Card$index$" Condition="CardIndexIs2" />
                    <Action Method="AddVar" Param1="TotalCardsValue" Param2="CardValues:$index$" />
                    <Action Method="AddVar" Param1="CardIndex" Param2="1" />
                    <Action Method="SetTimeline" Param1="FlashANim" />
                    <Action Method="CallActions" Param1="CheckAnswer" Condition="CardIndexIs3" />
                </Actions>
            </Label>
        </Template>

        <!-- Create a grid that contains our cards -->
        <Variable Name="SelectedCard" Type="int" Value="-1" />
        <Grid Name="ItemsGrid" Size="-100, -90" Docking="bottom" Background="PanelBrush" BackgroundColour="150, 200, 255, 255" SelectedColour="150, 200, 255, 255" HitTest="false" ClipMargin="10, 10, 10, 10" MultiSelect="true" UseParentOpacity="false" ItemsData="CardValues" ItemsTemplate="CardTemplate" ItemsTargetType="text" Selection="SelectedCard">
            <RowDefinition Name="r0" AlignV="middle" Height="-33" />
            <RowDefinition Name="r1" AlignV="middle" Height="-33" />
            <RowDefinition Name="r2" AlignV="middle" Height="-33" />
            <ColumnDefinition Name="c0" AlignH="left" Width="-20" />
            <ColumnDefinition Name="c1" AlignH="left" Width="-20" />
            <ColumnDefinition Name="c2" AlignH="left" Width="-20" />
            <ColumnDefinition Name="c3" AlignH="left" Width="-20" />
            <ColumnDefinition Name="c5" AlignH="left" Width="-20" />
        </Grid>

        <!-- Create the menu at the top of the screen -->
        <StackPanel Size="-100, -10" HitTest="false" Docking="top" Orientation="horizontal">
            <Label Name="Restart" Background="Button1Brush" SelectedColour="80, 80, 80, 255" Size="-15, -100" Font="smallfont1" Text="Restart" Margin="0, -5, 0, 0" OnTapped="RestartRound" />
            <Label Background="PanelBrush" Size="-10, -100" Font="smallfont1" Text="Round" />
            <Label Name="RoundScore" Background="PanelBrush" Size="-10, -100" Font="smallfont1" Binding="[Text]CurrentRound" />
            <Label Background="PanelBrush" Size="-10, -100" Font="smallfont1" Text="Score" />
            <Label Name="Score" Background="PanelBrush" Size="-10, -100" Font="smallfont1" Binding="[Text]Score" />
            <Label Background="PanelBrush" Size="-10, -100" Font="smallfont1" Text="Round Score" />
            <Label Name="RoundScore" Background="PanelBrush" Size="-10, -100" Font="smallfont1" Binding="[Text]RoundScore" />
            <Label Name="Test3" Background="PanelBrush" Size="-10, -100" Font="smallfont1" Binding="[Text]TotalCardsValue" />
        </StackPanel>

        <!-- Create answer notification overlay -->
        <Animation Name="AnswerNotificationAnim" Duration="2" Type="float">
            <Frame Value="-2000" Time="0" Easing="quadin" />
            <Frame Value="0" Time="0.5" />
            <Frame Value="0" Time="1.5" Easing="quadout" />
            <Frame Value="2000" Time="2" />
        </Animation>
        <Timeline Name="AnswerNotificationAnim" AutoPlay="true">
            <Animation Anim="AnswerNotificationAnim" Repeat="1" Target="PositionX" />
        </Timeline>
        <Label Name="AnswerNotification" Position="-2000, 0" Size="-50, -15" Background="PanelBrush" BackgroundColour="80, 255, 80, 255" Font="font1" HitTest="false" />

    </Scene>

</xml>

IwGame Engine v0.35 Released – Multi-touch User Interface, XOML Programs, 9-Patch Rendering and Arrays

New here? What’s IwGame? IwGame is an open source free to use cross platform game engine for iPhone, iPad, Android, Bada, Playbook, Symbian, Windows Mobile, LG-TV, Windows and Mac, built on top of the Marmalade SDK. You can find out more and download the SDK from our IwGame Engine page.

Its been a while since we last released an update for IwGame but 0.35 is finally here. Our plan for this update was to enabled IwGame as a viable app development SDK as well as game development. With the new addition of the user interface we feel that we have made a great stride towards that aim.

Here is the latest list of changes:

IwGame 0.35 Changes:
* XOML schema added. This enables error checking, intellisense and auto completion when creating XOML
* New user interface system added, enabling IwGame as an app developemnt platform. IwGameUI has the following features
* Static and proprtional sizing an margins
* Buttons / toggle / sticky buttons with OnToggledOn and OnToggledOff events
* Labels
* Text input boxes
* Sliders (horizontal and vertical)
* Canvas – Allows organisation of content on a large scrollable canvas area as well as docking of content to edges
* Stack panels and wrap panels (horizontal and vertical) allow organisation of content in vertical and horizontal stacks
* Wrap panel (horizontal and vertical), works much in the same way as an orinary stack panel exceot content that overflows the edge of the panel will wrap down to the next line or across to the next column
* Listbox (horizontal and vertical) allows organisation and selection of content using sigle and multi-select. Can use templates and bindings for automatic binding of data to the list box
* Grid allows the display and navigation of two dimensional data, each column or the whole grid can be bound to data and templates.
* Image view that allows the display and navigation of large images (supports panning and pinch zoom), can also contain any other UI or actor
* Text view that allows the display and navigation of text (supports panning and pinch zoom)
* Web view – A wrapper for Marmalades Web API. Multiple web views cn abe instantiated inside the UI
* TabBar (horizontal and vertical) – A tab bar allows the display of multiple pages or views of content. The tab bar can be orientated horizontally or vertically. Tab bar can appear at top, bottom, left or right of control area. View swicthing can also be animated using a selection of preset animations or using your own custom animations.
* All UI elements are supported in XOML, fully bindable and integrates directly into all other systrems including the animation system.
* Container UI elements will clip children. Container actors also allow the specification of a clip margin.
* Scrolling and zooming supports iOS style spring effect to place contents back into position when going over boundaries
* All UI elements support hide and show timelines
* Rendering system now supports 9-patch rendering using 9-patch brushes
* Sprite system now supports 4 parameter skewing
* IwGameInput system reworked to make it more multi-touch friendly
* XOML now fully supports multi-touch events (up to 5 simultaneous events)
* Event bubbling added, enabling touch events to travel up to parent actors
* Actors and scenes now support proportional sizing
* Actors now support margins and docking to screen edges
* Actor touch events now provide the touch index that causes the event
* Sprites / actors can now scale their opacity by their parents
* Delta animations targeting position, scale, rotation, colour and opacity will apply the update from the original value that was assigned to the actor
* Actors now support simple bindings. Simple bindings are a simple binding of a variable to an actors property without having to create a full bindings list
* Actors can now be created from a brush. Using brushes instead of images, allows you to create image based actors without having specify a visual size
* Scenes and actors now support dynamic resizing and orientation changes
* Support for array variables added
* System XOML variable array added. Allows you to query current display width, height, mode, device type, multi-touch / compass, accelerometer, keyboard support. Also provides a rating hint as to the size of the display, which you can be used to determine size of fonts etc
* New program / command system added, This new system is a very powerful way of creating game or app flow logic in XOML
* New DebugText action that displays the value of a XOML variable / text to the debug output
* New ChangeProgram action that allows the modification of running programs
* New CIwGameAnimUtil class added that enables creation o simple timelines in code
* Images now support filtering and format conversion in code and in XOML
* CIwGameRender2d now supports rendering of images fom short vectors. These types of images will not use the data cache
* Actor / sprite rendering optimised to cut down processing of actors / sprites not on screen or visible
* Sprite system completely changed to support heirarchical rendering
* Text rendering optimised when not rotated
* Fonts, images and XOML files can now be conditionally loaded
* Scene FixedAspect and LockWIdth have been deprecated. Scenes now use the new CanvasFit option which supports canvas fitting to Width, Height, Both, None and Best Fit
* Physics can be disabled for a complete scene to reduce processing
* IwGame class now uses layer ordering to determine priority of touch events
* Re-arranged XOML tags and tag attributes, placing more commonly used tags / attributes earlier to speed up XOML parsing
* Touch focus is now released when user touches an actor and moves their finger away from the actor by more than double the radius. Touch focus is also released when camera is panned in scenes that have touch panning enabled.
* Frame rate cap has been removed
* BUG FIX: When releasing scene touch panning on an actor it no longer takes it as a tap on the actor
* BUG FIX: Mip-mapping globally disabled as it was causnig many rendering artefect issues
* BUG FIX: camera touch pan scaling, camera pan now follows finger accurately
* BUG FIX: Attempting to instantiate a template inside an actor crashed has now been fixed
* BUG FIX: Fixed issue with bool variable add method
* BUG FIX: CIwGameActor::setAngularVelocityDamping() fixed
* BUG FIX: Fixed issue where releasing a scene touch pan on an actor will send the OnBeginTouch event to the actor

As you can see that’s an immense bunch of changes. if you have been following the real-time updates in the forum then you will probably be aware of many of these changes: I can tell you one thing for sure, I did not enjoy updating the documentation

Lets take a more in-depth look at some of these new changes:

User Interface

The biggest change in 0.35 is the additional of the user interface system IwGameUI. Our aim was to create a user interface system that was good for both app and game development. With this aim in mind we believe we have created a user interface system that is better, more versatile and more extensible than currently available user interface systems.

Here are the main features of IwGameUI:

  • Data binding (two way in some cases). Data binding allows you to map XOML variables / arrays to UI elements and when those variables change the changes are reflected in the user interface components
  • 14 different kinds of controls (buttons, icons, labels, text boxes, list boxes, grids, sliders, canvas, stack panels, wrap panels, image views, text views, web views and tab bars)
  • Support for events and actions, such as handling button toggling, selection and value changes.
  • Fully integrated into IwGame’s animation system
  • Styling and templating
  • 9-patch rendering which allows you to render clean looking buttons / borders without losing resolution
  • Supports modifiers and other customisations, allowing you to augment the behaviour of UI elements
  • Supports proportional sizing
  • Supports dynamic orientation / screen size changes
Ywo example projects have been included with 0.35 that show a basic UI and a cmoplex UI. Yuo can see a video of the complex UI at http://www.youtube.com/watch?v=ZImWhKwV1tA

Heres a quick example of a little bit of UI defined in XOML:

        <StackPanel Background="PanelBrush" Orientation="horizontal" Size="-95, 100" AlignV="middle" Margin="0, 0, 10, 10">
            <Icon Background="Button1Brush" Margin="20, 0, 0, 0" />
            <Icon Background="Button2Brush" Margin="20, 0, 0, 0" />
            <Icon Background="Button3Brush" Margin="20, 0, 0, 0" />
            <Icon Background="Button4Brush" Margin="20, 0, 0, 0" />
        </StackPanel>

This bit of XOML will create a stack panel that contains 4 icons stacked horizontally at the side of each other. Notice that the width of the stack panel is set to –95. The new negative sizes represent proportional sizing, with –95 meaning either 95% of the parents container size or if no parent, 95% of the screen size.

Programs and Commands

Whilst the events / actions system is great for handling the event based parts of your game we felt that we needed a new system that would allow some kind of game / app logic scripting that would enable developers to define sets of complex functionality that can be ran at any point during the apps lifetime. Obviously as we are programmers we felt a program / command style system would feel most natural. We also felt that we needed a versatile system that the developer could completely customise to suite their needs, so we added the program system. IwGame’s program system allows developers to create complex programs from a list of hierarchical commands. Commands are executed in the order in which they are declared until the end of the program is reached. Commands can also executed concurrently, allowing the program to run multiple commands together each frame. Lets take a look at a quick program example:

        <Program Name="Main" AutoRun="true" Priority="true">
            <Command Parallel="true">
                <Command Method="show_video" Param1="IntroVideo" />
                <Command Method="run_actions" Param1="StartAnimation" Param2="Door" />
            </Command>
            <Command Method="show_speech" Param1="0" Param2="Hey how ya doing?" />
            <Command Method="show_speech" Param1="0" Param2="Tap that door" />
            <Command Method="wait_tapped" Param1="Door" />
            <Command Method="set_property" Param1="Timeline" Param2="RemoveItemAnim" Param3="Door" />
            <Command Method="wait_tapped" Param1="ID Card" /> <Command Method="add_inventory" Param1="ID Card" />
            <Command Method="load_scene" Param1="Scene2.xml" />
        </Program>

We define a program named “Main” and tell I to automatically run when the scene is loaded. We set the program as a priority program, which means it is executed before all other programs.

Next we add a command that executes two other commands in parallel. This will show an intro video and start a door animation. Once complete the player will be shown the “Hey how ya doing” speech and so on and so forth.

As you can see using the program system it becomes an incredibly easy process to define complex logical game and app flow.

Multi-touch in XOML

XOML now supports multi-touch events for actors. Actors can now respond to up to 5 simultaneous taps, begin and end touches. For example, you could control 5 actors at the same time on screen in a game, or create a cool user interface element that utilises more than one finger, like we have done with pinch zoom image and text view controls.

Proportional Sizing, Docking, 9-Patch Brushes and Orientation Changes

We now support proportional sizing of actors and margins, allowing you to create game and app layouts that are completely screen size independent. Actors can now be docked to the edges of the screen and canvas containers. 9-Patch brushes now allow the rendering of images where you want to retain the clean 1:1 pixel border around an image. All actors and scenes can now detect and handle orientation changes. Any actors or UI elements that are declared as proportionally sized will automatically be resized for you when the screen resolution changes. In addition, if no size is specified when creating an actor the actors assigned brush size will be taken as its visual size. We recommend that you create all actors from brushes to take full advantage this feature.

Array Variables, System Variables and Simple Bindings

XOML now supports the creation and definition of array variables. The bindings system also works with the array system. To access a particular element of an array to a property you would use variable_name:array_index, instead of simply variable_name.

A new system array has been added by default to the XOML system. This allows you to query certain aspects of the system such as display size, support for multi-touch etc..

Actors can also use simple bindings. A simple binding is a binding without a bindings collection which allows you to bind a single variable to a single actor property, e.g:

<ActorText Name="NameLabel" ......... Binding="[Text]ProfileName:2" />

In the above example we bind the 3rd index of the ProfileName array to the Text property of NameLabel.

Event Bubbling

Actors now support bubbling of touch events. Actors can be marked to receive input events from their child actors

Actor and sprite optimisations

We have gone through and optimised the actor and sprite systems to cut down a lot of rendering and processing of actors / sprites that are clipped or off screen.

Scene Virtual Canvas Sizing

We have changed the way a scenes canvas sizing is set-up to make it more versatile. You can now choose the method by which iwGame scales your scenes to the final display as well as choose the scenes origin

Image filtering and format conversion

When images are declared in XOML you can now specify if they should be filtered when rendered. You can also specify the format that you would like the image to be converted to before uploaded to texture RAM, reducing the size of your texture RAM usage.

Licensing Terms Updated

The licensing terms for IwGame Engine usage has been changed. Whilst there are other minor changes, the main change is:

You may not use the IwGame Engine or any of its parts to create products that can be used to create other apps and games for mobile devices without express prior written notice from an executive of Pocketeers Limited with the correct authority to grant authorisation.

IwGame Engine 0.35 coming this weekend with luck

Its been a long hard slog getting the UI update in but we finally feel confident that there are enough features in the UI system now to release IwGame 0.35 this week / early next week.  The new bindable UI makes the IwGame engine equally potent as a general app development engine as well as a game engine. In fact, using XOML I dare say its much easier to develop apps using the IwGame that it is any of the native SDK’s (Hmm, maybe the engine needs a new name  :))

Unfortunately there have been a massive number of changes within the engine, which means many of the original engine files have also been changed, so if you are thinking of merging then its not going to be easy. We are currently working on  documentation and what not, which unfortunately is going to take some time due to the large number of changes. That said the wait will be worth it as we believe 0.35 is our best release yet enabling developers to not only create awesome games with ease but also awesome apps with ease.

 

Yet another IwGame Engine UI Progress Update

Not had a great deal of spare time to spend on the UI this week but did manage to get a few cool things in there including:

  • Scrolling grids
  • Scrolling list boxes
  • Horizontal list boxes
  • 9-patch brushes
  • Child element sizing based on percentage of parent
  • Child clipping
  • Grid per column bindings
  • Dynamic resizing of elements, grids and list boxes will automatically re-layout child elements to make use of extra space
  • UI elements can allow touch events to bubble up to parent elements allowing them to also receive the same events
  • Tidied up the UI input system
  • 4 parameter skewing – See the wonky text on the large and small buttons for an example

Heres a quick screen shot showing the current UI demo:

More Advanced IwGame Engine UI Screen Shot

More Advanced IwGame Engine UI Screen Shot

Those frogs look happy to be sat in that list box like that :)

And here’s a new and better video showing the new UI http://www.youtube.com/watch?v=IhtT_e5u8gU

I hope to spend a few additional weeks on implementing more UI controls such as sliders and tab vies etc.. before we released 0.35.

IwGame UI Progress Update

Got a quick update showing how the IwGame engines UI system is shaping up. Note that the UI system is “bitmap” based and IwGame does not draw things like buttons, grids etc.. manually. Here’s a quick screen shot at iPad resolution showing some basic UI:

Basic IwGame Engine UI Screenshot

Basic IwGame Engine UI Screenshot

This is just a static image however, so you cannot really see the animation that’s built into the UI, for that you need to take a look at a quick video I stuck together showing the UI in action at http://www.youtube.com/watch?v=oV3kYLbzcKo

 

The UI itself consists of the following elements:

  •  StackPanels – The top left hand control is a vertical stack panel containing 3 horizontal stack panels. Each horizontal stack panel contains multiple basic UI components including buttons, labels and text input boxes. The check boxes and the long named button are toggle buttons. The top stack panel and the components within the panel have been draggable so they can be dragged away from the stack panel and moved around. Tapping the Expert check box will spin the control 360 degrees using an animation time line. One of the buttons and two of the check boxes also have animation time lines applied to them.
  • Grid – The control to the bottom left is a 3×4 grid that contains 12 items. These items are simple label buttons that when tapped will animate. A XOML array variable is bound to the grid and data from the array is moved into the grid. Updating the XOML array will automatically update the grid elements. The types of elements within the grid are defined using an item template. You can create a grid manually by adding components directly to the grid in XOML or in code bypassing the binding system. This allows you to create more complex controls within each grid cell. Tapping an item in the grid will set it animating
  • List box – The list box to the top right work on the same principles as the grid where data is bound to the list box and a template can be specified that defnies the type of items. This list box is a multi-select list box which allows you to select multiple  items
  • List Box 2 – The list box to the bottom right is more complex list box that shows list items using a more complex control. The list box items in this instance are created using a horizontal stack panel, which contains a label and a button. The list box is a single item selection list box

The UI controls themselves can be moved around and placed anywhere in the scene. the whole scene can also be moved around.

To give you an idea as to how the XOML looks, here’s a short code clip showing the XOL that creates the list box to the upper right of the screen:

    <!-- Create a listbox --> 
    <!-- ListBoxItems - Defines a list of items that will be bound to the list box -->
    <Variable Name="ListBoxItems" Type="arraystring" Size="4" Value="Item 1, Item 2, Item 3, Item 4" />
    <!-- Create a template that will be used to generate the list box actors -->
    <Template Name="ListBoxItemTemp">
        <Label Name="ListItem$index$" Background="ListBoxItemBrush" BackgroundColour="200, 200, 200, 255" SelectedColour="80, 80, 255, 255" Font="trebuchet_12" TextColour="255, 255, 255, 255" SelectedTextColour="255, 255, 255, 255" Margin="0, 0, 20, 0" SelectType="toggle" Selected="false" />
    </Template>
    <ListBox Name="ListBox" Position="351, -190" Background="ListBoxBrush" MultiSelect="true" ItemsData="ListBoxItems" ItemsTargetType="text" ItemsTemplate="ListBoxItemTemp" HitTest="true" Draggable="true" />

 

As you can see its pretty straight forward:

  • We create an array string variable and assign it the data that will be bound to the list box
  • We create a template that represents our items
  • We create a list box that uses the template and data and make it draggable

Well that’s it for now. We will be adding more and more features to the UI over the coming weeks and will keep you updated.

 

Pocketeers Limited is taking on New Mobile Projects


Pocketeers Limited Mobile Developer Logo

Pocketeers Limited Mobile Developer

 

Need a mobile game or app developed across multiple platforms (iPhone, iPad, Andriod,Bada, PlayBook etc..) at little extra cost? Or maybe you need a rapid prototype of your next game or app idea creating as proof of concept?

Pocketeers Limited a UK based mobile app and game developer (established in 2002) responsible for the creation of the IwGame Engine are looking to take on additional gaming and app projects. Pocketeers will consider any size project, but will favour those projects that utilise the IwGame engine / Marmalade SDK. Pocketeers have worked with clients large and small including the likes of Electronic Arts, Destination Software, Ideaworks, Honey Badger Studios, Tournay Software, and others.  Pocketeers provide a full range of services including design, coding, art work, audio and testing at very competitive prices.

For more details you can contact Pocketeers Limited via the web at http://www.pocketeers.co.uk/?page_id=8

Puzzle Friends FREE for iOS Just Released

IwGame powered Puzzle Friends has just been released on iPhone, iPad and iPod Touch. This product shows many of the latest IwGame features running in a commercial product on iOS, including in-app purchasing, Facebook posting and dynamic content. It also includes Scoreloop leaderboards which will be integrated into IwGame soon as an extension.

http://itunes.apple.com/us/app/puzzle-friends/id513683800?ls=1&mt=8

Its FREE so grab a copy now and check it out. Please consider leaving a nice review if you like the game :)

 

IwGame – We Need Your Feedback

Hi Everyone,

The IwGame Engine has been in development for around 6 months now and although we’ve received lots of feedback regarding bug reports and feature requests we would like to know your opinions on the current state of the engine. Here are a few questions to consider:

  • Is IwGame difficult to use, if so can you suggest any improvements that we could make to make it easier to use?
  • How are you finding the current feature set? Is anything particularly buggy, hard to use or simply missing something?
  • What’s the next BIG feature for you, what would you really like to see come next?
  • How are you finding using XOML? Do you prefer the declarative approach or do you prefer to code things up in C++ instead. Can you suggest any improvements you would like to see?
  • If you have recently stopped using IwGame, what made you leave? Was there a better option and if so, what was the deal making features?

This is the opportunity to have your say, any feedback that you can provide is greatly appreciated and will help steer the direction of the IwGame engine.

Mat

IwGame Engine v0.33 Released – Unified Android and iOS in-app purchasing

New here? What’s IwGame? IwGame is an open source free to use cross platform game engine for iPhone, iPad, Android, Bada, Playbook, Symbian, Windows Mobile, LG-TV, Windows and Mac, built on top of the Marmalade SDK. You can find out more and download the SDK from our IwGame Engine page.

I can tell you one thing, testing in-app purchasing from scratch is NOT an easy task, in fact its a pain in the a** to be quite honest. However, like anything that’s cool its worth doing. Its been a while coming but we finally put together a unified API for in-app purchasing on the Android and iOS platforms. To see the end product in action check out Puzzle Friends on Android (the new name for the free version of cOnnecticOns (I must have been off my head when I invented the name cOnnecticOns :) ). The iOS version is currently with the great Apple reviewers in the sky.

Ok, here is the list of changes for 0.33:

  • In-app purchasing added for Android and iOS (IwGameMarket)
  • Scenes can now be augmented after they have been created (like partial classes)
  • Scenes can now be layered visually
  • New SetAllTimelines action added to XOML that will set the timeline of all scenes
  • SetVariable action now allows you to specify the scene in which the variable lives
  • Resources can now be tagged with a tag name
  • New RemoveResource and RemoveResources actions that allow removal of resources from global resource manager
  • New CallActions action added that enables execution of other actions lists
  • Actor now has ScaleX and ScaleY bindings
  • Relative actor depth is now 0 for linked actors
  • UDID removed from IwGameAds for iOS
  • Scenes now have a ClipStatic property that will force the clipping area of a scene to stay in place on screen instead of moving with the scenes camera
  • BUG FIX: Scene NotifyResuming now called properly
  • BUG FIX: CIwGameAnimInstance::setAnimation() no longer crashes if NULL is passed
  • BUG FIX: IwGameAdsView sprites are now updated correctly

The most interesting addition this update is the well hidden IN-APP PURCHASING for iOS and Android. With the aid of copy and paste lets take a look at the changes in more detail:

IwGameMarket – Unified In App Purchasing API for iOS And Android

Its an incredibly tough job to get noticed in the app stores these days with approaching half a million apps available in the larger stores (insane competition), its an even tougher job persuading Joe public to part with their money for your app. Many developers are turning to developing freemium titles as a means to increase visibility (app users are much more likely to download a free app) and earn money by offering the app in a limited form then allowing users to purchase additional content and game features. As of IwGame v0.33, basic in-app purchasing is now available for iOS and Android using a wrapper around Marmalade’s EDK in-app purchase extensions called IIwGameMarket.

IIwGameMarket is a not a concrete class however so you cannot just create one and use it. Instead it provides a basic interface for creating the platform specific market class as well as access to common functionality. At the moment the following marker classes are available:

CIwGameMarketiOS – Uses iOS in-app purchasing
CIwGameMarketAndroid – Uses Android market billing
CIwGameMarketTest – This version is a test class that you can use to simulate purchases / errors etc in the simulator.

IwGameMarket is designed to allow you to initialise and set-up and use in-app purchasing in a platform agnostic fashion, allowing you to query / purchase content very easily.

IwGameMarket works using a product list system, where you create and add CIwGameMarketProduct products to the IwGameMarket. Each CIwGameMarketProduct represents a single consumable / none consumable product that can be purchased.

Setting up the IwGameMarket is very simple, you simply call IIwGameMarket::Create() which initialises the correct market for the platform that your game or app is running on then set-up a few handlers, depending upon which messages you want to handle. Below shows a quick example:

IiwGameMarket::Create("Your android public key");
IIwGameMarket::getMarket()->setReceiptAvailableHandler(PurchaseComplete, NULL);
IIwGameMarket::getMarket()->setErrorHandler(PurchaseError, NULL);
IIwGameMarket::getMarket()->setRefundHandler(Refunded, NULL);	// Android only

Note that if you are releasing for iOS only then you do not need to supply your Android Market public key, simply pass no parameters to Create().

In this example, we have told IwGameMarket that we want to be notified when a purchase receipt is available, when an error occurs or when a transaction refund has happened.

When done with the market don’t forget to clean it up using:

IIwGameMarket::Destroy();

Now that the market is set-up we need to add products, below shows a quick example:

// Which OS are we running
int os = s3eDeviceGetInt(S3E_DEVICE_OS);

// Create product 1
CIwGameMarketProduct* product = new CIwGameMarketProduct();
product->Consumable = true;
product->ID = 1;
product->Name = "10 Coins";
if (os == S3E_OS_ID_IPHONE)
	product->ExternalID = "com.companyname.gamename.coinsx10";
else
	product->ExternalID = "coinsx10";
product->Purchased = false;
IIwGameMarket::getMarket()->addProduct(product);

// Create product 2
product = new CIwGameMarketProduct();
product->Consumable = true;
product->ID = 2;
product->Name = "50 Coins";
if (os == S3E_OS_ID_IPHONE)
	product->ExternalID = "com.companyname.gamename.coinsx50";
else
	product->ExternalID = "coinsx50";
product->Purchased = false;
IIwGameMarket::getMarket()->addProduct(product);

In this example, we create 2 products, our first represents 10 in-game coins, whilst the second represents 50 in-game coins. The ExternalID property is the product ID as defined in the in-app purchase section of your app in iTunes Connect for iOS or the product id of the in-app purchase in the in-app purchase section of your Android Market product control panel for Android. ID can be anything you like but will need to be unique.

Now that the system and product set-up are out the way, lets take a look at how to purchase a product. Firstly you need to call PurchaseProduct() passing in the ID defined in the CIwGameMarketProduct that you added earlier:

if (IiwGameMarket::getMarket()->PurchaseProduct(product_id))
{
}

You then need to add code to the callbacks that we added in our set-up:

int32 MarketScene::PurchaseComplete(void* caller, void* data)
{
	int type = IIwGameMarket::getMarket()->getLastPurchaseID();
	if (type == 1)	// 10 coins
	{
		GAME->AddCoins(10);
	}
	else
	if (type == 2)	// 50 coins
	{
		GAME->AddCoins(50);
	}

	return 1;
}

int32 MarketScene::PurchaseError(void* caller, void* data)
{
	// Display an error to the user

	return 1;
}

int32 MarketScene::Refunded(void* caller, void* data)
{
	// Only available on th Andriod platform
	CIwGameString id = IW_GAME_MARKET_ANDROID->getRefundedID();

	// Player was refunded so take back the items(s)

	return 1;
}

Augmenting Scenes

Another cool new feature in v0.33 is the ability to augment a previously created scene and add extra stuff to it after the fact. You can for example have a basic common scene that provides the basic background of the scene. This gets loaded by many other scenes and serves as its basic background. After its been loaded you can declare the scene a 2nd time and add additional elements which will then be integrated into the original scene.

Layered Scenes

Scenes can now be depth sorted (visually only). This is incredibly useful as previously scenes would always be drawn in the order in which they were added to the game class. There is no limit to the layer number of a scene.

Tagged Resources

Resources can now be given a tag name, allowing you to identify groups of resources. New actions have also been added that allow the removal of specific resources or groups of tagged resources from the global resource manager. We added this new features because we found that sometimes it is very useful to have resources in the global resource manager so they can be shared across scenes, but later needed a way to remove those resources when done with them.

Calling Actions Lists

Its now possible to call an actions list from an action. This is great if you want to define lots of different action sets then pick and choose which ones you want to use.

And that’s it for this update, please enjoy.