Livecode and Image gallery.

[zaxos]

hello everyone, i'm trying to make a program that will display all images in a folder, i have no idea where to start from! For now i create buttons for each image and i set the icon of the button to that image, then i have to find a way to align those images across the stack...
Any help would be appreciated .

[dunbarx]

Hi.

Importing images onto existing controls would work, but why not just keep them as images? These are perfectly valid controls in LC. You can "Import as control" from the "File" menu, or lots of other ways.

Remember to lock the size of these images after they are imported and sized to your liking. You can do this in the inspector if you like.

To array them in a grid, well, let me ask you first, how much experience with LC do you have? Where are you in learning this program? Lots of fun ways to do this as well...

Craig Newman

[zaxos]

hey dunbarx, let me be more specific, i'm going to take the paths of the images from a database, then load them in LC, i want them to be buttons because when i click on them they will load a new card with information about the image ( much like PopcornTime if you know it...) my experience with LC is average i can say, i'v been working on it for the last month, i try'd to use a Grid and i successfully loaded the images but that's as far as my knowledge goes and i thought creating a button for every item in the database would be easier but i'm having hard times aranging them across the stack. If you have any suggestions i'd be glad to know

[dunbarx]

Welcome to LC and this forum.

Did you know that any control in LC can respond to mouse actions (like "mouseUp)"? Just want to make sure you do not needlessly use superfluous buttons. Images can have scripts just like all other controls.

Are all the images the same size? Are you familiar with such LC words as "loc", "rect", "left" (and its cousins), "width"? Have you used the "Align Objects" gadget in the inspector, when selecting multiple objects? This only works in one dimension at a time, so it has limited use in an array, but is good to know about, and is handy now and then.

If you are familiar with some of the above terms, can you plan a method of arranging your images? You may not have all the vocabulary yet, but I am interested in knowing if you can mentally set up a method:

figure out the array extent -- how many "X" by how many "Y"
figure out the desired spacing in each axis
lay out a common starting point in "X" and "Y"
distribute the images according to the above rules.

That sort of thing, to be able to suggest what language elements would be appropriate in each stage.

For example, is this way below or way above you at this time?

Code: Select all

set the top of img 1 to the top of img 2
set the left of img 1 to (the right of img 2) + 10

What is most important is that you have the capability to do what you want, or nearly so. You can learn as you go, and will receive enormous help here. But you have to do this yourself, and that requires a certain ability level to be able to tackle the task at hand. Write back with your thoughts. This may not come at once, but it will certainly come at last.

Craig

[Simon]

Craig is correct, but for now exchange the word "array' with "grid" (this is just a personal feeling).
And if you have any concerns, liveCode does this sort of thing without even blinking.

Simon

[dunbarx]

Simon is correct. "Array" is a very well defined word in LC, has nothing to do with your issue, and so could cause confusion.

Craig

[Simon]

Yep, That's what I meant

Simon

[zaxos]

i'v been trying out things like "loc" , "top" , "left" etc. but for now i think the best way as you suggested is the Grid if i can get it to look the way i want, i'l be posting back the code i use in case i cant figure it out, thank you for your time for now, i'm pretty sure that i'l need you soon enough!

[zaxos]

After a lot of trial and failure i'v managed to create the buttons along the stack the way i want them, add images to them as icon, and add scripts to each one of them. What i cant seem to be able to manage is that if my stack has the size to fit lets say 50 buttons, and i create 100, i need a way to scroll down the card and see the rest of the buttons... i'm guessing that i'l have to group the buttons and then create a scrollbar control? i still can seem to understand it

EDIT: Nevermind, grouping actualy did the trick

[zaxos]

I cant seem to get the outcome i want, i was wondering isn't there a container or something that auto arranges control within it to the proportions of it? i'm pretty sure that i'm missing something here...

[zaxos]

Code: Select all

on ArrangeButtons
   put empty into testTL2
   put empty into testTL
   put the topRight of group "buttons" into testTL2
   put the topLeft of group "buttons" into testTL
   add 10 in item 1 of testTL
   add 10 in item 2 of testTL
   set itemDel to cr
   --add -90 to item 1 of testTL2
   --repeat for each line atheData in theData2
   repeat for each element atheData in theData["test"]
      if item 1 of testTL >= item 1 of testTL2 then add 200 to item 2 of testTL
      if item 1 of testTL >= item 1 of testTL2 then put 10 into item 1 of testTL
      --if there is an img atheData then
         set the topleft of img atheData to testTL
         set itemDel to comma
         add 190 to item 1 of testTL
      --else
      --end if
   end repeat
   set the vScrollBar of group "buttons" to true
   set the vScroll of group "buttons" to 0
end ArrangeButtons

This is the code i used to arrange images inside a group, i post it in case someone else needs it, any suggestions or questins are welcomed.