Change image dynamically

Question

I have the requirement where i need to change the image in card layout dynamically. 
 Can someone help

venkyuppala09 · Answer

Hope the below code works for your requirement. This code also changes the image randomly on every 30 seconds without user interaction. 
 a!localVariables(
 local!images: {
 "BOOK",
 "BUILDING",
 "BRIEFCASE",
 "AIRPLANE"
 },
 local!index: a!refreshVariable(
 value: charat(rand(1), 3),
 refreshInterval: 0.5
 ),
 local!selectedImage: local!images[if(local!index > 4, 1, local!index)],
 a!cardLayout(
 contents: {
 a!billboardLayout(
 backgroundMedia: a!documentImage(
 document: a!iconNewsEvent(icon: local!selectedImage)
 ),
 backgroundColor: "#f0f0f0",
 marginBelow: "NONE",
 overlay: a!barOverlay(
 contents: {
 a!imageField(
 align: "CENTER",
 images: {
 a!forEach(
 items: local!images,
 expression: a!documentImage(
 document: if(
 local!selectedImage = fv!item,
 a!iconIndicator("HARVEY_100"),
 a!iconIndicator("HARVEY_0")
 ),
 link: a!dynamicLink(
 saveInto: {
 a!save(
 local!selectedImage,
 local!images[fv!index]
 )
 }
 )
 )
 )
 },
 size: "ICON"
 )
 }
 )
 )
 }
 )
)

Mike Schmitt · Answer

a!localVariables(
 local!indexes: {1, 2, 3, 4},
 
 local!currentIndex: local!indexes[1],
 
 a!cardLayout(
 contents: {
 a!richTextDisplayField(
 value: "Value: " & local!currentIndex
 )
 },
 link: a!dynamicLink(
 saveInto: {
 a!save(
 local!currentIndex,
 index(
 local!indexes,
 if(
 local!currentIndex = local!indexes[length(local!indexes)],
 1,
 where(local!indexes = local!currentIndex)[1] + 1
 )
 )
 )
 }
 )
 )
)

Mike Schmitt · Answer

There's currently no functionality that would allow you to perform a save action (or any other manual variable update) just via hover-over. The user would need to click something.

Mike Schmitt · Answer

Som said: Is it possible if user clicks on that card and then it will change 
 This would be pretty simple just by setting up a link using dynamicLink() and having it save a new value into a variable storing an identifier for which image you want to be displayed (i.e. the index). It could simply increment the index and, if it's currently already on the highest one, set it back to 1.

Change image dynamically

Top Replies