Results 1 to 14 of 14

Thread: [RESOLVED] Image Alignment issue

  1. #1

    Thread Starter
    PowerPoster SamOscarBrown's Avatar
    Join Date
    Aug 2012
    Location
    NC, USA
    Posts
    7,409

    Resolved [RESOLVED] Image Alignment issue

    In the image below, there are two vertical BLACK lines separating #13 and 14...where all the other (24 total) images have the WHITE lines separating them. The numbers are Labels on top of the Images with Transparent Backgrounds with no border.

    Each of the Image Controls have the SAME image assigned (the red/yellow rectangle).

    ALL of the images have the exact same width and height. 8, 14 and 20 all have the same Left value...9, 15, and 21 all have their same Left Values. Also, 7, 13, and 19 have same Left values as well.

    Running on Windows 10.

    Why am I seeing (in both IDE and exe) the black vertical lines?

    Name:  stuff.JPG
Views: 68
Size:  50.8 KB
    Sam I am (as well as Confused at times).

  2. #2

    Thread Starter
    PowerPoster SamOscarBrown's Avatar
    Join Date
    Aug 2012
    Location
    NC, USA
    Posts
    7,409

    Re: Image Alignment issue

    To complicate matters, I copied all of the Images only (no labels) to a second form.

    This is what I see with those same 9 images on that second form...again, lefts = lefts, and widths = widths.

    Name:  stuff2.JPG
Views: 61
Size:  36.5 KB

    EDIT: Look where black lines appear now, vice on the original form.
    Sam I am (as well as Confused at times).

  3. #3
    Frenzied Member
    Join Date
    Dec 2014
    Posts
    1,051

    Re: Image Alignment issue

    use pixels and place boxes from a function and see if it can helps.

  4. #4

    Thread Starter
    PowerPoster SamOscarBrown's Avatar
    Join Date
    Aug 2012
    Location
    NC, USA
    Posts
    7,409

    Re: Image Alignment issue

    No, I changed to Pixels and used this in Form Load:

    Code:
        Image2(1).Left = 69    
        Image2(7).Left = 69
        Image2(13).Left = 69
        Image2(19).Left = 69
        
        Image2(2).Left = 212
        Image2(8).Left = 212
        Image2(14).Left = 212
        Image2(20).Left = 212
    Looks exactly the same with the two vertical black lines
    Sam I am (as well as Confused at times).

  5. #5
    Frenzied Member
    Join Date
    Dec 2014
    Posts
    1,051

    Re: Image Alignment issue

    change all parameters for all images, left, top, width and height.

  6. #6

    Thread Starter
    PowerPoster SamOscarBrown's Avatar
    Join Date
    Aug 2012
    Location
    NC, USA
    Posts
    7,409

    Re: Image Alignment issue

    No change:

    Code:
        For x = 1 To 24        
            Image2(x).Height = 170
            Image2(x).Width = 146
        Next x
        For x = 1 To 19 Step 6
            Image2(x).Left = 69
        Next x
        For x = 2 To 20 Step 6
            Image2(x).Left = 212
        Next x
        For x = 3 To 21 Step 6
            Image2(x).Left = 355
        Next x
        For x = 4 To 22 Step 6
            Image2(x).Left = 502
        Next x
        For x = 5 To 23 Step 6
            Image2(x).Left = 648
        Next x
        For x = 6 To 24 Step 6
            Image2(x).Left = 794
        Next x
        For x = 2 To 20 Step 6
            Image2(x).Left = 212
        Next x
        
        For x = 1 To 6
            Image2(x).Top = 68
        Next x
        For x = 7 To 12
            Image2(x).Top = 237
        Next x
        For x = 13 To 18
            Image2(x).Top = 406
        Next x
        For x = 19 To 24
            Image2(x).Top = 578
        Next x
    Sam I am (as well as Confused at times).

  7. #7

    Thread Starter
    PowerPoster SamOscarBrown's Avatar
    Join Date
    Aug 2012
    Location
    NC, USA
    Posts
    7,409

    Re: Image Alignment issue

    Here's the project (so far---still in development)...

    concentration.zip

    Maybe one can see if it does the same on their computer....
    Sam I am (as well as Confused at times).

  8. #8
    Frenzied Member
    Join Date
    Dec 2014
    Posts
    1,051

    Re: Image Alignment issue

    very strange way to align the boxes, heres how i usually do:
    (I only have 1 image2(0) in the form, all other are loaded, but u can remove it if u dont use it.
    Code:
        Dim x&, y&, i&
    
        For x = 1 To 24
            Load Image2(x)
            Image2(x).Visible = True
            Image2(x).Height = 170
            Image2(x).Width = 146
        Next x
        
        For y = 1 To 4
        For x = 1 To 6
            i = i + 1
            Image2(i).Left = 148 * x
            Image2(i).Top = 172 * y
        Next x
        Next y

  9. #9
    Frenzied Member
    Join Date
    Dec 2014
    Posts
    1,051

    Re: Image Alignment issue

    looking at your code, u could create labels, images (both 1/2) using the load method at startup,
    that way u dont need to adjust it manually each one and u can place each label/image at the exact same place
    like.

    Code:
    image1(x).left = 100 + x * 172
    image2(x).left = 100 + x * 172
    label1(x).left = 120 + x * 172
    label2(x).left = 120 + x * 172
    etc. the "172" can also be placed as "const" if u want to change the margin later to something else.
    and if u need to control the zOrder u can do that as well in a loop-
    Last edited by baka; May 29th, 2020 at 12:48 PM.

  10. #10

    Thread Starter
    PowerPoster SamOscarBrown's Avatar
    Join Date
    Aug 2012
    Location
    NC, USA
    Posts
    7,409

    Re: Image Alignment issue

    Yes, I know I could load images on the fly, and align them properly. I also know that I COULD HAVE used the simple loop you showed on alignment...but I didn't take the time to do that..so I simply MANUALLY typed in each left, height, width, top.

    That SHOULD have aligned everything exactly.

    Also, using the IDE to align the images SHOULD HAVE aligned everything correctly (and each of the 24 identical images showed precisely the values they should have (lefts, heights, widths and tops).

    I will try loading images on the fly in a separate form and see what that looks like....but, DO notice how it changed in appearance when I copied/pasted all 24 images to a second form...even there they did not SEEM to be aligned properly (although all numbers matched as they should), and appeared even differently from the main form.

    I'll play around some more with loading images, but really confused why manual alignment is not appearing to work properly.
    Sam I am (as well as Confused at times).

  11. #11
    Frenzied Member
    Join Date
    Dec 2014
    Posts
    1,051

    Re: Image Alignment issue

    I suspect its about the twips. depending on dpi it will not be 1,2,3,4,5 like pixels but 20,40,60,79,99,120 , so depending where on the form, it could add a pixel or sub pixel making it look bad.
    that is why I always use pixel and place everything using a function.
    but I believe theres manifest that can be used to fix this problem, but nothing I have used and know much about.

  12. #12

    Thread Starter
    PowerPoster SamOscarBrown's Avatar
    Join Date
    Aug 2012
    Location
    NC, USA
    Posts
    7,409

    Re: Image Alignment issue

    Ok...thanks...think I will just forget it...not critical...it's not like I'm going to sell this measly little program or anything...just using it for friends and family to break up some of the boredom stuck at home thanks to China.
    Sam I am (as well as Confused at times).

  13. #13
    Sinecure devotee
    Join Date
    Aug 2013
    Location
    Southern Tier NY
    Posts
    6,000

    Re: Image Alignment issue

    I was wondering why you were spacing them 143 pixels apart when the width of the control was 146, so your images are overlapping.
    That would indicate that the white line "between" the images was actually part of the image, and was displayed in the overlapped portion, above its neighbor.
    Obviously, those two "tiles" are not overlapped correctly, so the neighbor to the right is overlapping the neighbor to the left, so you see the black left edge, rather than the white right edge of the picture.

    So, click on the image in the second column with the right mouse button and select "Bring to Front".
    Then do the same with the image in the first column.

    Since you depend on your images to overlap the neighbor on the right, you need to go through and insure that that is the case.
    If you just select each in turn, from right to left, and bring it to the front, then you will overlap in the correct order.

    Of course, most people would not design the game so that the controls had to overlap the edges in a particular Z-Order, but have the image designed such that the controls could be abutted next to each other without overlap, or with a given gap between the controls.
    Last edited by passel; May 29th, 2020 at 02:46 PM.
    "Anyone can do any amount of work, provided it isn't the work he is supposed to be doing at that moment" Robert Benchley, 1930

  14. #14

    Thread Starter
    PowerPoster SamOscarBrown's Avatar
    Join Date
    Aug 2012
    Location
    NC, USA
    Posts
    7,409

    Re: Image Alignment issue

    AH!!!! Passel, you GOTTA be right (it must be a matter of which image is above (overlapping) the other).

    @Baka...I went ahead and loaded the images at run time, and (of course) it looks fine as that 'overlapping' does not appear.

    Got it...at least now, Passel, I know WHY!

    Gonna close this one now...I feel dumb.
    Sam I am (as well as Confused at times).

Posting Permissions

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



Click Here to Expand Forum to Full Width