I am new to Composer. I am trying to create a slider that a user can move to see a corresponding change in opacity of a photo, such that a photo below is revealed. In other words as the slider is moved left or right along the x axis, the top image becomes more or less transparent revealing the image below.
To create the slider, I made a long horizontal graphic bar with a center point marked and placed it in a horizontal scroll window 1/3 the length of the bar and the same height. I restricted the movement of the graphic bar to the X axis.
I selected the graphic bar as the target from and photo image as the target to, binding the X value of the graphic bar over the opacity of the image. I then selected linear convertor and entered the Input A as the X value that would correspond to 100% opacity and the Input B as the X value that would show 0% opacity.
This approach has not been successful when I play the program.
Any suggestions about what I may be doing wrong or about another approach to solve this problem?
I have successfully create a program where a touch gesture automatically fades one image above another, but I really hope to create a 1:1 correspondence between movement of a graphic element with opacity change of an image.
Thanks for the info and file. I was able to follow your example and set up a similar scroll collection. It worked well, but then I encounter a problem. Somehow I changed something, and the center square and bar in the scroll window would scroll past the edge of the Scroll window not completing the full 0% to 100% opacity change. (The elasticity button is unchecked in the Scroll properties.) When I highlight the bar graphic in the scroll window, I see the shape of the bar highlighted, but there is also a larger highlighted frame that is longer than the bar and much wider. I double checked the dimensions for the bar and they are correct. I can see no way of removing the larger highlighted frame, which seem to be connected with the bar and center square scrolling past the edge of the scroll window.