Hi,

can anyone help me on this. I'have put pictureBox in panel, with image loaded into pictureBox. When scrolling, I want to load another pictureBox on certain position within panel, that will be displayed along original pictureBox. I'm having trouble with this.

Dani AI

Generated

As is trying to add PictureBoxes into a Panel while dragging/scrolling, three things usually go wrong: mouse coordinates are in the wrong coordinate space, controls get created on every MouseMove (flooding the UI), and images are loaded in a way that locks files or leaks memory. ’s high-level advice to tile and load asynchronously is the right direction — below are concrete, safe steps you can apply now.

Convert event coordinates to panel (scrollable) coordinates before placing a new PictureBox:

Point screenPt = pictureBox1.PointToScreen(e.Location);
Point panelClient = panel1.PointToClient(screenPt);

// If panel1.AutoScroll == true, convert to the panel's virtual coords:
Point tileLocation = new Point(
    panelClient.X - panel1.AutoScrollPosition.X,
    panelClient.Y - panel1.AutoScrollPosition.Y);

Load images off the UI thread, marshal only the UI update back, and avoid file locks by cloning the image:

private Bitmap LoadBitmapNoLock(string path)
{
    using (var tmp = Image.FromFile(path))
        return new Bitmap(tmp);
}

Task.Run(() =>
{
    var bmp = LoadBitmapNoLock(path);
    panel1.BeginInvoke((Action)(() =>
    {
        if (!tiles.ContainsKey(tileIndex))
        {
            var pb = new PictureBox { Image = bmp, Location = tileLocation, SizeMode = PictureBoxSizeMode.AutoSize };
            panel1.Controls.Add(pb);
            tiles[tileIndex] = pb;
        }
        else
        {
            bmp.Dispose(); // tile already present
        }
    }));
});

Practical tips and checklist:

  • Don’t create controls every MouseMove. Throttle (debounce) or respond to scroll/drag-end events.
  • Keep a map of active tiles (Dictionary/HashSet) to avoid duplicates and to recycle/remove off-screen tiles.
  • Dispose replaced Image objects to prevent leaks.
  • For best performance, draw tiles in one double-buffered control instead of many PictureBoxes. Example panel subclass for flicker-free painting:
public class BufferedPanel : Panel
{
    public BufferedPanel()
    {
        SetStyle(ControlStyles.AllPaintingInWmPaint | ControlStyles.UserPaint | ControlStyles.OptimizedDoubleBuffer, true);
        UpdateStyles();
    }
}

Finally, check the Y_k threshold logic (7404800 looks suspicious) and make sure you only trigger tile creation when a new tile index becomes visible. Following these patterns will solve the placement problems and keep the UI responsive.

Recommended Answers

All 10 Replies

please post your code.

private void pictureBox1_MouseDown(object sender, MouseEventArgs e)
      {
          if (e.Button == MouseButtons.Left)
          {
              X = e.X;
              Y = e.Y;
          }
      }

      private void pictureBox1_MouseMove(object sender, MouseEventArgs e)
      {
          if (e.Button == MouseButtons.Left)
          {
              pictureBox1.Left += (e.X - X);
              pictureBox1.Top += (e.Y - Y);
              txtX.Text = "e.X: " + e.X + ",X: " + X_k.ToString();
              txtY.Text = "e.Y: " + e.Y + ",Y: " + Y_k.ToString();
              
              if (Y_k>=7404800)
              {
                  PictureBox pictureBox3 = new PictureBox();
                  pictureBox3.Image = new Bitmap("\\Program Files\\Karta\\maps\\Nikinci_0_0000_0001.GIF");
                  pictureBox3.Location = new Point(e.X,e.Y);
                  pictureBox3.Size = new Size(pictureBox3.Image.Width, pictureBox3.Image.Height);
                  panel1.Controls.Add(pictureBox3);
                  //pictureBox3.MouseDown+=new MouseEventHandler(pictureBox3_MouseDown);
                  //pictureBox3.MouseMove+=new MouseEventHandler(pictureBox3_MouseMove);
                  pictureBox3.Show();
                                }
          
          }

pete,

Please use code tags when pasting code:

[code=c#] ..code here

[/code]

Also please follow up with your old threads. I answered your original question in the thread http://www.daniweb.com/forums/thread205618.html and suggested another way for image loading. Please mark your threads as solved if your question was answered if you would like to continue receiving help.

Next, for this problem. I have looked at a number of mapping applications and I think you should have arrows on the screen for up/down/left/right and do away with the scroll bars. Split your images up in to a lot of 25x25 or 50x50 image and as you scroll create empty picture placeholders and have a worker thread load the images as you scroll. If someone is scrolling fast and the image square goes out of view then stop loading the image and move on to the next images .. you will have a finite number of panels visible at one time depending on the device's display size and settings. If you try to load up a number of large images your performance will suffer. Take a look at google maps loads maps on their website and look at other similar applications for mobile devices. I used my iPhone. Notice how they have a grid on the background until the image loads then they replace the grid with the image.

commented: awesome. +2

skanke,

I have acted in accordance with Your advice.
Enclosed is the code, as requested.

OK, i'll take a look at it

thnx

If I show you how to load images in a thread will that get you the information you need to complete this? This is getting complicated as hell real quick :(

Unfortunately, I think I'm having problem with both image loading and positioning/placing panels where to put images. Take your time, day or two won't harm.

Sorry buddy .. I still haven't had time to get around to this. I have a project I really need to get done and I was about to pop a blood vessel earlier today because I was getting so irritated. I have to get off the computer but this is still on my radar

Ok, no problem. I'm waiting...

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.