posts dated from: august 2015

Otter Example: Text

Otter Example: Text
The last Otter example I was able to jam out before leaving for PAX was all about Text and RichText. Text seems to just be insanely difficult and time consuming to implement, so making it really easy for users of Otter was a big goal of mine. For most simple cases of using Text, Otter should accomplish that goal!

Here's a quick example of just some normal text using some simple effects.
  class Program {
static void Main(string[] args) {
// Create a Game.
var game = new Game("Text Example");

// Create a Scene.
var scene = new Scene();

// Create a Text object using the default font with size 16.
var text1 = new Text("Just some basic text.", 16);
// Position the Text.
text1.SetPosition(20, 20);
// Add it to the Scene's Graphic list for rendering.
scene.AddGraphic(text1);

// Create a Text object using the deafult font and a size of 32.
var text2 = new Text("Bigger text!", 32);
// Position the Text.
text2.SetPosition(20, 50);
// Add it for rendering.
scene.AddGraphic(text2);

// Create a Text object using the font yardsale.ttf and a size of 40.
var text3 = new Text("Using a font", "yardsale.ttf", 40);
// Position the Text.
text3.SetPosition(20, 120);
// Add it for rendering.
scene.AddGraphic(text3);

// Create a Text object using the font yardsale.ttf and a size of 40.
var text4 = new Text("Using a shadow!", "yardsale.ttf", 40);
// Set the shadow color of the Text.
text4.ShadowColor = Color.Red;
// Position the Shadow.
text4.ShadowX = 1;
text4.ShadowY = 3;
// Position the Text.
text4.SetPosition(20, 170);
// Add it for rendering.
scene.AddGraphic(text4);

// Create a Text object using the font yardsale.ttf and a size of 40.
var text5 = new Text("Using an outline!", "yardsale.ttf", 40);
// Set the outline color of the Text.
text5.OutlineColor = Color.Green;
// Set the thickness of the outline.
text5.OutlineThickness = 3;
// Position the Text.
text5.SetPosition(20, 220);
// Add it for rendering.
scene.AddGraphic(text5);

// Start the Game using the created Scene.
game.Start(scene);
}
}
Image


For doing text beyond that Otter has a RichText graphic object that can be used. This allows for some more advanced things such as limited text boundaries, word wrapping, text align, effects applied to specific characters, animated text, and more, but RichText is also less efficient for rendering larger blocks of text.

For the full example head on over to the Otter example.

Image

Live from PAX

Live from PAX
I feel like I just got to Seattle a second ago, but it looks like PAX is already coming to close. Hard to believe that 3 days of insane exhaustion have already gone by. I thought I would just quick list off some games that I checked out that we're super neato:

Viking Squad: Co-op lane based brawler thing that has the procedural levels that all the kids love these days. Had a lot of fun playing with some folks.

Chasm: Procedural metroidvania (my favorite) that is feeling really good these days. I think I played a build one or two years ago that was kinda cool but didn't have a super solid feel yet, but now I think it does. I do wish for a few things with the movement, but I understand that not everyone wants to make a game with movement exploits.

Timespinner: Another metroidvania but this time not procedural. Freeze time as of right now feels like a Super Metroid ice beam that just captures the whole world instead of just enemies. Cool system with weapons that are orbs that float around the player.

Futuregrind: Kind of like a Trials game but with a crazy future bike that grinds of rails built with my favorite colors. Interesting and expressive controls and movement. Trying to get a high score on the tracks leads to some pretty interesting scenarios once you master the techniques. Really good feel, these guys know what they're doing.

Shovel Knight Plague Knight DLC: I liked Shovel Knight a lot and the new Plague Knight DLC really changes how the game is played entirely. Plague Knight's movement options are really interesting. Combining double jumps, bomb jumps, and hovering from tossing bombs leads to really expressive possibilities.

Shantae: The new one is looking really really nice and has a good mix of 3d world and 2d sprites and animation. This kind of look is really hard to pull off but I think they're doing a good job. They're using Spine to do sort of frame by frame but also transforming animations which look really smooth.

Freedom Planet: This game is totally insane to me because it was made in Multimedia Fusion (Clickteam Fusion) and I have no idea how it can possibly work. I'm saying it's a Sonic the Hedgehog like and it has the full platforming engine of a really good 2d Sonic game. There's three characters to play from, and it has awesome stages and art. It's just a good solid game. I actually bought it awhile ago, but haven't played it that much yet, but seeing at PAX leads me to believe I should get to it pretty soon.

The King's Bird: Never heard of this game until playing it at PAX but boy was it great. Momentum based platformer. I'm sold already. Very fluid controls and just all around excellent game feel. Has a cool flying mechanic and so far just the two demo levels are pretty fun, so I'm interested in seeing more.

I've played many many more games but at the time of writing this post I can't think of them all! Everything in the Indie Mega Booth and the Indie Mini Booth are worth checking out so go through those lists! Now to just survive the final day of PAX.

Doodle Post

Image

Otter Example: Tilemaps

Otter Example: Tilemaps
The next Otter example is up and deals with the wild world of using tilemaps. The following example is a way to drop some tiles into a scene and also use the mouse to edit them.

namespace TilemapExample {
class Program {
static void Main(string[] args) {
// Create a Game.
var game = new Game("Tilemap Example");

// Create a Scene.
var scene = new Scene();
// Add the Tiles Entity to the Scene.
scene.Add(new Tiles());

// Set the mouse visibility to true for this example.
game.MouseVisible = true;

// Start the Game.
game.Start(scene);
}
}

class Tiles : Entity {
// The Tilemap Graphic to use for rendering tiles.
public Tilemap Tilemap;
// The grid size to use for the Tilemap.
public static int GridSize = 32;
// The current selected tile to place.
public int CurrentTile;

public Tiles() : base() {
// Create the Tilemap the size of the game window using the defined grid size.
Tilemap = new Tilemap("tiles.png", Game.Instance.Width, Game.Instance.Height, GridSize, GridSize);
// Add the Tilemap to the list of Graphics to render.
AddGraphic(Tilemap);

// Place some tiles.
Tilemap.SetTile(0, 0, 0);
Tilemap.SetTile(1, 0, 0);
Tilemap.SetTile(2, 0, 0);

// Place some more tiles.
Tilemap.SetTile(0, 4, 1);
Tilemap.SetTile(1, 4, 1);
Tilemap.SetTile(2, 4, 1);

// Even more tiles.
Tilemap.SetTile(0, 8, 2);
Tilemap.SetTile(1, 8, 2);
Tilemap.SetTile(2, 8, 2);

// Want more tiles?
Tilemap.SetTile(0, 12, 3);
Tilemap.SetTile(1, 12, 3);
Tilemap.SetTile(2, 12, 3);
}

public override void Update() {
base.Update();

// Determine the grid position of the mouse.
var gridX = (int)Util.SnapToGrid(Input.MouseX, GridSize) / GridSize;
var gridY = (int)Util.SnapToGrid(Input.MouseY, GridSize) / GridSize;

// Switch the current tile to place based on the mouse wheel movement.
CurrentTile += Input.MouseWheelDelta;
CurrentTile %= 4; // Make sure the current tile is always 0 to 3.

if (Input.MouseWheelDelta != 0) {
// Log the current tile value.
Console.WriteLine("Current Tile is now {0}", CurrentTile);
}

// Place a tile when the left mouse button is down.
if (Input.MouseButtonDown(MouseButton.Left)) {
Tilemap.SetTile(gridX, gridY, CurrentTile);
}
// Remove a tile when the right mouse button is down.
if (Input.MouseButtonDown(MouseButton.Right)) {
Tilemap.ClearTile(gridX, gridY);
}
}
}
}
Make sure to download the tilemap source image as well. The final result should end up something like this:

Image


Even more examples on the way!

Doodle Post

Image

Otter Example: More Collisions

Otter Example: More Collisions
Hot of the presses with a new Otter example! This example goes over more of the collider types that can be used in Otter. In total Otter has a Box, Circle, Grid, Polygon, Pixel, Point, and Line collider, and this example will cover all of them except for the Pixel collider (because that one should be used very sparingly anyway.)

Here's a quick preview of the code that can be found in the example:
class PolygonTest : Entity {

PolygonCollider polygonCollider;

public PolygonTest(float x, float y) : base(x, y) {
// Create a PolygonCollider and give it some Vector2 points.
polygonCollider = new PolygonCollider(
new Vector2(0, 0),
new Vector2(80, -10),
new Vector2(30, 90),
new Vector2(-5, 15),
new Vector2(0, 5)
);

// Add the Walls tag (since this isn't in the constructor.)
polygonCollider.AddTag(Tags.Walls);

// Set the rotation to a random angle.
polygonCollider.Rotation = Rand.Angle;

// Add the Collider.
AddCollider(polygonCollider);
// Center the origin of the Collider.
polygonCollider.CenterOrigin();
}

public override void Render() {
base.Render();

// Render the Collider for debug purposes.
polygonCollider.Render();
}
}
The full example places a bunch of colliders in a scene with a moving object to test collisions with.

Image


A lot more examples are on the way!