Jump to content

Photo

[Aquarius] Unity for Aquarius


9 replies to this topic

#1 Pset OFFLINE  

Pset

    Chopper Commander

  • 124 posts

Posted Wed Dec 18, 2013 4:15 PM

Happy Holidays .

Much like that one thirty or so years ago exciting opportunities for game and software development await you on winter mornings.

 

Unity 3D is free for as much as we need it for to prototype a lot of Aquarius themed content and post it online with minimal effort and worry.
It has a 2D workflow now and for the 40 x 25 x fullscreen things we need to simulate its perfect....well there's open source engines, and browserBasic...

 

C# is the "new basic" basicly and is the most commonly used language in Unity tutorials that I've been watching.

Unity has an enormous amount of support material and community activity.

 

THere's a free C# class at Udemy.com posted on reddit until Christmas. 

 

Plenty of more free Unity stuff floating around, that should be discussed when relevant.

For instance This tutorial will get you making a physics affected 2D sprite  tank with a mouse aimed turret that rolls around some
2D mountains and is threatened by a UFO, very quickly. No nonsense stuff.

 

I'm finding video tutorials to have a lot of "uhm uh and excuse that fart" noise to message ratio.

For instance today's new official Unity2D Character Control tutorial

An hour long and it certainly doesn't have to be. I'll try to sit through it and be able to maybe explain it quickly.

 

I watched a video tutorial for 20 minutes and threw this Unity thing together, WASD or arrow keys to jumble around.

 

It's the reason I started making those other apps I've been making, I need to have versatile programs that can feed back data to my Aquarius.

 

The first thing I needed was 3D models, because ...Unity 3D right? So I had to modfy some old game engine Lua code to make those.

Then I realized I don't need to deal with 3D at all and what I really need was images, and I had tons of images from some effort to make a
font and Aquarius character set particle generator long ago.

However these images as you can see in the Unity example, have some left over pixels from the Photoshop slicing operation.

256 characters x4 sides looking for one or 2 pixels to clean off wasn't my idea of productive so I made that Bitmap Composer (in Livecode) that exports the sprites at great resolutions.

Then I needed someplace to print the characters I could make with that so I made the ASCII Draw (which we wont probably need because REXPaint update soon!).

The PSET thing was just kind of natural support option (i have to post that later)

Then I spent Sunday or was it Saturday filtering data out of REXPaint, because it should be doable, and it was, but even faster for the dev, and he's
down with giving us direct access to the display data we need to script Aquarius graphical layouts into just about anything. 

 

I was waiting until I had more background work done on this,but that free C# class sound like a useful holiday gift for the Aquarius
fans than me burning out trying to hack together the ultimate Aquarius IDE before Christmas morning. 

 

The work I'm doing in Livecode is so simple that I'm 100% certain it can be done with Unity and published in a webpage.
It could be done with javascript and HTML five as well, check for free Udemy classes on those too :D

 

There are markets for the 2D adventures created by experimental game developers. GameJolt  Itchio Newgrounds even Steam.

 

My vision is a $5 to $10 tablet full of retro look and feel. I was at the BIgLots yesterday and they had $40 7inch android tablets.

My parents bought my Aquarius at the OddLots store in 83. How big was the $100 Vectrex screen that was on the shelf next to it, nine inches?

Eleven years ago I bought a 512 games in One LCD handheld game for $5 at a Dollar Store, it had like 8 by 16 character screen,

and I said, within ten years this will be full color LCD games.

I see low cost color LCD multipurpose systems in discount stores for the next 20 years. I don't have to be the one to develop or market them.

I just need to make a few games and get them to the people who will make these things.
Google for instance...just released the free GooglePlay and Android SDK for Unity.

 

Some inspirational closing statement. Yeah!


Edited by Pset, Wed Dec 18, 2013 4:17 PM.


#2 Gemintronic OFFLINE  

Gemintronic

    Jason S. - Lead Developer & CEO

  • 9,308 posts

Posted Wed Dec 18, 2013 4:20 PM

I couldn't fully digest all the point you made.  I DO appreciate all the links to 2D Unity stuff.  I have a secret, evil plan to spread the Aquarius groove to other systems including the Sega Genesis.

 

I just plain bookmarked this topic.  Thanks again!



#3 Pset OFFLINE  

Pset

    Chopper Commander

  • Topic Starter
  • 124 posts

Posted Fri Dec 20, 2013 3:05 AM

I wanted to get on with that Tank tutorial I posted up there, but the latest update had me stumped with why it wouldn't work*, so I started on the C# class.

Starts out kind of dry but once the guy gets to writing code he's really into it, in a dry kind of Microsoft guy kind of way.

 

So BASICly you download visual studio, you start a new 'console application' project, and he shows you how to code into it.

There's code or slideshows depending on the lesson type (short or long) available to download.

It's free and you do it at your own pace.

I keep thinking, "I wish someone would do a z80 assembler class" but then thankful I'm writing working code for modern computers.

We should develop that z80 class for Udemy and use the Aquarius as the base system.

I think Udemy has a free class on how to make a Udemy class. :-D 
Think about it!

 

** I googled solutions to my one line of code problem in Unity through 10 years of history  on the net and about a dozen solutions that

look nothing like what I was doing (i'm a newb).

Two hours of head banging, made it clear, I better learn this language before trying to debug someone elses scripts.

I probably had a typo somewhere.

 

Oh wow Learn X in Y Minutes 


Edited by Pset, Fri Dec 20, 2013 3:16 AM.


#4 Pset OFFLINE  

Pset

    Chopper Commander

  • Topic Starter
  • 124 posts

Posted Fri Dec 20, 2013 11:11 AM

Lecture 16, The Guessing Game. 

He writes this in six minutes, I'll try to walk through the code and see how much I know. 

Maybe if you have been wary of C languages this will make it less weird.

 

The first 11 lines of text are generated by visual studio when making a new command line project.

The libraries at the top are called Namespaces. We use prebuilt namespaces to add functions to our code.

The namespaces here handle dealing with the command prompt, the file system, text manipulation, groups of data, and more.

 

Our program get's its own namespace, commonly named after the current project.

 

The variables are declared inside Main before they can be used, unless you put Var in front of a variable and assign it a value immediately.

ex:

// declare
Int x;
// assign somewhere later in your code.
x= 1;
 
// or  declare and assign explicitly
Int x = 10;
 
// or declare and assign implicitly
var x = 10;

Random is then instantiated

theAnswer is a random number between and including 1 to 21



do {
 actions inside the loop;
} while (!numberIsGuessed);  // exclamation mark means not true

Note that the condition for the loop is outside the curly braces. Something to get used to.

Exclamation mark means not whatever variable you are comparing.

 

Lets look inside that loop.

Console.Write() is  equivalent to BASIC PRINT  with a trailing semi-colon, ie, it will print at the last cursor position used unless you add escape characters to your strings. 

Use ReadLine() to store the user input in a variable.

This is the equivalent of BASIC :PRINT "Guess a Number"; : INPUT playerInput$

 

int.Parse(playerInput)

Parse is part of the integer type and converts the value of string playerInput to an integer.

Same as Aquarius playerInput$="5": PRINT VAL(playerInput$). 

 

Double Equals == evaluate if a condition is true or false.

Note how each condition of the IF function is contained in curly braces.

 

In this game when the player guesses the correct number, the loop ends and the

program waits at ReadLine() for the enter key to exit the game

 

And now you know some C#

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
 
namespace GuessingGame
{
    class Program
    {
        static void Main(string[] args)
        {
            int playerGuess;
            string playerInput;
            bool isNumberGuessed = false;
            int theAnswer;
 
            Random rng = new Random();
            theAnswer = rng.Next(1, 21);
 
            do
            {
                Console.Write("Enter your guess: ");
                playerInput = Console.ReadLine();
 
                playerGuess = int.Parse(playerInput);
 
                if (playerGuess == theAnswer)
                {
                    Console.WriteLine("You got it!");
                    isNumberGuessed = true;
                }
                else
                {
                    if (playerGuess > theAnswer)
                    {
                        Console.WriteLine("Too high!");
                    }
                    else
                    {
                        Console.WriteLine("Too low!");
                    }
                }
 
            } while (!isNumberGuessed);
 
            Console.ReadLine();
        }
    }
}

Edited by Pset, Fri Dec 20, 2013 11:23 AM.


#5 Pset OFFLINE  

Pset

    Chopper Commander

  • Topic Starter
  • 124 posts

Posted Fri Dec 20, 2013 4:48 PM

Ok lets get to some UNITY 2D workflow basics.
I've attached a file "16x16x64x64x1024x1024.png" , named after the properties that we care about.
 
16x16 is the tile layout
64x64 is the size in pixels of each tile
1024x1024 is the total size in pixels of the document.
 
Install it and and Pin its icon to your task bar.
Alt- Click the pinned task bar Icon.
This action opens the Project Wizard instead of the last project you were working on.
 
Choose the Create New Project Tab.
Name the new project something like "Aquarius16x16x64x64"
Flip the Setup Defaults For menu to 2D
Click the Create button.
 
Close the default information pop up.
Choose menu Assets > Import New Asset
Navigate to the "16x16x64x64x1024x1024.png" file and choose Import
 
The Image should be selected on import and it's properties available in the Inspector window.
Change Texture Type to Sprite
Change Sprite Mode to Multiple
Set the Pixels to Units to 64, so that each Aquarius character should translate to 1 Unity Unit.
Set the Filter Mode to Point
 
Click the Sprite Editor button. 
Under the Sprite Editor tab at the top right of the window choose Slice
Change Type to Grid
Make X = 64 and Y = 64 
Click Slice
Click Apply
Close the Sprite Editor window
 
Choose menu GameObject > Create Other > Sprite 
Rename the object to "CHR" in the Inspector Panel
Click the small circle to the right of the Sprite input field for a selector
or drag the image "16x16x64x64x1024x1024.png" from the Assets panel to the input field
 
In the Assets Panel, Right click and choose Create >  Folder from the menu
Name the folder "Sprites"
Put the image inside of that folder
Save the Scene as "AquariusFontSprites64x64"
 
Under the Project tab choose the menu Create > Animator Controller
Name the new object "CharController" in the Assets panel
 
Choose game object "CHR" in the Scene Hierarchy
In it's Inspector window choose Add Component > Miscellanous > Animator
Drag "CharController" to the Controller input field of CHR's Animator.
Or click the reticule to the right of the field to open a selector
 
Toggle Apply Root Motion Off
Toggle Animate Physics On so that animations synch to the physics engine
 
Double click "CharController" to open it's editor.
Drag that window panel by its tab and dock it at the bottom of the screen.
 
Choose menu Window > Animation and dock that new window to the top of your screen.
 
Select game object "CHR"
In the Animation panel, just under the Record and Play icon is small menu with tiny vertical double arrows.
Click that and choose [Create New Clip] to open a file prompt.
Create New Folder and name it "Animations" and save the file as "idle" inside.
The tiny menu will take the label "idle"
and a big orange "idle" box will appear in the Animator Controller Editor
Orange signifies the default animation state.
 
Click the Project tab and  browse the Sprites folder
Toggle the the little arrow on the sprite open.
Select the first character
Scroll to the last character 
Shift select the last character to select all.
Drag the lot of them to the "idle" track in the Animation window
Change the "idle" Sample to 5 for 5 frames per second.
 
Save the scene.
Click the Play Game button at the top of the Unity main window
You should have an ever changing Aquarius character before you.
Enjoy.
 
I've included the image so you can try the steps from scratch and the unity project
so that you can see what you are supposed to end up with, which is not much ;-D
Next we'll figure out ...something.
 
The gist of this comes from around 20 minutes mark in this tutorial

Attached Thumbnails

  • 16x16x64x64x1024x1024.png

Attached Files


Edited by Pset, Fri Dec 20, 2013 4:49 PM.


#6 Pset OFFLINE  

Pset

    Chopper Commander

  • Topic Starter
  • 124 posts

Posted Sat Dec 21, 2013 3:06 AM

I'm new to Visual Studio, so here's a tip I learned.

When you type a keyword like FOR or WHILE , intellisense will appear, a sometimes irritating pop up menu of options.

If you then hit Tab a code snippet for the keyword will be inserted into your source document.

Reminds me of the Aquarius Control key commands.

Pretty handy stuff.

 

C# is the Extended BASIC of 2014,man!

 

Here's how to view a matrix of Ascii characters in the console in C#

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
 
namespace ASCIIChart
{
    class Program
    {
        static void Main(string[] args)
        {
            int counter = 0;
            int n = 32;
 
            // convert number to a ascii character using (char)n
            // build a string from chars by intializing with qoutes to make a string
            // plus + symbol concatenates strings just like BASIC
            string space = ""+(char)32;
            
            // for i = 0 to 255 step 1
            for (int i = 0; i < 255; i++)
            {
                // set the number to space or empty by default
                n = 32;
                //if NOT some escape characters
                if (!(i >= 5 && i <= 13))
                {
                //give N a value 
                n = i;
           }
 
                // print n as ascii 
                Console.Write((char)n + space);
 
                // counter patterns a neat matrix of characters
                counter++;
                    if (counter == 15)
                    { 
                        counter=0;
                        Console.Write("\n");
                    }
               
            }
            // wait for  user to hit return before exiting
            Console.ReadLine();
        }
    }
}

Edited by Pset, Sat Dec 21, 2013 3:07 AM.


#7 Pset OFFLINE  

Pset

    Chopper Commander

  • Topic Starter
  • 124 posts

Posted Fri Dec 27, 2013 12:34 AM

Ok Back to Unity.

When we left off we had created a sprite named CHR that runs through the 256 Aquarius characters using

an Animator Controller and an Animator.

 

I moved the camera closer than default and put a Unity player demonstration online.

 

What we want to do next ideally works with sprite sheets, ie, images of the same character doing various steps of animation.

However we are working with the Aquarius character set as our source of image frames so our results and product will be a little different.

To create a Running Man would require us to create two sprites, above and below the waste, for the time being will make an Aquarius themed Wading Man, who is hip deep in water, and we'll focus on his head and shoulder motion.

 

If you review the previous Unity details, we have the Animations window docked at the top of the screen

and an Animator editor window docked at the the bottom of the screen, 

 

In the Projects tab, in the Animations folder, find the Animation called "idle" and click it's name once then rename it "AllCharacters"

Find the Animator Controller called CHR in the Animations folder.

Click it's name and rename it to CHRControl and then double click it to open the Animator editor.

You should have a dark grid with two boxes, "AllCharacters" and "Any State".

 

Select the object named CHR in the Hierarchy panel.

In the Animation panel find the double arrows next to the word Sample, hold mouse down on it to get a menu

select [Create New Clip]  and then name the new anim ManIdleTop

If it is not orange, right click it and choose  Set As Default from the menu.

 

On the lower left corner of the Animation Editor window there is a "Parameters" input tab.

Add a new Float parameter and name it Speed.

 

Go to the Project tab, into the Sprites folder, toggle the small arrow on the right of our sprite sheet open

find character 14 and 19,the ones that look like a man facing head on or from behind

select them and drag them  to the timeline at the top of the the Animations panel. Set the Sample rate to 1.

 

We can now test our little loop. Hey it kind of looks like he's wading? Sure it does.

Stop the playback.

Select the CHR object in the hiearchy.

In the Animation panel find the double arrows next to the word Sample, hold mouse down on it to get a menu

select [Create New Clip]  and then name the new anim ManMoveTop

 

Go to the Project tab, into the Sprites folder, toggle the small arrow on the right of our sprite sheet open.

Find characters, 21 and 23, the man running right images, drag them to the timeline in the Animations panel.

Set the sample rate to 5.

 

In the Animator editor panel, right click ManIdleTop and choose Make Transition from the menu

then click on ManGoTop to connect the two elements.

Repeat the process in reverse from ManGoTop to ManIdleTop

 

Ud2mcf7.png

 

Select the Transition line from ManIdleTop to ManGoTop.

In the Inspector panel see the Conditions,  set it to the following  "Speed" , "Greater" and "0.01"

 

Select the Transition line from ManGoTop to ManIdleTop

In the Inspector panel see the Conditions,  set it to the following  "Speed" , "Less" and "0.01"

 

Ok we are almost ready to animate with a script.

The speed handled by the script works with physics so we want to add some elements to our sprite and scene.

Select the object CHR in the Hierarchy, 

In the Inspector panel choose Add Component >  Physics 2D > Rigidbody 2D

then choose Add Component > Physics 2D > Box Collider

 

Under the application menu choose GameObject > Create Empty

Name the gameobject "Waterline"

In the Inspector panel choose Add Component >  Physics 2D > Box Collider

Set the Box Collider 2D Size to 11

Set it's Y position to -1

Test the scene, the Aquarius guy should fall on an invisible platform and stop.
if not, make sure both CHR and the new Waterline Z location are 0

 

Now are scene is ready to script. But I'll do that in another post.

* note that at this time you won't see the running animation frames, we'll script those to happen with our key input.


Edited by Pset, Fri Dec 27, 2013 12:43 AM.


#8 Pset OFFLINE  

Pset

    Chopper Commander

  • Topic Starter
  • 124 posts

Posted Fri Dec 27, 2013 1:10 AM

This script and part of the tutorial comes from around 38 minutes in the tutorial video

 

Here's an online example of the result 

I've also attached the current project state for you to poke around in.

 

Select the object CHR

In the Inspector tab select Add Component > Script 

Choose CSharp and name the script ManMotion

If it doesn't open MonoDevelop for your, choose "Open" in the inspector and go to MonoDevelop to edit the script.

 

 

Here is a simple script  to  move the character right or left using the same two frames of animation.

The speed variable set by this script will change the state of the Animator from ManIdleTop To ManGoTop and back.

using UnityEngine;
using System.Collections;
 
public class ManMotion: MonoBehaviour 
{
public float maxSpeed = 10f;
bool facingRight = true;
 
Animator anim;
 
// Use this for initialization
void Start () 
{
anim = GetComponent<Animator>();
}
 
// Update is called once per frame
// FixedUpdate is used to match with physics
void FixedUpdate () 
{
// keyboard and/or game controller input
float move = Input.GetAxis ("Horizontal");
 
anim.SetFloat ("Speed", Mathf.Abs (move));
 
rigidbody2D.velocity = new Vector2 (move * maxSpeed, rigidbody2D.velocity.y);
 
if (move > 0 && !facingRight)
Flip();
else if(move <0 && facingRight)
Flip();
 
}
 
void Flip()
{
facingRight = !facingRight;
Vector3 theScale = transform.localScale;
theScale.x *= -1;
transform.localScale = theScale;
 
}
}

Attached Files


Edited by Pset, Fri Dec 27, 2013 1:16 AM.


#9 Pset OFFLINE  

Pset

    Chopper Commander

  • Topic Starter
  • 124 posts

Posted Fri Dec 27, 2013 2:04 AM

To add his legs. Rename object CHR to "Top"

Copy and Paste Top and rename the duplicate to "Bottom"

 

Set the Y location of Top to 1.5, with Bottom at 0.5 and our waterline object at -1

 

In the Assets panel right click and choose Create > Animator Controller 
Name it LegControl

 

Choose the Bottom object and drag the LegControl animator controller into the Controller field of it's Animator component.

Or use the small target circle next to the field to pull up a selector panel.

 

Double click the LegControl animator controller to open the Animator editor panel.

Under the Parameter's tab add a Float named "Speed"

 

Be sure the object we named Bottom is selected.

In the Animation panel find the double arrows next to the word Sample, hold mouse down on it to get a menu
select [Create New Clip]  and then name the new anim ManIdleLeg

If it is not orange, right click it and choose  Set As Default from the menu

 

Go to the Project tab, into the Sprites folder, toggle the small arrow on the right of our sprite sheet open

find the front facing legs character. Drag it to the timeline in the animations window set the Sample rate to 1.

 

In the Animation panel find the double arrows next to the word Sample, hold mouse down on it to get a menu
select [Create New Clip]  and then name the new anim ManGoLeg

 

Go to the Project tab, into the Sprites folder, toggle the small arrow on the right of our sprite sheet open

find the two running legs frames. Drag them to the timeline in the animations window set the Sample rate to 5.

 

Hit the play button and I think you should have a running man.

Note that his top rests on his bottom and they are technically two entities.

Ideally a composite sprite would be made in an image editor, skipping this second step.

 

Take him for a jog

 

 

 

 

Attached Files



#10 Pset OFFLINE  

Pset

    Chopper Commander

  • Topic Starter
  • 124 posts

Posted Sat Jan 4, 2014 6:58 AM

I was looking for good sprite/tile tools that could spit out good code that I could fathom and I found 

UniTMX: A TMX importer for Unity3d

 

Which imports .tmx files saved out of Tiled   into Unity

as Mesh objects, which I guess are different than sprites.

According to the UniTMX directions each tile can be assigned some collision data while in Tiled. I haven't test that yet.

 

Here's my original set up in TiledugSBGI8s.png

The included tiled document uses a 32x32 pixel per character black  texture with transparency.

The Unity sample provided uses the inverse colored bitmap, but you can't see your characters in the TIled picker when they are white on transparent.

 

 

 

ykAzfu1s.png The "GameObject" set up after following the UniTMX instructions

Note how the imported image "Sprite" was set up ZAv2aYcs.png

Here's how the "Material" looksfkVcIhPs.png

 

 

Tiled document and Unity project and assets with Read Me is attached

Attached Files


Edited by Pset, Sat Jan 4, 2014 7:00 AM.





0 user(s) are browsing this forum

0 members, 0 guests, 0 anonymous users