How to draw a dynamic Grid with XNA

Question

I'm trying to draw grid using the XNA framework, this grid should have a fixed dimension, during the execution of XNA, but should be given to the user the opportunity to customize it before launch the game page (I'm building my app with the silverlight/xna template).

Does anyone has a suggestion on how achieve this goal?

Thank you

Answer 1

    ContentManager contentManager;
    GameTimer timer;
    SpriteBatch spriteBatch;
    LifeGrid life;


    int tileSize = 32;
    Vector2 position = Vector2.Zero;
    Texture2D gridTexture;
    int[,] map;

    public GamePage()
    {
        InitializeComponent();

        // Get the content manager from the application
        contentManager = (Application.Current as App).Content;

        // Create a timer for this page
        timer = new GameTimer();
        //timer.UpdateInterval = TimeSpan.FromTicks(333333);
        timer.UpdateInterval = TimeSpan.Zero;
        timer.Update += OnUpdate;
        timer.Draw += OnDraw;
        List<Position> p = new List<Position>();
        p.Add(new Position(1,1));
        p.Add(new Position(1,4));
        p.Add(new Position(1,5));
        p.Add(new Position(1,6));
        p.Add(new Position(1,7));
        this.life = new LifeGrid(10, 10, p);


        map = new int[,]{{1, 1, 0,},{0, 1, 1,},{1, 1, 0,},};

        // LayoutUpdated += new EventHandler(GamePage_LayoutUpdated);
    }
    /// <summary>
    /// Allows the page to draw itself.
    /// </summary>
    private void OnDraw(object sender, GameTimerEventArgs e)
    {
        // SharedGraphicsDeviceManager.Current.GraphicsDevice.Clear(Color.CornflowerBlue);
       // SharedGraphicsDeviceManager.Current.GraphicsDevice.Clear(Color.Black);
        // Draw the sprite
        spriteBatch.Begin();

        for (int i = 0; i <= map.GetUpperBound(0); i++)
        {
            for (int j = 0; j <= map.GetUpperBound(1); j++)
            {
                int textureId = map[i, j];
                if (textureId != 0)
                {
                    Vector2 texturePosition = new Vector2(i * tileSize, j * tileSize) + position;

                    //Here you would typically index to a Texture based on the textureId.
                    spriteBatch.Draw(gridTexture, texturePosition, null, Color.White, 0, Vector2.Zero, 1.0f, SpriteEffects.None, 0f);

                }
            }
        }


        spriteBatch.End();
    }

Answer 2

Set a tileSize, and then draw a texture over the size of grid you want.

Here is some reworked code. This is how I would start with generating a tilemap, by using a 2d array.

int tileSize = 32;
Vector2 position = Vector2.Zero;
Texture2D gridTexture;

int[,] map = new int[,]
{
    {1, 1, 0,},
    {0, 1, 1,},
    {1, 1, 0,},
};

Then add something like this to your draw function:

for (int i = 0; i <= map.GetUpperBound(0); i++)
{
    for (int j = 0; j <= map.GetUpperBound(1); j++)
    {
        int textureId = map[i, j];
        if (textureId != 0)
        {
            Vector2 texturePosition = new Vector2(i * tileSize, j * tileSize) + position;

            //Here you would typically index to a Texture based on the textureId.
            spriteBatch.Draw(gridTexture, texturePosition, null, Color.White, 0, Vector2.Zero, 1.0f, SpriteEffects.None, 0f);             
        }
    }
}