Take the 2-minute tour ×
Game Development Stack Exchange is a question and answer site for professional and independent game developers. It's 100% free, no registration required.

let's say I have a fixed size grid puzzle game (8 x 10). I will be using sprites animation, when the "pieces" in the puzzle is moving from one grid to another grid.

I was wondering, what is the technique to have this game being implemented as screen resolution independent. Here is what I plan to do.

1) The data structure coordinate will be represented using double, with 1.0 as max value.

// Puzzle grid of 8 x 10
Environment {
    double width = 0.8;
    double height = 1.0;

// Location of Sprite at coordinate (1, 1)
Sprite {
    double posX = 0.1;
    double posY = 0.1;
    double width = 0.1;
    double height = 0.1;

drawBitmap (    
    new Rect(sprite.posX * Scale, sprite.posY * Scale, (sprite.posX + sprite.width) * Scale, (sprite.posY + sprite.Height) * Scale),

2) A large size sprite image will be used (128x128). As sprite image shall look fine if we scale from large size down to small size, but not vice versa.

Besides the above mentioned technique, is there any other consideration I had missed out?

share|improve this question
add comment

3 Answers 3

up vote 2 down vote accepted

Personally I wouldn't use double to store sprite coordinates. Since you have a fixed grid, why not simply use grid coordinates? Double would probably work, but is more complicated and you'll suddenly end up with rounding errors or equality check problems.

Using grid coordinates, your sprite would be located at: posX = 1 and posY = 1. You can then calculate the actual screen coordinates by multiplying with the grid-cell size. Animation is a special case, but I guess you'll move the sprites from one grid-position to another one, so you can calculate the initial position in pixels (screen space) and the target position (also in screen space) and animate from one position to the other.

128x128 is probably a bit large for a sprite.. I guess 64x64 is still sufficient. But it really depends on how big you want to scale these sprites. 64x64 will result in a 640x512 grid.

share|improve this answer
add comment

How many different sprites are we talking about? Is it possible to draw the sprites with vector graphics? If you search some you can probably find a way to draw svg (scalable vector graphics) with a canvas directly.

Or, if you are ambitios, you can draw them yourself. Even if it is lots of work, it have its advantages. For instance, it is easy to change various colors of the drawing to account for selected/disabled/locked/etc status.

share|improve this answer
add comment

To solve this problem in a game I'm working on I adopted the Model View ViewModel design. I had the following architecture:

class BoardModel {
    int Columns = 4;
    int Rows = 4;
    SquareModel[] squares;

class SquareModel {
    int Column;
    int Row;

class SquareViewModel {
    float X;
    float Y;
    float Width;
    float Height;
    SquareModel model;

class SquareView {
    Texture texture;
    Draw(SquareViewModel square);

Notice that the SquareModel isn't aware of its position on the screen or its dimensions. When switching resolutions or platforms it is sufficient to change the dimensions in the SquareViewModel and the texture used by the SquareView.

share|improve this answer
add comment

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.