7 Replies - 1116 Views - Last Post: 25 August 2012 - 02:07 PM Rate Topic: -----

#1 maximo3510  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 25
  • Joined: 19-July 12

Scrolling background in windows form

Posted 21 August 2012 - 06:58 AM

Hello,

I would like to create some turn based game in windows form.
My question is if there is possibility to make scrolling background in windows form or I should use XNA instead of windows form?

I would like to have similar GUI to this:
Posted Image

Top and bottom is not movable. And the middle table where cards are played should be scrolled up and down with the help of button which is on the right side in the middle. And left/right scrolling should be done via keys left/right or mouse click in the table and then movement.

I now it is possible in XNA via some tile engine and camera object for moving map but I wonder if this is also possible to achieve in windows form?

If it is possible than how should I aproach it? Can you give me some hints how I should start?

Is This A Good Question/Topic? 0
  • +

Replies To: Scrolling background in windows form

#2 Skydiver  Icon User is online

  • Code herder
  • member icon

Reputation: 1942
  • View blog
  • Posts: 5,780
  • Joined: 05-May 12

Re: Scrolling background in windows form

Posted 21 August 2012 - 09:21 AM

Yes, it is doable with the WinForms Panel control. Set the horizontal and vertical scrollbar positions. With WPF, use the ScrollViewer control with a child Panel, and then set the horizontal and vertical offsets.
Was This Post Helpful? 0
  • +
  • -

#3 maximo3510  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 25
  • Joined: 19-July 12

Re: Scrolling background in windows form

Posted 21 August 2012 - 04:02 PM

Skydiver thanks for the tip.

I managed to do my first version. I spent one hour to make it scroll via mouse wheel.
I thought it should work automatically after panel gets focus but it didn't work.

So I made it via this:
 public Form1()
        {
            InitializeComponent();
            this.MinimumSize = new Size(1024, 768);

            // scrollbars for panelGameTable moved via mouse wheel
            this.MouseWheel += new MouseEventHandler(panelGameTable_MouseWheel);
        }

        // scrollbars for panelGameTable moved via mouse wheel
        private void panelGameTable_MouseWheel(object sender, MouseEventArgs e)
        {
            panelGameTable.Focus();
        }


Now it looks like this when I fire my soft:

Posted Image

but I would like to set start position like that:

Posted Image

I was searching for solution but could not find any working one.

How it is possible to force starting display position to some specific coordinates on panel?

It is not so big deal as I can always manually scroll to center position but in future I would like to map some keyboard keys to automatically switch view between north and south kingdom on my table.
Was This Post Helpful? 0
  • +
  • -

#4 Skydiver  Icon User is online

  • Code herder
  • member icon

Reputation: 1942
  • View blog
  • Posts: 5,780
  • Joined: 05-May 12

Re: Scrolling background in windows form

Posted 21 August 2012 - 04:22 PM

Have you tried setting the scrollbar positions. e.g. panelGameTable.HorizontalScroll.Value ?
Was This Post Helpful? 0
  • +
  • -

#5 maximo3510  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 25
  • Joined: 19-July 12

Re: Scrolling background in windows form

Posted 21 August 2012 - 05:09 PM

Yes I tried it.
Below are the results when I set it to value equal 100

Posted Image

Posted Image

It only moves my tableLayoutPanel1 which is located inside panelGameTable.

When I tried to set value bigger than 100 I received:

Posted Image

I searched and found this:
ScrollBar.Maximum Property

So tomorrow I will try to figure it out as I am too tired now.
Thanks for all the help.
Was This Post Helpful? 0
  • +
  • -

#6 maximo3510  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 25
  • Joined: 19-July 12

Re: Scrolling background in windows form

Posted 22 August 2012 - 12:32 PM

After today's "coding" :) I redesigned my software a little. I resigned from tablepanel control and instead of it I put second panel control inside the first one. First panel (panelMainTable) is set to size 1010,468 and has AutoScroll set to true. Second panel (panelGameTable) has size 2176,1792 and AutoScroll set to false. That way when I put some PictureBox on panelGameTable which is outside the size of panelMainTable it automatically has scrolling bars visible and "ready" to use.

I purposely wrote "ready to use" because they are not ready they don't move at all when I try to scroll them with mouse wheel. So I decided to fix it and wrote this code:

public Form1()
        {
            InitializeComponent();
            this.MinimumSize = new Size(1024, 768);
            this.MaximumSize = new Size(1024, 768);

            // scrollbars for panelGameTable moved via mouse wheel
            this.MouseWheel += new MouseEventHandler(panelGameTable_MouseWheel);
        }

        // scrollbars for panelGameTable moved via mouse wheel
        private void panelGameTable_MouseWheel(object sender, MouseEventArgs e)
        {
            panelGameTable.Focus();
        }

After this scrolling works like a charm.

Next I decided to try to implement scrolling via keyboard arrow keys.
First I used this method:

 // Method for scrolling panelGameTable with arrow keys
        public void Form1_KeyDown(object sender, KeyEventArgs e)
        {
            int panelGTPositionX = panelMainTable.AutoScrollPosition.X;
            int panelGTPositionY = panelMainTable.AutoScrollPosition.Y;

            switch (e.KeyData)
            {
                 //First approach with AutoScrollPosition property
                case Keys.Up:
                    panelMainTable.AutoScrollPosition = new Point(panelGTPositionX += 0, panelGTPositionY -= 200);
                    this.Refresh();
                    toolStripStatusLabel1.Text = "X: " + panelMainTable.HorizontalScroll.Value.ToString() + " Y: " + panelMainTable.VerticalScroll.Value.ToString();
                    break;
                case Keys.Down:
                    panelMainTable.AutoScrollPosition = new Point(panelGTPositionX += 0, panelGTPositionY += 200);
                    this.Refresh();
                    toolStripStatusLabel1.Text = "X: " + panelMainTable.HorizontalScroll.Value.ToString() + " Y: " + panelMainTable.VerticalScroll.Value.ToString();
                    break;
                case Keys.Left:
                    panelMainTable.AutoScrollPosition = new Point(panelGTPositionX -= 200, panelGTPositionY += 0);
                    this.Refresh();
                    toolStripStatusLabel1.Text = "X: " + panelMainTable.HorizontalScroll.Value.ToString() + " Y: " + panelMainTable.VerticalScroll.Value.ToString();
                    break;
                case Keys.Right:
                    panelMainTable.AutoScrollPosition = new Point(panelGTPositionX += 200, panelGTPositionY += 0);
                    this.Refresh();
                    toolStripStatusLabel1.Text = "X: " + panelMainTable.HorizontalScroll.Value.ToString() + " Y: " + panelMainTable.VerticalScroll.Value.ToString();
                    break;
    }
}


but it was only moving 200 pixels down when I pressed down arrow and when I pressed down arrow again vertical scrollbar was moving back to it's starting position 200 pixels up. The same was with other arrow keys one step in "good" direction and second step backwards. I completlt don't know why this is happening so I figured that I can make it another way.
So I decided to reimplement my method and now it was like that:

public void Form1_KeyDown(object sender, KeyEventArgs e)
        {
            int panelGTPositionX = panelMainTable.AutoScrollPosition.X;
            int panelGTPositionY = panelMainTable.AutoScrollPosition.Y;

            switch (e.KeyData)
            {
// Second approach with Vertical and HorizontalScrollPosition property
                case Keys.Up:
                    // I know this is silly but I don't know how to setup Try/Catch yet
                    if (panelMainTable.VerticalScroll.Value <= 100)
                    {
                        panelMainTable.VerticalScroll.Value = 100;
                    }
                    panelMainTable.VerticalScroll.Value -= 20;
                    toolStripStatusLabel1.Text = "X: " + panelMainTable.HorizontalScroll.Value.ToString() + " Y: " + panelMainTable.VerticalScroll.Value.ToString();
                    break;
                case Keys.Down:
                    panelMainTable.VerticalScroll.Value += 20;
                    toolStripStatusLabel1.Text = "X: " + panelMainTable.HorizontalScroll.Value.ToString() + " Y: " + panelMainTable.VerticalScroll.Value.ToString();
                    break;
                case Keys.Left:
                    // I know this is silly but I don't know how to setup Try/Catch yet
                    if (panelMainTable.HorizontalScroll.Value <= 100)
                    {
                        panelMainTable.HorizontalScroll.Value = 100;
                    }
                    panelMainTable.HorizontalScroll.Value -= 20;
                    toolStripStatusLabel1.Text = "X: " + panelMainTable.HorizontalScroll.Value.ToString() + " Y: " + panelMainTable.VerticalScroll.Value.ToString();
                    break;
                case Keys.Right:
                    panelMainTable.HorizontalScroll.Value += 20;
                    toolStripStatusLabel1.Text = "X: " + panelMainTable.HorizontalScroll.Value.ToString() + " Y: " + panelMainTable.VerticalScroll.Value.ToString();
                    break;


                // NorthKingdom and SouthKingdom center position
                case Keys.F1:
                    panelMainTable.AutoScrollPosition = new Point(panelGTPositionX = 600, panelGTPositionY = 225);
                    this.Refresh();
                    toolStripStatusLabel1.Text = "X: " + panelMainTable.HorizontalScroll.Value.ToString() + " Y: " + panelMainTable.VerticalScroll.Value.ToString();
                    break;
                case Keys.F2:
                    panelMainTable.AutoScrollPosition = new Point(panelGTPositionX = 600, panelGTPositionY = 1125);
                    this.Refresh();
                    toolStripStatusLabel1.Text = "X: " + panelMainTable.HorizontalScroll.Value.ToString() + " Y: " + panelMainTable.VerticalScroll.Value.ToString();
                    break;
            }
        }


And to my surprise scrollbars were not moving. After some time I found that setting Form1 property "KeyPreview" to True value makes my deal and finally scrollbars are moving.

This time it works better. When I pressed down arrow key scrollbar went 20 pixels (or percents?) down. Then after second press of down arrow key it stayed in position and after third pressing it moved again next 20 pixels down. When I press arrow key and hold it pressed it moves smoothly but when I press in cycles it works like I described above.

Also I could not figure out how I can setup catch/try to deal with this OutOfRange Exception when Scroll value goes below 0 so I put silly if statement that is preventing this exception. It looks like this value is in percent range from 0-100.

After this I wanted to setup additional F1 and F2 keys for centering my view on North and South part of my board.
This part of code works ok, switching between views like I wanted.

I was partially happy with my achievements so far but then I turned my mouse wheel down to check scrolling again and then my disappointment came. Suddenly arrow keys stopped working after using my mouse wheel. They were behaving exactly the same like in my first try with AutoScroll - 20 pixels down 20 pixels up :(
So in the end I tried to check F1 and F2 keys and they were also affected. View is not coming smoothly from North to South anymore it has additional step which puts panel to 0,0 coordinates.

So to sum things up because this time it was long writing.

How I should solve this scrolling issues? Where I am making mistakes?
Also I still cannot figure out how to set initial view to be centered in stead of starting with 0,0 coordinates of panel control. Sorry if all this sounds and looks silly but I am fresh beginner in C# and programming.
Was This Post Helpful? 0
  • +
  • -

#7 maximo3510  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 25
  • Joined: 19-July 12

Re: Scrolling background in windows form

Posted 25 August 2012 - 01:15 PM

Sorry for bumping this thread up but can some one point me what I am doing wrong with this scrolling?
Was This Post Helpful? 0
  • +
  • -

#8 Skydiver  Icon User is online

  • Code herder
  • member icon

Reputation: 1942
  • View blog
  • Posts: 5,780
  • Joined: 05-May 12

Re: Scrolling background in windows form

Posted 25 August 2012 - 02:07 PM

That is the downside of handling the KeyPreview event. You have to know exactly what you are doing in terms of letting the messages get routed to the other controls or not.

Are you setting Handled to true or false, or does it depend on which control already has focus?
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1