Topic: Top-left alignment of the image withing image area

Hi all,

First post and complete beginner with SimpleViewer-Pro.

I've setup my copy using fixed layout, and I'm very happy with the result so far. I'm missing one single thing: I would like the image to be top-left aligned within the image area, as opposed to the default center. I dont think there is an option for that in Options.as, so I guess I have to dig into the code.

Did someone do that in the past and could tell me how to proceed? I'll try to have a look myself. Will keep you posted if I manage to do anything worthwhile.

Best,
Antoine

Re: Top-left alignment of the image withing image area

Pfff... stupid me: such an easy fix!!

For reference: edit Image.as and replace these two lines:

imgX = Math.round((w-imgW)/2) + fw;
imgY =  Math.round((h-imgH)/2) + fw;

by

imgX = fw;
imgY = fw;

It's in the resizeImage() function.

May be useful for some...

Re: Top-left alignment of the image withing image area

Hi!

I am setting up my fixed layout but my problem is that the image is left aligned in the image area, and not automatically centered as i want it to.
Im not really comfortable editing actionscript code, so specific info is appreciated. If anybody knows...? Thanks! /Johan


edit: problem solved! I had set image area too small so the image was pushed up in the left corner...

Re: Top-left alignment of the image withing image area

Are there lines in the Image.as file that I can edit to make my large image bottom and left align?

Re: Top-left alignment of the image withing image area

Pfff... stupid me: such an easy fix!!

For reference: edit Image.as and replace these two lines:

imgX = Math.round((w-imgW)/2) + fw;
imgY =  Math.round((h-imgH)/2) + fw;

by

imgX = fw;
imgY = fw;

It's in the resizeImage() function.

May be useful for some...

Thanks Antoine --  This helps me greatly !

Do you have any idea how to center captions beneath an image ?

Best,
Seth

Re: Top-left alignment of the image withing image area

I did not try, to be honest. Did you check out the last version? It seems some  alignment options have been implemented, possibly including caption.

best,
Antoine

Re: Top-left alignment of the image withing image area

Are there lines in the Image.as file that I can edit to make my large image bottom and left align?

Something like this maybe?

imgY = fw + h - imgH;

Again, check the last version. The option might just be implemented...

Best,
Antoine

Re: Top-left alignment of the image withing image area

Did you check out the last version? It seems some  alignment options have been implemented

valign and halign do not work to align everything to top and left. Why not? Any ideas? Bug or feature?

Re: Top-left alignment of the image withing image area

i must say i dont know, as i have not tested the last version yet...

best,
antoine

Re: Top-left alignment of the image withing image area

abey wrote:

Are there lines in the Image.as file that I can edit to make my large image bottom and left align?

Something like this maybe?

imgY = fw + h - imgH;


Antoine, you rock! That did it. You made my day. ':D'
Also, I did try using vAlign in the new version but it did not address the issue. SO I am unsure if that means it is broken or if that means that vAlign does not affect that particular issue. Thanks again!

greg

Re: Top-left alignment of the image withing image area

you're welcome smile

Re: Top-left alignment of the image withing image area

I did not try, to be honest. Did you check out the last version? It seems some  alignment options have been implemented, possibly including caption.

best,
Antoine

Hello Antoine,

I've tried those options in the latest version and they do not work.

Thanks again for your generosity and competence,

Seth

Re: Top-left alignment of the image withing image area

I've tried those options in the latest version and they do not work.

Hi, can you please explain what doesn't work and how? thanks.

I think I haven't explained clearly what vAlign and hAlign do. They position the 'image area' and thumbnails within the swf. However the main image is still centered inside the image area. This is to allow for both wide and tall images (i.e. different image aspect ratios). The image area dimensions are defined by the maxImageWidth and maxImageHeight options. If you want your images flush to the top (for example) ensure the maxImageHeight option is the same as the height of your images. If you have images with different heights, then the shorter ones will NOT be flush to the top. Make sense?

Felix Turner
SimpleViewer Support Team.

Re: Top-left alignment of the image withing image area

I've tried those options in the latest version and they do not work.

Hi, can you please explain what doesn't work and how? thanks.

I think I haven't explained clearly what vAlign and hAlign do. They position the 'image area' and thumbnails within the swf. However the main image is still centered inside the image area. This is to allow for both wide and tall images (i.e. different image aspect ratios). The image area dimensions are defined by the maxImageWidth and maxImageHeight options. If you want your images flush to the top (for example) ensure the maxImageHeight option is the same as the height of your images. If you have images with different heights, then the shorter ones will NOT be flush to the top. Make sense?

Hi Felix,

I'm referring to the captions beneath the images.  I'd like them to be centered beneath each image.   I've tried  adjusting static var captionX:  and it doesn't budge the caption.  But that wouldn't achieve centering of all captions beneath an image anyway.

From what I've gathered it's only possible to center the captions by altering a .as document.  The fix that Antoine gave us for top aligning the image (by altering the Image.as file) worked nicely -- I'm hoping to find a similar fix for caption centering.

Thanks,
Seth

Thanks,
Seth

Re: Top-left alignment of the image withing image area

I'm referring to the captions beneath the images. I'd like them to be centered beneath each image. I've tried adjusting static var captionX: and it doesn't budge the caption.

OK. This thread is not about moving the captions its about moving the image.

For your issue, make sure 'captionUnderThumbs' is set to false, or re-download your files to get the fix. For centering the captions, yes this will involve editing the AS. Look in the doLayout() function in the StageManager.as class.

Felix Turner
SimpleViewer Support Team.

Re: Top-left alignment of the image withing image area

I think I haven't explained clearly what vAlign and hAlign do. They position the 'image area' and thumbnails within the swf. However the main image is still centered inside the image area. This is to allow for both wide and tall images (i.e. different image aspect ratios). The image area dimensions are defined by the maxImageWidth and maxImageHeight options. If you want your images flush to the top (for example) ensure the maxImageHeight option is the same as the height of your images. If you have images with different heights, then the shorter ones will NOT be flush to the top. Make sense?

Thanks for the clarification. It makes sense, but I still believe that a feature to left/centre/right align both vertically and horizontally the image within the image area is desirable. I, for one, want it top-left aligned, and manray likes it bottom-left aligned. The modification to implement that is trivial, so you may want to give it a shot. I'm happy to just change the lines by myself, though.

best,
Antoine

Re: Top-left alignment of the image withing image area

I second Antoine's suggestion. It isn't a big deal for me to go in and change the code now that I know what code to change. But it would be nice to have easy control over the image area, top, bottom, left, right ,center in various combinations. It just gives the user complete control when designing a gallery. Great component though and I can't live without it! Thanks, Felix! And thanks to Antoine for rescuing me.

Re: Top-left alignment of the image withing image area

Well, this is definitely hitting on solving my problem.  I tried the solution abey posted for a top-left alignment, and it worked.  However, I want the large image to display top and center, but I don't understand what's going on with the code well enough to know what adjustment I need to make.  What does

imgX = fw;
imgY = fw;

represent, exactly?  The "fw" part is what eludes me.

Thanks!

Re: Top-left alignment of the image withing image area

From the top of my head and without testing, top centre would be something like that:

imgX = Math.round((w-imgW)/2) + fw; 
imgY =  fw;

I'm not sure what fw is, but I reckon that it's some sort of margin to separate the main image from the rest (icons, labels, etc.)

Hope this helps,
Antoine

Re: Top-left alignment of the image withing image area

Thanks, Antoine!  That's definitely affecting what I needed.  Although, after playing with a top-left alignment for a little while, it might suit my purposes better.  Not sure yet, though.

Thanks again!

Re: Top-left alignment of the image withing image area

no prob! smile

Re: Top-left alignment of the image withing image area

SimpleViewer-Pro v1.9 allows you to align the image within the square Image Area via the 'imageVAlign' and 'imageHAlign' AS options. Pro users can use their original download link to get the latest files.

Felix Turner
SimpleViewer Support Team.

Posts [ 22 ]

Pages 1

You must login or register to post a reply