Show Posts

This section allows you to view all posts made by this member. Note that you can only see posts made in areas you currently have access to.


Messages - cai

Pages: 1 ... 21 22 [23]
441
help / Re: Blank .swf file after compiling
« on: Sun, Jan 3, 2010 »
What are you using to compile it?  If you're using FlashDevelop, you'll need to right click on FlxTeroids.as and choose Always Compile.  Otherwise, it'll be compiling the default project file, which doesn't know about Flixel, unless you're using a Flixel template.  If that still doesn't help, try and post a bit more information if you can.
If you're using Flex Builder or something else, I'm afraid I don't really know what to do.

442
chat / Re: Newgrounds Contest
« on: Sat, Jan 2, 2010 »
I would think Games would be a more fitting section, since there are many works in progress there.

443
chat / Re: Newgrounds Contest
« on: Sat, Jan 2, 2010 »
if I made all the art assets and a design document for the game, where would you recommend I post some of it to team up with a programmer?
I think this forum would be a good place if you don't mind it being public.  Then you could get interest in it and move to a more private collaboration space to finish out the game.  Personally I would jump at the chance to collaborate on a project if the art and design are good.

444
It would be nice and very useful to add support for UNICODE chars.
Y'know, the thought about using anything other than standard latin characters hadn't really crossed my mind.  That would definitely be a good thing to have!

Quote
Maybe to restrict the lenght, only the chars used to the class (Array or String) are used.
I think it would be best to leave the loading out of the game code and leave it up to the rendering class.  I think it would be annoying to have to specify what kind of characters you want available when you could just load a specific character set and have it available, rather than load all character sets at once.

445
help / Re: FlashDevelop Debug...
« on: Fri, Jan 1, 2010 »
Aha!  Shows what I know.. I just thought that player was for the external player.

446
games / Re: Dog and Bone are friends [DEMO]
« on: Fri, Jan 1, 2010 »
Do you think mouse driven character switching would be an advantage to speed up game play, or would it encumber people?
I would think that introducing the mouse would hinder the playability for a game like this.  If you have one hand devoted to movement keys and the other for the mouse, you also have to find a decent way to interact with objects (such as Dog barking or Bone using the statues).  I would think having one hand devoted to the interaction keys and the other for movement keys would work better.

447
help / Re: FlashDevelop Debug...
« on: Fri, Jan 1, 2010 »
My guess is that it can't find the Flex debugger.  Go to the Tools menu, Program Settings, and choose AS3Context in the left panel.  In the right side, under Language, set Flex SDK Location to the base directory of Flex (C:\Program Files\Flex, for example).

448
@cai: Awesome work. See if you can get this included the the official Flixel sources!
Thanks!  I would, of course, be happy to see it become standard for Flixel, since any project would benefit from having bitmap font support.  However, until I think that's possible, there are a couple of things that need to be done:

Firstly, Adam would have to decide he likes it. ;)

Second, we would have to make a cut-off point for features. There are so many useful things that could go in, but it's already getting pretty bulky--the addition of keys, I think, is a necessity, but features like that definitely make the code less manageable.  Another idea I had was to have custom characters (ones defined in the font bitmap after the font) which could be used like a regular character (in a similar fashion to the way I did the keys).  That would, however, pose a problem of how one would use those custom characters in a string: I used \t for the keys since tab is not a valid character in one of the font files, but what could you use for custom characters?  Of course, this might just have been a terrible idea to begin with.. :)

We would also need someone to draw a default Flixel font (preferably with every character possible), since the ones I used were from Bitmap Font Writer, which prohibits their use in commercial products.  This wouldn't be too hard an undertaking, but every little bit counts!

And lastly, I think someone with fresh eyes and a penchant for optimization should take a look at the source and see if there are any ways to improve it.  I am not above admitting that this code is getting to the point of messy.  I think it performs quite well, but there are probably many points which could use some improvements.

Let me know what you guys think about any of this!

449
help / Re: Flashdevelop
« on: Thu, Dec 31, 2009 »
And then you might want to check out the Hello World tutorial for FlashDevelop which should help you to understand how to set up a Flixel project and compile it.

450
releases / Re: v1.51 pushed up
« on: Wed, Dec 30, 2009 »
Good call on using ASDoc, it will be most useful!

451
games / Re: Dog and Bone are friends [DEMO]
« on: Wed, Dec 30, 2009 »
I really liked this!  I'm looking forward to those "over 1 levels!" ;)

The only part which seemed not to work quite right were ladders: if you walk onto it, Bone should immediately start climbing.
Also, if you walk to the top of the ladder, you fall off.  Perhaps make it so you can only go so high on the ladder?
And if you're partway on the ladder and you hit the ground above, you have to move over to get Bone through.  This thread links to an article dealing with overcoming issues like that; I think the idea of rounding would work best here: if you hit it and continue to try and go up, it should move you to the left or right to make you go through.

I'm not sure if it's the fade time or if the levels take a while to load, but it seems to be a long time between each part.  I would think for a more complete version the tutorial should all be combined into one, in which case the wait between levels wouldn't be as much of a problem.

And the restart button at the end leads you to the starting screen rather than to the game again.

But none of my nitpicking should belittle the game, I really think it's quite cute and would be fun to play a full version.  I definitely look forward to seeing its completion!

452
help / Re: Bitmap Font [ Example inside ] 1.47 required
« on: Wed, Dec 30, 2009 »
Cool!  I guess I probably should have checked out how that program did it.  It seems like a pretty simple solution.

I've expanded a bit and made a fairly full-functioned renderer.  It can use a font sheet instead of just a strip, so big fonts shouldn't be a problem.  I used one of the fonts from Bitmap Font Writer in my testing:

Note: This font doesn't have the key image in it, so it won't work with the latest updates

It also has support for center and right alignment:


It is worth noting the way I did the alignment: the X and Y coordinates for left alignment are the top left of the rendered area, the top center for centered alignment, and the top right for right alignment.  That seemed to me the best way to get rid of the need to specify a width for the text like you need to for FlxText.  Here's the code used to generate the image above:
Code: [Select]
var t:FlxBitmapText;
t = new FlxBitmapText(80, 50, "This text is\nLeft aligned!", "left", imgFont, 22);
add(t);
t = new FlxBitmapText(240, 125, "This text is\nCenter aligned!");
t.loadFont(imgFont, 22); // You can change the font at any time
t.alignment = "Center"; // Alignments are case insensitive
add(t);
t = new FlxBitmapText(400, 200, "This text is\nRight aligned!", "right", imgFont, 22);
add(t);

Update: I added support for drawing an image on a key, which could be useful in explaining controls, like so:


To use keys, just put a tab before the letter or word you want to display on a key.  The key ends at the next space.
Code: [Select]
t = new FlxBitmapText(80, 50, "Press the \tX key to jump.\nPress \tC to shoot.\nPress \tTAB to do something else.");
This is the font I used.  The key image is broken into the first three characters: the left part of the key, the middle (which needs to be as wide as the widest character), and the right part of the key.


And last but not least, the beast that is FlxBitmapText.as:
Code: [Select]
package org.flixel
{
import flash.display.BitmapData;
import flash.geom.Point;
import flash.geom.Rectangle;

/**
* This is a text display class which uses bitmap fonts.
*/
public class FlxBitmapText extends FlxCore
{
[Embed(source = "data/font.png")] private var imgDefaultFont:Class;
/**
* The bitmap onto which the font is loaded
*/
protected var _fontPixels:BitmapData;
/**
* The bitmap onto which the text is rendered
*/
protected var _pixels:BitmapData;
/**
* The coordinates to which several things are copied
*/
protected var _p:Point;
/**
* The height of the font in pixels
*/
protected var _fontHeight:uint;
/**
* The bounding boxes of each character
*/
protected var _rects:Array;
/**
* The bounding box of the internal bitmap
*/
protected var _rect:Rectangle;
/**
* The text to render
*/
protected var _text:String;
/**
* The amount of space between characters
*/
protected var _horizontalPadding:uint;
/**
* The amount of space between lines
*/
protected var _verticalPadding:uint;
/**
* The text alignment
*/
protected var _alignment:String;


/**
* Creates a new <code>FlxBitmapText</code> object.
*
* @param X The X position of the text
* @param Y The Y position of the text
* @param Text The default text to display
* @param Alignment "Left", "Center", or "Right"
* @param Image The image to use for the font
* @param FontHeight The height of the font in pixels
* @param HorizontalPadding Padding between characters
* @param VerticalPadding Padding between lines
*/
public function FlxBitmapText(X:int, Y:int, Text:String=" ", Alignment:String="left", Image:Class=null, FontHeight:uint=9, HorizontalPadding:uint=1, VerticalPadding:uint=5)
{
if (Image == null) // No font specified
Image = imgDefaultFont; // Use the default
_text = Text;
_alignment = Alignment.toLowerCase();
super();
fixed = true;
x = X;
y = Y;
loadFont(Image, FontHeight, HorizontalPadding, VerticalPadding); // Set the font
}

/**
* Sets the font face to use.
*
* @param Image The font image to use
* @param FontHeight The height of the font
* @param HorizontalPadding Padding between characters
* @param VerticalPadding Padding between lines
*/
public function loadFont(Image:Class, FontHeight:uint, HorizontalPadding:uint=1, VerticalPadding:uint=5):void
{
_fontPixels = FlxG.addBitmap(Image);
_fontHeight = FontHeight;
_verticalPadding = VerticalPadding;
_horizontalPadding = HorizontalPadding;
_rects = new Array(); // Clear the rectangles array
var _delimiter:uint = _fontPixels.getPixel(0, 0); // The pixel which marks the end of a character
var yOffset:uint = 1; // Skip the first line since it just marks the delimiters
var xOffset:uint = 0;
var charCode:uint = 28; // A few ASCII codes before space
for (var y:uint = 0; y < Math.floor(_fontPixels.height / _fontHeight); y++)
{ // Each line in the font bitmap
for (var x:uint = 0; x < _fontPixels.width; x++)
{ // Each pixel in on the X axis
if (_fontPixels.getPixel(x, yOffset - 1) == _delimiter)
{ // Is this the end of a character?
_rects[charCode] = new Rectangle(xOffset, yOffset, x - xOffset, _fontHeight); // The bounding box of the character
charCode++;
xOffset = x + 1; // Set the offset to the start of the next character
}
}
yOffset += _fontHeight + 1;
xOffset = 0;
}
if (!_rects[97])
{ // There are no lower case letters
_rects[97] = _rects[65]; // Fill the array in case a few characters aren't present
_rects = _rects.concat(_rects.slice(66, 90)); // Copy the upper case letters in the lower case ones' place
}
calcFrame(); // Update the bitmap
}

/**
* Updates the internal bitmap.
*/
public function calcFrame():void
{
width = 0;
height = 0;
var isKey:Boolean = false;
var i:uint;
var c:uint;
var _lines:Array = _text.split("\n"); // An array of each line to render
var _lineWidths:Array = new Array(); // An array of the widths of each line
// We need to get the size of the bitmap, so we'll examine the text character-by-character
for (i = 0; i < _lines.length; i++)
{ // Loop through each line
_lineWidths[i] = 0;
for (c = 0; c < _lines[i].length; c++)
{ // Each character in the line
if (_lines[i].charAt(c) == "\t")
{ // A tab marks the beginning of the key
isKey = true;
_lineWidths[i] += _rects[29].width;
}
if (_rects[_lines[i].charCodeAt(c)])
{ // Does the character exist in the font?
if ((_lines[i].charAt(c) == " ") && isKey)
{ // Space marks the end of the key
isKey = false;
_lineWidths[i] += _rects[31].width;
}
else
_lineWidths[i] += _rects[_lines[i].charCodeAt(c)].width + _horizontalPadding; // Add its width to the line width
}
}
if (_lineWidths[i] > width) // Find out which line is the widest
width = _lineWidths[i]; // Use that line as the bitmap's width
height += _fontHeight + _verticalPadding; // Set the height to the font height times the number of lines
}
if (width == 0) // If there's nothing to render
width = 1; // Just render a 1px wide bitmap
_pixels = new BitmapData(width, height, true, 0x00000000); // Create a transparent bitmap
var xOffset:uint;
var yOffset:uint = 0;
// Now we can start drawing on the bitmap
for (i = 0; i < _lines.length; i++)
{ // Loop through each line
switch(_alignment)
{
case 'left':
xOffset = 0;
break;
case 'center':
xOffset = (width - _lineWidths[i]) / 2;
break;
case 'right':
xOffset = width - _lineWidths[i];
break;
}
for (c = 0; c < _lines[i].length; c++)
{ // Each character in the line
if ((_lines[i].charAt(c) == " ") && isKey)
{ // The key graphic should no longer be displayed
isKey = false;
_p = new Point(xOffset - 1, yOffset);
_pixels.copyPixels(_fontPixels, _rects[31], _p, null, null, true); // Draw the right part of the key
xOffset += _rects[31].width;
}
if (_rects[_lines[i].charCodeAt(c)])
{ // Make sure the character is in the font
if (isKey)
{ // Is this letter on a key?
_p = new Point(xOffset, yOffset);
_rect = _rects[30];
_rect.width = _rects[_lines[i].charCodeAt(c)].width + _horizontalPadding; // Only draw as much as is needed
_pixels.copyPixels(_fontPixels, _rect, _p, null, null, true); // Draw the key background
}
_p = new Point(xOffset, yOffset);
_pixels.copyPixels(_fontPixels, _rects[_lines[i].charCodeAt(c)], _p, null, null, true); // Copy it to the bitmap
xOffset += _rects[_lines[i].charCodeAt(c)].width + _horizontalPadding; // Add the width of the character
}
if (_lines[i].charAt(c) == "\t")
{ // If the key is a tab...
isKey = true; // ...set the next word to be on a key image
_p = new Point(xOffset, yOffset);
_pixels.copyPixels(_fontPixels, _rects[29], _p, null, null, true); // Draw the left part of the key
xOffset += _rects[29].width;
}
}
yOffset += _fontHeight + _verticalPadding;
}
switch(_alignment)
{ // Adjust the render point based on alignment
case 'center':
x -= Math.floor(width / 2);
break;
case 'right':
x -= width;
break;
}
_rect = new Rectangle(0, 0, width, height); // Used when rendering
}

/**
* Draws the text to the screen.
*/
override public function render():void
{
super.render();
getScreenXY(_p);
FlxG.buffer.copyPixels(_pixels,_rect,_p,null,null,true);
}

/**
* Changes the text being displayed.
*
* @param Text The new string you want to display
*/
public function set text(Text:String):void
{
_text = Text;
calcFrame(); // Update the bitmap
}

/**
* Getter to retrieve the text being displayed.
*
* @return The text string being displayed.
*/
public function get text():String
{
return _text;
}

/**
* Sets the alignment of the text being displayed
*
* @param A string indicating the desired alignment - acceptable values are "left", "right" and "center"
*/
public function set alignment(Alignment:String):void
{
_alignment = Alignment.toLowerCase();
calcFrame(); // Update the bitmap
}

/**
* Gets the alignment of the text being displayed
*
* @return A string indicating the current alignment.
*/
public function get alignment():String
{
return _alignment;
}
}
}

And, of course, any changes or improvements are welcome!

Edit: I added support for drawing on keys
Edit #2: Switched the comments from nanodoc to asdoc for easier integration

453
help / Re: Bitmap Font [ Example inside ] 1.47 required
« on: Sun, Dec 27, 2009 »
it wouldn't be eaiser to create the custom font externally and then import it as a regular font?
FlxText only uses TrueType fonts, which are vector based.  These are single-color and untextured but infinitely scalable.  So you win some, you lose some.

I just implemented a loader for the fonts coming with the "Bitmap Font Writer" app.
If you have a way of using non-fixed-width fonts, I'd love to see it.  The only way I can think is to have an array of widths, one for each character.  However, it seems like it would be a pain to put that in code, and loading a font from both an image and a text file seems a bit much to me as well.

I wrote a working bitmap text class which I've called FlxBitmapText; I modeled it a bit after FlxText, so hopefully it fits in easily with most Flixel projects.

Code: [Select]
var bitmapText:FlxBitmapText;
bitmapText = new FlxBitmapText(100, 100, "testing FlxBitmapText! Does it work?\nSo it does!");
add(bitmapText);
magically turns into...


Below is the code of my FlxBitmapText.  It uses pixel copying and a cached texture (which is only updated when it needs to be), so it should be pretty speedy.  It also supports new lines!
Right now it is limited in that it does not support lower case letters (this is very simple to fix, but I'm putting it off until after getting rid of the fixed-width requirement), and it requires a sprite strip rather than a sheet (for the same reasons).  I would appreciate any input on how to overcome this in a decent manner.
Code: [Select]
// This code was old, so I deleted it.  For better stuff, refer to the posts below!
And the default font, org/flixel/data/font.png, is a modified version of the one darthlupi posted:


Feel free to use, fix, or destroy any of this code.  Hopefully it can help someone.

Edit: fixed a couple of bugs, added some setter functions for changing the font on-the-fly
Edit numero dos: removed old code

454
chat / Re: Name Some Good Platformers
« on: Thu, Dec 24, 2009 »
I really liked the original Commander Keen and Duke Nukem platformers.
Agreed!  Any of the old Apogee games were fantastic.  I think my favorite was Secret Agent.

Metroid encompases a lot of the things I love about side-scrolling platformers. The seriously epic environments, upgrades, enemies and bosses...
Metroid is definitely one of the best examples of a good platformer.  My favorite would be between Super Metroid and Zero Mission; it seems that they really knew what they were doing by the time Super Metroid rolled out and really perfected the system for the GameBoy Advance games.
The strongest point in Metroid games is the many items you can acquire: a gun to freeze your enemies, a gun that shoots through walls, a suit that can withstand lava, a suit that can defy gravity.  Tie it in with a gripping story and you've got yourself a game.

Along with Metroid comes Castlevania.  It's pretty much the same system: get new items, unlock new places, kill bad guys.  Only, do it in the middle ages instead of space.
Like with Metroid, I think the GBA Castlevanias are extremely polished and refined.  My favorite would go to Circle of the Moon.

Quote
It sort of seems like the 'big' developers aren't making these types of side-scrolling platformers anymore.
Thankfully Epic Games decided that 2D platformers should still be around, even if they presented it in a 3D manner; Shadow Complex is certainly a successor to the likes of Castlevania and Metroid.  You are confined to a 2-dimensional plane even though you exist in a 3-dimensional world.

A while ago I came across this article, entitled What made those old, 2D platformers so great?  I largely agree with the points made there on what makes a good 2D platformer, and the points there are evident in most of the games in this thread.

455
help / Re: Basic Game Tutorial
« on: Sun, Nov 29, 2009 »
Hmm, perhaps I'm missing something here but I cannot seem to find the fabled Preloader.as.

It's been mentioned it "comes with Flixel". Anyone care to clarify?
It seems that it is not included with Flixel on github, probably since the preloader is really part of the game, not necessarily flixel.  That said, it is available with the sample games.  Here is the Preloader.as from FlxTeroids.

456
chat / Re: Flixel Neighbors
« on: Mon, Nov 2, 2009 »
I don't think anyone's anywhere near me since Missouri is like a 0.01 on the excite-o-meter. :P
Well, I'm from Springfield, MO, which isn't too far and rates even lower than STL on the excite-o-meter.

457
I've written a similar tutorial for the new github version of Flixel/Mode, available on Mode's github wiki:
http://wiki.github.com/AdamAtomic/Mode/running-mode-in-flashdevelop

Hopefully it will help those who are using the newer version, as some there are some key differences to directory structure.

Pages: 1 ... 21 22 [23]