dcsimg
Results 1 to 9 of 9

Thread: Arrange Image Controls in a Grid

  1. #1

    Thread Starter
    Fanatic Member
    Join Date
    Apr 2017
    Posts
    550

    Arrange Image Controls in a Grid

    Below code works as long as the Image Control starts with index 0. It doesn't seem to matter how I want the Image Controls arranged in the grid. It can be 2 x 2, 3 x 3, 4 x 4,.........,5 x 5, 4 x 8, 7 x 10, or any combination of rows and columns.

    However, it wont work if The first Image is index 1. The line If n Mod NumberRows only works when I start the For Loop with a 1 but when I start it with a 2 it fails.

    Code:
    Private Sub ArrangeImages()
     Dim n As Integer
          
     Image1(0).Visible = True
      
     For n = 1 To NumberRows * NumberCols - 1
       If n Mod NumberRows Then
         Image1(n).Left = Image1(n - 1).Left + Image1(n).Width
         Image1(n).Top = Image1(n - 1).Top
         Image1(n).Visible = True
       Else
         Image1(n).Left = Image1(n - NumRows).Left
         Image1(n).Top = Image1(n - NumRows).Top + Image1(n).Height
         Image1(n).Visible = True
       End If
     Next n
    End Sub
    How can I do the same when the Images are arranged starting with index 1 through last index?

    Below doesn't work

    Code:
    Private Sub ArrangeImages()
     Dim n As Integer
          
     Image1(1).Visible = True
      
     For n = 2 To NumberRows * NumberCols 
       If n Mod NumberRows Then
         Image1(n).Left = Image1(n - 1).Left + Image1(n).Width
         Image1(n).Top = Image1(n - 1).Top
         Image1(n).Visible = True
       Else
         Image1(n).Left = Image1(n - NumRows).Left
         Image1(n).Top = Image1(n - NumRows).Top + Image1(n).Height
         Image1(n).Visible = True
       End If
     Next n
    End Sub

  2. #2
    PowerPoster
    Join Date
    Feb 2006
    Posts
    20,432

    Re: Arrange Image Controls in a Grid

    Code:
    Option Explicit
    
    Private Sub Form_Load()
        Const NUMBER_ROWS As Integer = 3
        Const NUMBER_COLS As Integer = 3
        Dim N As Integer
    
        Image1(1).Move 0, 0
        For N = 2 To NUMBER_ROWS * NUMBER_COLS
            Load Image1(N)
            With Image1(N)
                .Move .Width * ((N - 1) Mod NUMBER_COLS), .Height * ((N - 1) \ NUMBER_COLS)
                Set .Picture = Image1(1).Picture
                .Visible = True
            End With
        Next
        Caption = CStr(NUMBER_ROWS) & "x" & CStr(NUMBER_COLS)
    End Sub
    Name:  sshot.png
Views: 80
Size:  1.3 KB


    Seems to work properly here.

  3. #3

    Thread Starter
    Fanatic Member
    Join Date
    Apr 2017
    Posts
    550

    Re: Arrange Image Controls in a Grid

    Quote Originally Posted by dilettante View Post
    Code:
    Option Explicit
    
    Private Sub Form_Load()
        Const NUMBER_ROWS As Integer = 3
        Const NUMBER_COLS As Integer = 3
        Dim N As Integer
    
        Image1(1).Move 0, 0
        For N = 2 To NUMBER_ROWS * NUMBER_COLS
            Load Image1(N)
            With Image1(N)
                .Move .Width * ((N - 1) Mod NUMBER_COLS), .Height * ((N - 1) \ NUMBER_COLS)
                Set .Picture = Image1(1).Picture
                .Visible = True
            End With
        Next
        Caption = CStr(NUMBER_ROWS) & "x" & CStr(NUMBER_COLS)
    End Sub
    Name:  sshot.png
Views: 80
Size:  1.3 KB


    Seems to work properly here.
    '
    ' Works only for same size rows/cols
    '
    .Move .Width * ((N - 1) Mod NUMBER_COLS), .Height * ((N - 1) \ NUMBER_COLS)

    '
    ' Works for any combination rows/cols
    '
    .Move .Width * ((N - 1) Mod NUMBER_ROWS), .Height * ((N - 1) \ NUMBER_ROWS)

  4. #4
    PowerPoster
    Join Date
    Feb 2006
    Posts
    20,432

    Re: Arrange Image Controls in a Grid

    Code:
    Option Explicit
    
    Private Sub Form_Load()
        Const NUMBER_ROWS As Integer = 3
        Const NUMBER_COLS As Integer = 2
        Dim N As Integer
    
        Image1(1).Move 0, 0
        For N = 2 To NUMBER_ROWS * NUMBER_COLS
            Load Image1(N)
            With Image1(N)
                .Move .Width * ((N - 1) Mod NUMBER_COLS), .Height * ((N - 1) \ NUMBER_COLS)
                Set .Picture = Image1(1).Picture
                .Visible = True
            End With
        Next
        Caption = CStr(NUMBER_ROWS) & "x" & CStr(NUMBER_COLS)
    End Sub
    Name:  sshot.png
Views: 62
Size:  1.3 KB

    I think you made some kind of mistake. It works fine for me.

  5. #5

    Thread Starter
    Fanatic Member
    Join Date
    Apr 2017
    Posts
    550

    Re: Arrange Image Controls in a Grid

    Here's the code I'm using

    Code:
    Private NumRows As Integer
    Private NumCols As Integer
       '
       '
       '
    Private Sub cmdNewFormat_Click()
       ' 
       '
     NumRows = Val(txtNumRows)
     NumCols = Val(txtNumCols)
       
     ArrangeTiles
       '
       ' 
    End Sub
    
    Private Sub ArrangeTiles()
     Dim PieceIndex As Integer
     
     Image1(1).Visible = True
     
       For PieceIndex = 2 To NumRows * NumCols
         With Image1(PieceIndex)
           .Move .Width * ((PieceIndex - 1) Mod NumCols), .Height * ((PieceIndex - 1) \ NumCols)
           .Visible = True
         End With
       Next PieceIndex
    End Sub
    Variables NumRows and NumCols are initialized with the Row and Col values you see in the two textboxes. Top picture is 3 x 3 and no problem bottom picture 3 x 2 and you can see what happens. The green you see in the bottom picture is the BackColor of the picturebox the Image Controls are contained

    See anything wrong with what I am doing?
    Attached Images Attached Images   

  6. #6
    PowerPoster
    Join Date
    Feb 2006
    Posts
    20,432

    Re: Arrange Image Controls in a Grid

    Looks like you need to re-slice your source image according to your new layout. Somewhere you have rows and columns swapped.

  7. #7

    Thread Starter
    Fanatic Member
    Join Date
    Apr 2017
    Posts
    550

    Re: Arrange Image Controls in a Grid

    I do. Every time I call ArrangeTiles I also call the sub that re-slices the picture into the smaller pieces to fill in the Image Controls

    The grid is like this:

    Code:
        3 x 3
    +---+---+---+
    | 1 | 2 | 3 |
    +---+---+---+
    | 4 | 5 | 6 |
    +---+---+---+
    | 7 | 8 | 9 |
    +---+---+---+
    
    
        3 x 2
    +---+---+---+
    | 1 | 2 | 3 |
    +---+---+---+
    | 4 | 5 | 6 |
    +---+---+---+
    Here's the code that does the slicing:

    Code:
    Private Sub cmdNewFormat()
       '
       '
     NumRows = Val(txtNumRows)
     NumCols = Val(txtNumCols)
    
     '
     ' Make new tile sizes according to the new format
     '
     For PieceIndex = 1 To NumRows * NumCols
       Image1(PieceIndex).Width = (Picture2.Width) \ Val(txtNumRows.Text)
       Image1(PieceIndex).Height = (Picture2.Height) \ Val(txtNumCols.Text)
     Next PieceIndex
      
     ArrangeTiles
        '
        '
     ShowTiles
        '
        '
        '
    End Sub
    
    Private Sub ArrangeTiles()
     Dim PieceIndex As Integer
     
     Image1(1).Visible = True
     
       For PieceIndex = 2 To NumRows * NumCols
         With Image1(PieceIndex)
           .Move .Width * ((PieceIndex - 1) Mod NumCols), .Height * ((PieceIndex - 1) \ NumCols)
           .Visible = True
         End With
       Next PieceIndex
    End Sub
    
    Private Sub ShowTiles()
     Dim PieceIndex As Integer
     Dim X As Integer, Y As Integer
     Dim YOffset As Integer, XOffset As Integer
     
     '
     ' Source Picture
     '
     xSize = Picture1.ScaleWidth \ NumRows
     ySize = Picture1.ScaleHeight \ NumCols
     
     PieceIndex = 0
    
     For Y = 1 To NumCols: YOffset = (Y - 1) * ySize
       For X = 1 To NumRows: XOffset = (X - 1) * xSize
          
         PieceIndex = PieceIndex + 1
         
         picTile.PaintPicture _
                  Picture1.Picture, _
                  0, 0, _
                  Image1(1).Width, _
                  Image1(1).Height, _
                  XOffset, YOffset, _
                  xSize, ySize
         
         Image1(PieceIndex).Picture = picTile.Image
       Next
     Next
    End Sub
    Last edited by Code Dummy; May 27th, 2019 at 08:37 PM.

  8. #8
    Sinecure devotee
    Join Date
    Aug 2013
    Location
    Southern Tier NY
    Posts
    5,338

    Re: Arrange Image Controls in a Grid

    X goes across the page, i.e. Columns.
    Y goes down the page, i.e. Rows.
    In your code is the Y loop doing Rows, and the X loop doing Columns?

  9. #9

    Thread Starter
    Fanatic Member
    Join Date
    Apr 2017
    Posts
    550

    Re: Arrange Image Controls in a Grid

    It does appear that way. All I know is that the code in sub ShowTiles works correctly by loading pictures into the Image Controls. The code is not mine, I got it from here. I never gave any thought to it and I never changed it. I see now what's going on. Dilettante's code does work correctly using NumCols but for some reason, which loading the pictures has nothing to do with it, I have to use NumRows instead of NumCols. Haven't figured that one out yet but as long as it works in the end I guess I'll stay with what I have.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  



Featured


Click Here to Expand Forum to Full Width