[RESOLVED] Updating Controls Simultaneously

[PrizeGotti]

Hi all,

I'm struggling to find any information on this, as I'm probably using the wrong terminology.

I have two PictureBox controls, which I want to update at exactly the same time.

Given the nature of IFTTT languages, how do I do this?

I can clearly see a delay between PictureBox1 updating with a different image and PictureBox2 updating with different, given that in the code it tells it to update in that order.

I tried using AND in a With statement but that failed.

Can anyone point me in the right direction?

Many thanks!

[wes4dbt]

You need to post your code so we can see what your doing.

[dday9]

While I am not very proficient in the concept, this sounds like a candidate for parallelism. This is Microsoft's explanation of parallel programming (documentation):

Many personal computers and workstations have multiple CPU cores that enable multiple threads to be executed simultaneously. To take advantage of the hardware, you can parallelize your code to distribute work across multiple processors.

I ran a quick test on my end and this appears to have 0 delay:

Public Class Form1

    Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        Dim pictureBox1 = New PictureBox() With {
            .Anchor = AnchorStyles.Bottom Or AnchorStyles.Left Or AnchorStyles.Right Or AnchorStyles.Top,
            .BorderStyle = BorderStyle.FixedSingle,
            .Location = New Point(5, 5),
            .Name = "PictureBox1",
            .Size = New Size(ClientSize.Width \ 2 - 10, ClientSize.Height \ 2 - 2),
            .SizeMode = PictureBoxSizeMode.Zoom
        }
        Dim pictureBox2 = New PictureBox() With {
            .Anchor = pictureBox1.Anchor,
            .BorderStyle = pictureBox1.BorderStyle,
            .Location = New Point(pictureBox1.Right + 5, pictureBox1.Top),
            .Name = "PictureBox2",
            .Size = pictureBox1.Size,
            .SizeMode = pictureBox1.SizeMode
        }
        Dim buttonLoad = New Button() With {
            .Location = New Point(pictureBox1.Left, pictureBox1.Bottom + 5),
            .Name = "ButtonLoad",
            .Text = "Load"
        }

        Controls.AddRange({pictureBox1, pictureBox2, buttonLoad})
        AddHandler buttonLoad.Click, AddressOf ButtonLoad_Click
    End Sub

    Private Sub LoadImage(controlName As String, filePath As String)
        Invoke(Sub() DirectCast(Controls.Find(controlName, False)(0), PictureBox).Load(filePath))
    End Sub

    Private Sub ButtonLoad_Click(sender As Object, e As EventArgs)
        Using fileDialog = New OpenFileDialog()
            If (fileDialog.ShowDialog = DialogResult.OK) Then
                Parallel.Invoke(Sub() LoadImage("PictureBox1", fileDialog.FileName), Sub() LoadImage("PictureBox2", fileDialog.FileName))
            End If
        End Using
    End Sub
End Class

[PrizeGotti]

While I am not very proficient in the concept, this sounds like a candidate for parallelism. This is Microsoft's explanation of parallel programming (documentation):


I ran a quick test on my end and this appears to have 0 delay:

Public Class Form1

    Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        Dim pictureBox1 = New PictureBox() With {
            .Anchor = AnchorStyles.Bottom Or AnchorStyles.Left Or AnchorStyles.Right Or AnchorStyles.Top,
            .BorderStyle = BorderStyle.FixedSingle,
            .Location = New Point(5, 5),
            .Name = "PictureBox1",
            .Size = New Size(ClientSize.Width \ 2 - 10, ClientSize.Height \ 2 - 2),
            .SizeMode = PictureBoxSizeMode.Zoom
        }
        Dim pictureBox2 = New PictureBox() With {
            .Anchor = pictureBox1.Anchor,
            .BorderStyle = pictureBox1.BorderStyle,
            .Location = New Point(pictureBox1.Right + 5, pictureBox1.Top),
            .Name = "PictureBox2",
            .Size = pictureBox1.Size,
            .SizeMode = pictureBox1.SizeMode
        }
        Dim buttonLoad = New Button() With {
            .Location = New Point(pictureBox1.Left, pictureBox1.Bottom + 5),
            .Name = "ButtonLoad",
            .Text = "Load"
        }

        Controls.AddRange({pictureBox1, pictureBox2, buttonLoad})
        AddHandler buttonLoad.Click, AddressOf ButtonLoad_Click
    End Sub

    Private Sub LoadImage(controlName As String, filePath As String)
        Invoke(Sub() DirectCast(Controls.Find(controlName, False)(0), PictureBox).Load(filePath))
    End Sub

    Private Sub ButtonLoad_Click(sender As Object, e As EventArgs)
        Using fileDialog = New OpenFileDialog()
            If (fileDialog.ShowDialog = DialogResult.OK) Then
                Parallel.Invoke(Sub() LoadImage("PictureBox1", fileDialog.FileName), Sub() LoadImage("PictureBox2", fileDialog.FileName))
            End If
        End Using
    End Sub
End Class

Parallelism! Excellent, that will help me locate the resources and knowledge on the subject now I know what it was call. My example was just an example which I had tested in the past to see if it was possible, and upon testing your code it's apparent that it is. That worked really well, no noticeable delay between either images. Thank you very much!

[TysonLPrice]

Cool...I almost posted it couldn't be done. I should have known someone would find a way.

[wes4dbt]

I'm surprised you could see a lag when loading two images, unless there is something unusual about the images. That's why I wanted to see the code.

I can't see any lag,

    Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
        Dim fs As New System.IO.FileStream("c:\ajunk2019\image1.jpg", IO.FileMode.Open)
        Dim fs2 As New System.IO.FileStream("c:\ajunk2019\image2.jpg", IO.FileMode.Open)
        Try

            PictureBox1.Image = New Bitmap(Image.FromStream(fs))
            PictureBox2.Image = New Bitmap(Image.FromStream(fs2))

        Catch ex As Exception
            MessageBox.Show("Error loading images", "Error Opening Image File")
        End Try
    End Sub

[PrizeGotti]

I'm surprised you could see a lag when loading two images, unless there is something unusual about the images. That's why I wanted to see the code.

I can't see any lag,

    Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
        Dim fs As New System.IO.FileStream("c:\ajunk2019\image1.jpg", IO.FileMode.Open)
        Dim fs2 As New System.IO.FileStream("c:\ajunk2019\image2.jpg", IO.FileMode.Open)
        Try

            PictureBox1.Image = New Bitmap(Image.FromStream(fs))
            PictureBox2.Image = New Bitmap(Image.FromStream(fs2))

        Catch ex As Exception
            MessageBox.Show("Error loading images", "Error Opening Image File")
        End Try
    End Sub

When running in a loop that changes the image 30 times per second, after a few iterations there's a noticeable delay on my system.

[wes4dbt]

When running in a loop that changes the image 30 times per second, after a few iterations there's a noticeable delay on my system.

30 time per second. I hope there's not a quiz at the end. lol

[passel]

When running in a loop that changes the image 30 times per second, after a few iterations there's a noticeable delay on my system.

Hopefully you're disposing your objects properly. It sounds like it might be memory getting filled up and then a lot of garbage collecting that may be delaying your processing.

[dbasnett]

... I have two PictureBox controls, which I want to update at exactly the same time.
... I can clearly see a delay between PictureBox1 updating with a different image and PictureBox2 updating with different, given that in the code it tells it to update in that order.

I believe that the .Image of a PictureBox control can only be accessed from the UI so you can't update them at exactly the same time.

I wrote this code to see the issue. The one thing that seemed to make the biggest difference was the .SizeMode of the PictureBox. When it was set to Normal the appearance was close to simultaneous.

Here is the code so you can play with it yourself. Your form will need two PictureBoxes, two Labels, and a Timer.

    Private Sub Form1_Shown(sender As Object, e As EventArgs) Handles Me.Shown
        Dim mode As PictureBoxSizeMode
        'mode = PictureBoxSizeMode.Zoom
        mode = PictureBoxSizeMode.Normal

        PictureBox1.SizeMode = mode
        PictureBox2.SizeMode = mode

        Timer1.Interval = 30
        Timer1.Enabled = True
    End Sub

    Private Sub Timer1_Tick(sender As Object, e As EventArgs) Handles Timer1.Tick
        'first time this is slow
        '  because we are creating an image for every file
        ' on my system 104 files
        Static pics() As Image = (From f In IO.Directory.GetFiles(Environment.GetFolderPath(Environment.SpecialFolder.MyPictures), "*.jp*")
                                   Select Image.FromFile(f)).ToArray
        Static whPic As Integer = 0
        Static ct As Integer = 0

        Static stpw As Stopwatch = Stopwatch.StartNew
        If whPic >= pics.Length Then
            whPic = 0
        End If

        Dim time1 As Long = stpw.ElapsedTicks
        PictureBox1.Image = pics(whPic)
        time1 = stpw.ElapsedTicks - time1

        whPic += 1
        If whPic >= pics.Length Then
            whPic = 0
        End If
        PictureBox2.Image = pics(whPic)

        ct += 1
        Label1.Text = (ct / stpw.Elapsed.TotalSeconds).ToString("n2")
        Label2.Text = time1.ToString("n2")
    End Sub

[passel]

If you're updating the whole picturebox 30 times per second, then perhaps it would be better to bypass the standard way of updating the area of the picturebox, i.e. update the area yourself using a BufferedGraphics object.

Since you would be handling the drawing yourself, the drawing and rendering can be done in any thread, not just the UI thread, so you could use two background threads to work on each drawing independently, i.e. in parallel.

Here is one thread that describes it a bit and gives an example.