none
World canvas or?

    Question

  • Im starting to work on a simple multiplayer game, and my question is, how do you make the "game world"?

    I thought of just making a "world canvas" that is really big, and then just moving the view canvas around within the canvas. This gives me the option to calculate the world position of other players and elements in the game world. (See the attached illustration)

    Is this the way to do it or is there a better way? Some ideas and sample code would be great.


    /Henrik

    Saturday, October 17, 2009 9:52 AM

Answers

  • Hi,

    I don't know of an alternative, so it is a good idea, yes.

    You do not need to specify the geometry of the canvas. You only need to specify the geometry to aid your display in Visual Studio, or when you want to use your canvas in a StackPanel. If your large canvas is bigger than your display screen, you can use this canvas for a camera function, in which you scroll your world. So if you want this functionality, it is a good idea. And you can zoom your canvas using a ScaleTransform in the Canvas.RenderTransform property.

    My advise is to seperate display and data. So give your UserControl a public property Point Position {get;set;} in which you handle position changes. I prefer this over using Canvas.Left and Canvas.Top from the outside. 

    Saturday, October 17, 2009 10:25 AM
  • The simplest way to move something is to do:

     
    Canvas.SetLeft(player1, player1Position.X);
    Canvas.SetTop(player1, player1Position.Y);
    

     where player1 is the UserControl for your player, and player1Position is a Point represeting their position.

    It is probably (slightly) more efficient to adjust a TranslateTransform for the UserControl though, which would be something like:

      

    public class MyPlayerControl : UserControl
    {
        TranslateTransform translate;
    
        public MyPlayerControl()
        {
            this.translate = new TranslateTransform();
            this.RenderTransform = this.translate;
        }
    
        public void SetPosition(Point position)
        {
            this.translate.X = position.X;
            this.translate.Y = position.Y;
        }
    }

    In my experience, creating a Canvas that is larger than 10,000 x 10,000 pixels can cause Silverlight's rendering engine to become unstable.  It might draw things very slowly or not at all.  Maybe some other people have had a better experience with large elements.

     If your game world needs to be 50,000+ pixels wide, just keep the player positions as data.  Since your Canvas is only going to be a solid black color, you don't have to worry about scrolling the background, only showing/hiding the player controls when they are inside of the current view.

    Sunday, October 18, 2009 11:52 AM

All replies

  • Hi,

    I don't know of an alternative, so it is a good idea, yes.

    You do not need to specify the geometry of the canvas. You only need to specify the geometry to aid your display in Visual Studio, or when you want to use your canvas in a StackPanel. If your large canvas is bigger than your display screen, you can use this canvas for a camera function, in which you scroll your world. So if you want this functionality, it is a good idea. And you can zoom your canvas using a ScaleTransform in the Canvas.RenderTransform property.

    My advise is to seperate display and data. So give your UserControl a public property Point Position {get;set;} in which you handle position changes. I prefer this over using Canvas.Left and Canvas.Top from the outside. 

    Saturday, October 17, 2009 10:25 AM
  • I have found that to work quite well. Although if you are using a tiling system you might be better off just tiling the view port area, rather than waste the computing time on something unseen.
    Saturday, October 17, 2009 10:52 AM
  • I'm working on a Silverlight game engine that uses this technique and it seems to work pretty well for most cases.  I'll be releasing it as open source soon  though it is still a very early version, and probably not stable enough to consider using just yet.

    Saturday, October 17, 2009 1:43 PM
  • That sounds good. So im able to move my UserControl around the world canvas using a Point Position on the world canvas? Anyone have a small sample code? Im not going to use tiles, because the background will just be black.

    When i only draw elements in my view area, i guess there will not be a big performance difference, if my world canvas is 50.000 x 50.000 or 500.000 x 500.000?

    Saturday, October 17, 2009 4:22 PM
  • The simplest way to move something is to do:

     
    Canvas.SetLeft(player1, player1Position.X);
    Canvas.SetTop(player1, player1Position.Y);
    

     where player1 is the UserControl for your player, and player1Position is a Point represeting their position.

    It is probably (slightly) more efficient to adjust a TranslateTransform for the UserControl though, which would be something like:

      

    public class MyPlayerControl : UserControl
    {
        TranslateTransform translate;
    
        public MyPlayerControl()
        {
            this.translate = new TranslateTransform();
            this.RenderTransform = this.translate;
        }
    
        public void SetPosition(Point position)
        {
            this.translate.X = position.X;
            this.translate.Y = position.Y;
        }
    }

    In my experience, creating a Canvas that is larger than 10,000 x 10,000 pixels can cause Silverlight's rendering engine to become unstable.  It might draw things very slowly or not at all.  Maybe some other people have had a better experience with large elements.

     If your game world needs to be 50,000+ pixels wide, just keep the player positions as data.  Since your Canvas is only going to be a solid black color, you don't have to worry about scrolling the background, only showing/hiding the player controls when they are inside of the current view.

    Sunday, October 18, 2009 11:52 AM
  • Here's a sample about rendering a huge world Fishies (try to reach shallow blue waters)

    World contains 50,000 polygon points and world scale is about (-600, -2500) - (900, 120). World scale doesn't need to be that big if you use double or float values. I have 5 different canvases currently in use. Maincanvas with translate- and scaletransforms and backgroundlayer, players and the cave are all in separate layers.

    Monday, October 19, 2009 5:02 AM