adding image-links to current layout - rebol

Question

I'm playing around with Rebol, and Can't figure out how I can add components from the user back to my layout.

I have a layout that has images, taken from image-urls, linked to articles/videos online. I want to add more images linked to their corresponding articles/videos online, taken from the user as 2 urls (one for the image and one for the article/video).

Do I use a list, add the two links to the list and call the view again using show as the button event? Is there a way to add it without refreshing my whole layout?

Answer 1

You can use a list, but it's a tricky beast. I'll include an example here so that you can evaluate the way it works and if it's right for you.

With a list, you define a layout, then modify the layout dynamically based on some data or other. To illustrate, here's some icons:

icons: [
    http://reb4.me/r/html-document.png
    http://reb4.me/r/pdf-document.png
    http://reb4.me/r/excel-document.png
    http://reb4.me/r/word-document.png
    http://reb4.me/r/zip-document.png
]

The list style consists of a size, layout and a supply function (and I'm going to zap the edge):

view center-face layout [
    across

    lst: list 48x240 edge none [image 48x48] supply [
        face/image: all [
            img: pick icons count
            load-image img
        ]
    ]

    btn "Random" [
        icons: random icons
        show lst
    ]
]

Included at the bottom is a button that modifies our data, then redisplays only the list.

• Size is 48x240 — list works vertically, calling the supply function (list height / iterative layout height) times. I have five icons, so multiplied the icon height by five.

• The [image 48x48] is our iterative layout. Note that we only define one face in this example. Unlike generic layouts, a list layout is created using the layout/tight refinement—you need to be specific if you want alternate spacing.

• The supply [...] part is our supply function. This is shorthand for a function that will be created and called to update the list. That function is func [face count index][...] where face is the operative face; count is the position in the list; and index is the face's offset in the iterative layout.

• It's key to remember that iterative layout is only created once. As the count increases, you are merely changing the attributes of the faces within that layout.

• You only need show the list, not the whole layout.

So from here, you can see the relationship between the data source and the display.